React Http axios 獲取發送到 Flask 的請求 服務器到達時沒有添加到其標頭中的 jwt

Question

我正在嘗試通過從 React 客戶端向 Flask 服務器發送 axios get 請求來獲取用戶數據。

這是我的獲取請求：

axios.get("http://10.0.0.14:5000/users")

這是請求在發送到服務器之前正在經歷的攔截器，並隨 JWT 一起提供：

    axios.interceptors.request.use(req=>
    {
        
        req.headers['x-access-token']=authSvr.getToken()
        return req
    })

這是 Flask 的一部分，負責處理 jwt：

@app.before_request
def check_token():
    auth_bl=AuthBL()
    if "/auth" not in request.url:
        if request.headers and request.headers.get('x-access-token'):
            token = request.headers.get('x-access-token')
            
            exist = auth_bl.verify_token(token)
            if exist is None:
                return make_response({"error" : "Not authorized"},401)
        else:
            return make_response({"error" : "No token provided"},401)

出於某種原因，當我打印請求標頭時，例如print(request.headers) ，這就是我所看到的：

Access-Control-Request-Method: GET
Access-Control-Request-Headers: x-access-token
Origin: http://localhost:3000
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36
Sec-Fetch-Mode: cors
Referer: http://localhost:3000/
Accept-Encoding: gzip, deflate

如您所見，我沒有 x-access-token 密鑰，而是作為密鑰 Access-Control-Request-Headers 的值發送的。

有誰知道如何解決這個問題？ 謝謝

Answer 1

如果您使用的是不記名令牌，您可以試試這個：

你可以通過標題發送你的令牌

const headers = { Authorization: `Bearer ${token}` };

axios.get("your api url", { headers })
     .then(response => {
        // on success code
      })
     .catch(error => {
         // on error code
      })