如何在React中使用来自passportjs策略的访问消息

// 后端服务器文件（例如使用Express）
const express = require('express');
const passport = require('passport');
const LocalStrategy = require('passport-local').Strategy;

const app = express();

// 配置passport本地策略
passport.use(new LocalStrategy(
  function(username, password, done) {
    // 在这里进行用户名和密码的验证
    // 验证成功调用done(null, user)，验证失败调用done(null, false)
  }
));

// 登录路由
app.post('/login', passport.authenticate('local'), function(req, res) {
  // 登录成功的处理逻辑
  res.send('登录成功');
});

// 前端React组件
import React, { useState } from 'react';
import axios from 'axios';

const Login = () => {
  const [username, setUsername] = useState('');
  const [password, setPassword] = useState('');
  const [message, setMessage] = useState('');

  const handleSubmit = async (e) => {
    e.preventDefault();

    try {
      const response = await axios.post('/login', { username, password });
      setMessage(response.data);
    } catch (error) {
      setMessage('登录失败');
    }
  };

  return (
    <div>
      <form onSubmit={handleSubmit}>
        <input type="text" value={username} onChange={(e) => setUsername(e.target.value)} />
        <input type="password" value={password} onChange={(e) => setPassword(e.target.value)} />
        <button type="submit">登录</button>
      </form>
      <p>{message}</p>
    </div>
  );
};

export default Login;