axios 请求不返回 Token

Question

我正在尝试为我的请求应用令牌。所以我试图 console.log 请求的结果，并且在对象数组中找不到任何令牌。

Object {
  "config": Object {
    "adapter": [Function xhrAdapter],
    "data": "ktp=3578270708950002&member=199508070003",
    "headers": Object {
      "Accept": "application/json, text/plain, */*",
      "Content-Type": "application/x-www-form-urlencoded",
    },
    "maxContentLength": -1,
    "method": "post",
    "timeout": 0,
    "transformRequest": Object {
      "0": [Function transformRequest],
    },
    "transformResponse": Object {
      "0": [Function transformResponse],
    },
    "url": "http://103.53.10.122/mobile/LoginCheck.php",
    "validateStatus": [Function validateStatus],
    "xsrfCookieName": "XSRF-TOKEN",
    "xsrfHeaderName": "X-XSRF-TOKEN",
  },
  "data": Array [
    Object {
      "status": "67457",
    },
  ],
  "headers": Object {
    "connection": "keep-alive",
    "content-type": "text/html; charset=UTF-8",
    "date": "Fri, 22 Dec 2017 05:38:21 GMT",
    "server": "nginx",
    "transfer-encoding": "chunked",
    "vary": "Accept-Encoding",
  },
  "request": XMLHttpRequest {
    "DONE": 4,
    "HEADERS_RECEIVED": 2,
    "LOADING": 3,
    "OPENED": 1,
    "UNSENT": 0,
    "_aborted": false,
    "_cachedResponse": undefined,
    "_hasError": false,
    "_headers": Object {
      "accept": "application/json, text/plain, */*",
      "content-type": "application/x-www-form-urlencoded",
    },
    "_incrementalEvents": false,
    "_lowerCaseResponseHeaders": Object {
      "connection": "keep-alive",
      "content-type": "text/html; charset=UTF-8",
      "date": "Fri, 22 Dec 2017 05:38:21 GMT",
      "server": "nginx",
      "transfer-encoding": "chunked",
      "vary": "Accept-Encoding",
    },
    "_method": "POST",
    "_requestId": null,
    "_response": "[{\"status\":\"67457\"}]",
    "_responseType": "",
    "_sent": true,
    "_subscriptions": Array [],
    "_timedOut": false,
    "_trackingName": "unknown",
    "_url": "http://103.53.10.122/mobile/LoginCheck.php",
    "readyState": 4,
    "responseHeaders": Object {
      "Connection": "keep-alive",
      "Content-Type": "text/html; charset=UTF-8",
      "Date": "Fri, 22 Dec 2017 05:38:21 GMT",
      "Server": "nginx",
      "Transfer-Encoding": "chunked",
      "Vary": "Accept-Encoding",
    },
    "responseURL": "http://103.53.10.122/mobile/LoginCheck.php",
    "status": 200,
    "timeout": 0,
    "upload": XMLHttpRequestEventTarget {},
    "withCredentials": true,
  },
  "status": 200,
  "statusText": undefined,
}

有人可以告诉我如何添加令牌进行身份验证，因为即使在阅读之后我仍然对这个概念感到困惑。所以如果我没记错的话，我应该按顺序执行以下操作：

1. 用户成功登录时生成令牌
2. 将令牌保存在本地存储中
3. 为每个请求使用令牌（后端如何检查令牌的有效性？）

任何帮助将不胜感激

Answer 1

根据后端处理 API 请求的方式，您应该使用 axios.get 并将令牌附加到 URL 或使用 axios.post 并将对象作为正文传递给带有令牌的方法。 例如

axios.post('http://103.53.10.122/mobile/LoginCheck.php', {
    username: "test",
    password: "1234"
})
.then((res) => {
     console.log(res);
     /*
    In this example I assume that res.data has the token returned from the backend
    The res.data should look like this then:
    {
        token: "1234"
    }
     */
    let token = res.data.token;
    AsyncStorage.setItem("token", token);
})
.catch((err) => {
    console.log(err);
});

要为每个请求使用令牌，请将其保存在 AsyncStorage 中以进行持久存储，如果您使用的是 redux，则将其保存在 redux 状态。

在服务器端，您可以生成一个 JSON Web 令牌，其中包含验证用户所需的所有数据，并使用存储在数据库中的数据对其进行验证。由于您使用的是 PHP，我可以向您推荐结合 PHP 的 JSON Web 令牌介绍：https://www.sitepoint.com/php-authorization-jwt-json-web-tokens/