Angular 4 POST请求无法获取Access Token问题求助

嘿，我之前也踩过LinkedIn OAuth2 + Angular的坑，从你描述的情况来看，请求还没发就报错，大概率是请求格式不符合要求或者浏览器CORS拦截的问题，下面给你一步步排查解决：

一、先对齐LinkedIn Token接口的硬性要求 #

LinkedIn的accessToken接口（https://www.linkedin.com/oauth/v2/accessToken）有严格的格式规范，这也是很多前端开发者踩坑的核心点：

• 必须使用POST请求方法
• 内容类型（Content-Type）必须是application/x-www-form-urlencoded，绝对不能传递JSON格式的请求体
• 参数要以表单键值对的形式传递，不能塞在JSON结构里

如果你的Angular代码是直接发送JSON格式的请求，浏览器会提前拦截，根本不会把请求发出去——这大概率就是你当前遇到的问题。

二、修正Angular的请求代码 #

你需要把请求参数转换成表单格式，用URLSearchParams来构建参数，示例代码如下：

import { HttpClient, HttpHeaders } from '@angular/common/http';

// ...

constructor(private http: HttpClient) {}

fetchLinkedInAccessToken() {
  // 构建表单格式的请求参数
  const formParams = new URLSearchParams();
  formParams.set('grant_type', 'authorization_code');
  formParams.set('code', '你前端拿到的授权code');
  formParams.set('redirect_uri', '你在LinkedIn开发者后台配置的回调地址');
  formParams.set('client_id', '你的LinkedIn Client ID');
  formParams.set('client_secret', '你的LinkedIn Client Secret');

  // 设置符合要求的请求头
  const requestHeaders = new HttpHeaders({
    'Content-Type': 'application/x-www-form-urlencoded'
  });

  // 发送请求
  this.http.post(
    'https://www.linkedin.com/oauth/v2/accessToken',
    formParams.toString(),
    { headers: requestHeaders }
  ).subscribe(
    (res) => console.log('Token获取成功:', res),
    (err) => console.error('请求出错:', err)
  );
}

这里的核心是用URLSearchParams处理参数，转成字符串后发送，同时设置正确的Content-Type请求头。

三、如果还是报错？大概率是CORS限制在搞鬼 #

如果修正格式后依然报错，那就是浏览器的CORS跨域限制在拦截请求——LinkedIn的Token接口默认不允许前端直接跨域请求，浏览器会直接阻断这类请求。

这种情况的标准解决方案是通过你的后端服务器中转请求：

1. 前端把授权code、client_id等参数发送到你自己的后端接口
2. 后端收到参数后，再向LinkedIn的Token接口发起POST请求（后端请求不受浏览器CORS规则约束）
3. 后端拿到Token后，再返回给前端

这种做法不仅能避开CORS问题，还能保护你的client_secret（前端直接写secret会有泄露风险）。

最后再检查几个细节 #

• 确认redirect_uri和LinkedIn开发者后台配置的完全一致，包括http/https协议、域名、路径，连大小写都要匹配
• 检查client_id和client_secret有没有拼写错误
• 授权code是一次性的，且有效期很短，别用过期的code去请求

如果还是搞不定，可以把Angular抛出的具体错误信息贴出来，我再帮你精准定位~

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