GET请求未携带Auth Header：express-jwt与Auth0集成的浏览器鉴权问题

我已经把express-jwt和Auth0的配置完成并投入使用了，现在碰到个特别困惑的问题：用curl或者Postman手动指定Authorization token的时候，页面能正常加载；但用浏览器直接访问的话，express-jwt中间件就会提示「未提供token」，而且查请求头发现完全没有Auth相关的头部信息。我用的是Express框架，实在搞不懂问题出在哪。

补充说明：我已经附上了示例代码，不确定还需要提供其他什么信息，这只是一个带JWT鉴权的简单React应用，麻烦大家帮忙分析下！

后端Express配置示例 #

const express = require('express');
const jwt = require('express-jwt');
const jwksRsa = require('jwks-rsa');

const app = express();

// Auth0配置参数
const authSettings = {
  domain: 'your-auth0-domain.example.com',
  audience: 'your-api-audience'
};

// 配置JWT鉴权中间件
app.use(jwt({
  secret: jwksRsa.expressJwtSecret({
    cache: true,
    rateLimit: true,
    jwksRequestsPerMinute: 5,
    jwksUri: `https://${authSettings.domain}/.well-known/jwks.json`
  }),
  audience: authSettings.audience,
  issuer: `https://${authSettings.domain}/`,
  algorithms: ['RS256']
}).unless({ path: ['/public'] }));

// 受保护的路由
app.get('/protected', (req, res) => {
  res.json({ message: '访问受保护资源成功', user: req.user });
});

app.listen(3001, () => {
  console.log('后端服务运行在3001端口');
});

前端React请求示例 #

import { useEffect } from 'react';
import axios from 'axios';

function ProtectedPage() {
  useEffect(() => {
    const fetchProtectedContent = async () => {
      try {
        // 假设从localStorage获取之前登录得到的token
        const authToken = localStorage.getItem('auth0Token');
        const response = await axios.get('http://localhost:3001/protected', {
          headers: {
            Authorization: `Bearer ${authToken}`
          }
        });
        console.log('获取到的受保护内容:', response.data);
      } catch (err) {
        console.error('请求失败:', err.response?.data || err.message);
      }
    };

    fetchProtectedContent();
  }, []);

  return <div>受保护页面</div>;
}

export default ProtectedPage;

内容的提问来源于stack exchange，提问作者Shaun O' Neill