React前端调用LinkedIn oauth/v2/accessToken接口出现CORS错误如何解决

• 该报错是浏览器同源策略的限制导致的：CORS校验仅会在浏览器端发起跨域异步请求时触发，Postman请求、浏览器地址栏直接访问都不属于跨域异步请求场景，不会触发CORS校验，因此可以正常拿到结果。
• LinkedIn的https://www.linkedin.com/oauth/v2/accessToken接口本身就不支持前端直接调用：该接口需要传入client_secret参数，而client_secret属于应用敏感密钥，不允许暴露在前端代码中，因此LinkedIn没有为该接口配置跨域允许头，前端直接请求必然触发CORS报错。

• 正式环境推荐方案：后端代理转发
  前端不要直接请求LinkedIn的接口，将拿到的授权code传给自己的后端服务，由后端携带client_id、client_secret、redirect_uri等完整参数请求LinkedIn的accessToken接口，后端拿到结果后再返回给前端。该方案既解决了CORS问题，也避免了client_secret泄露的安全风险，是LinkedIn OAuth流程的官方标准实现。
• 本地开发临时方案：配置开发代理
  如果你用的是create-react-app创建的项目，可以在项目package.json中添加配置"proxy": "https://www.linkedin.com"，之后前端请求/oauth/v2/accessToken路径即可，开发服务器会自动将请求代理到LinkedIn官方地址，绕开本地开发的跨域限制。注意该方案仅适用于本地开发调试，生产环境不能用。
• 不要使用mode: 'no-cors'配置：该配置虽然会让浏览器不抛出CORS报错，但你无法拿到接口的返回数据，完全无法满足获取accessToken的需求。

内容的提问来源于stack exchange，提问作者Ankit Shah