Axios 和推特 API

Question

我在使用 axios 和 Twitter 时遇到问题 API。

我使用 Postman 发出了成功的请求（设置了授权 header - OAuth 1.0）。现在我正在尝试做同样的事情，但我得到的是：

Failed to load https://api.twitter.com/1.1/lists/statuses.json: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 400.

我还在 Network chrome 选项卡中看到，只有 OPTIONS 正在发送。

这是我的 axios 配置的样子（更改了凭据；））：

const api = axios.create({
    baseURL: 'https://api.twitter.com/1.1',
    headers: {
      // Authorization was copied from the Postman headers
      Authorization: 'OAuth oauth_consumer_key="consumer_key",oauth_token="token",,oauth_signature_method="H,MAC-SHA1",,oauth_timestamp="1,515677408",,oauth_nonce="nonce",,oauth_version="1,.0",,oauth_signature="signature"',
    },
    withCredentials: true,
  });

  const getListStatuses = (owner_screen_name, slug) => {
    return api.get('/lists/statuses.json', { owner_screen_name, slug });
  };

我错过了什么？

Answer 1

这是一个 CORS 问题，浏览器采用的一种安全措施（这解释了为什么您可以通过 Postman 做到这一点）。

基本上，Chrome 将预检请求发送到服务器以了解它的期望，并且服务器不会将您的来源作为可接受的来源返回（Access-Control-Allow-Origin Header ).

正如@AndyPiper 在评论中指出的那样，Twitter 的API 不支持 CORS。这意味着您的请求只有从 server-side 发出时才会有效，而不是从浏览器发出。

Axios 和推特 API

Axios and twitter API

javascript

twitter

axios