来自前端的 Linkedin oauth/v2/accessToken API 的 CORS 错误

Question

我正在尝试访问 Linkedin accessToken API 但在 React js（前端）中总是面临 CORS 错误。在 URL 栏中或通过邮递员直接点击时同样有效。这是我得到的错误：

Access to fetch at 'https://www.linkedin.com/oauth/v2/accessToken' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

我的密码是：

const queryParams = querystring.stringify({
  redirect_uri: process.env.REACT_APP_LINKEDIN_REDIRECT_URI,
  client_id: process.env.REACT_APP_LINKEDIN_CLIENT_ID,
  client_secret: process.env.REACT_APP_LINKEDIN_CLIENT_SECRET,
  grant_type: 'authorization_code',
  code: code,
});
const headers = {
  'Content-Type': 'application/x-www-form-urlencoded',
};


const response = await fetch(`https://www.linkedin.com/oauth/v2/accessToken`, {
  method: 'POST',
  headers: headers,
  body: queryParams,
});

`

Answer 1

Linkedin API 不允许使用 CORS header 'Access-Control-Allow-Origin' 来自本地主机等位置的请求。 https://en.wikipedia.org/wiki/Cross-origin_resource_sharing

如果您真的需要它，您可以随时使用代理服务器或使用 https://cors-anywhere.herokuapp.com/.

之类的东西

Answer 2

API 响应不包括 Access-Control-Allow-Origin header，因此您的浏览器禁止向这些 API 请求。

您有 2 个选择：

使用2-legged OAuth flow
或使用 3-legged OAuth flow，这需要您将用户的浏览器重定向到 Linkedin 的站点

从安全角度来看，您should not distribute the client secret in HTML/JS files。

来自前端的 Linkedin oauth/v2/accessToken API 的 CORS 错误

CORS error on Linkedin oauth/v2/accessToken API from frontend

javascript

frontend

cors

reactjs

linkedin-api