Axios 正在發送錯誤的令牌

Question

在 React 中，這是有效的：

let token = localStorage.getItem("token");

axios
      .post(
        `http://localhost/api`,
        (data: data),
        {
          crossdomain: true,
        },
        {
          headers: {
            Authorization: `Bearer ${token}`,
            Accept: "application/json",
            "Content-Type": "application/json",
            "Access-Control-Allow-Origin": "*",
            "Access-Control-Allow-Methods": "POST",
            "Access-Control-Allow-Headers": "Content-Type, Authorization",
            "Access-Control-Allow-Credentials": "true"
          },
        }
      )

一切都好。 它帶來成功。

但是在 React Native (AsyncStorage) 中，它給出了錯誤的令牌錯誤 (403)：

let token = AsyncStorage.getItem("token");

    axios
          .post(
            `http://localhost/api`,
            (data: data),
            {
              crossdomain: true,
            },
            {
              headers: {
                Authorization: `Bearer ${token}`,
                Accept: "application/json",
                "Content-Type": "application/json",
                "Access-Control-Allow-Origin": "*",
                "Access-Control-Allow-Methods": "POST",
                "Access-Control-Allow-Headers": "Content-Type, Authorization",
                "Access-Control-Allow-Credentials": "true"
              },
            }
          )

在 console.log(token) 中，一切看起來都很棒。 我可以看到我的令牌。 它也適用於 Postman。

Answer 1

根據文檔：

回報：

Promise使用字符串值解析，如果給定key存在條目，否則null 。

Promise也可以在底層存儲錯誤的情況下被拒絕。

由於它返回Promise ，因此您應該使用.then()或async/await獲取令牌：

async function doRequest() {
  let token = await AsyncStorage.getItem("token");
  // do request
} 

Answer 2

我想知道以后看到這個帖子的人Axios沒有在React-Native中發送我的標題。 在這種情況下，也許你應該嘗試 fetch。

@Rafael 的回答也很棒。

fetch("http://localhost/api", {
      method: "post",
      headers: new Headers({
        "x-auth-token": `${token}`,
        "Content-Type": "application/json",
      }),
      body: {
        body
      },
    });