React google登录不能与axios一起工作

// 示例：Node.js 后端设置 CORS
const express = require('express');
const cors = require('cors');
const app = express();

app.use(cors());

app.get('/data', (req, res) => {
  res.json({ message: 'Hello from server!' });
});

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

// 示例：React 组件中使用 Google 登录和 Axios
import React, { useEffect } from 'react';
import axios from 'axios';

const App = () => {
  const handleGoogleLogin = async () => {
    // 假设这是 Google 登录成功后的回调函数
    const token = 'your_google_token';

    // 设置 Axios 的认证头
    axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;

    try {
      const response = await axios.get('https://your-api-endpoint.com/data');
      console.log(response.data);
    } catch (error) {
      console.error('Error fetching data:', error);
    }
  };

  useEffect(() => {
    handleGoogleLogin();
  }, []);

  return (
    <div>
      <h1>React Google Login with Axios</h1>
    </div>
  );
};

export default App;

// 示例：使用 Redux 管理状态
import { createStore } from 'redux';

const initialState = {
  token: null,
  data: null,
  error: null,
};

const reducer = (state = initialState, action) => {
  switch (action.type) {
    case 'SET_TOKEN':
      return { ...state, token: action.payload };
    case 'SET_DATA':
      return { ...state, data: action.payload };
    case 'SET_ERROR':
      return { ...state, error: action.payload };
    default:
      return state;
  }
};

const store = createStore(reducer);

// 在组件中使用 Redux
import React, { useEffect } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import axios from 'axios';

const App = () => {
  const dispatch = useDispatch();
  const token = useSelector(state => state.token);
  const data = useSelector(state => state.data);
  const error = useSelector(state => state.error);

  const handleGoogleLogin = async () => {
    // 假设这是 Google 登录成功后的回调函数
    const googleToken = 'your_google_token';

    dispatch({ type: 'SET_TOKEN', payload: googleToken });

    try {
      const response = await axios.get('https://your-api-endpoint.com/data', {
        headers: { Authorization: `Bearer ${googleToken}` },
      });
      dispatch({ type: 'SET_DATA', payload: response.data });
    } catch (err) {
      dispatch({ type: 'SET_ERROR', payload: err.message });
    }
  };

  useEffect(() => {
    handleGoogleLogin();
  }, []);

  return (
    <div>
      <h1>React Google Login with Axios</h1>
      {error && <p>Error: {error}</p>}
      {data && <p>Data: {JSON.stringify(data)}</p>}
    </div>
  );
};

export default App;