Angular中JSON.parse报错：第1行第1列意外字符问题求助

问题根源 #

手动拼接application/x-www-form-urlencoded格式参数时，未对JSON字符串做URL编码，或拼接方式不符合表单参数规范，导致Laravel后端无法正确提取JSON内容，触发JSON.parse解析错误。

解决方案1：用Angular HttpParams构建参数（推荐） #

HttpParams会自动处理参数的URL编码，避免手动拼接的潜在错误，修改代码如下：

register(user): Observable<any> {
  const json = JSON.stringify(user);
  const params = new HttpParams().set('json', json);

  const headers = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded');
  return this._http.post(this.url + 'register', params, { headers });
}

解决方案2：手动编码JSON字符串 #

若坚持手动拼接，需用encodeURIComponent对JSON字符串编码，确保特殊字符被正确转义：

register(user): Observable<any> {
  const json = JSON.stringify(user);
  const params = `json=${encodeURIComponent(json)}`;

  const headers = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded');
  return this._http.post(this.url + 'register', params, { headers });
}

错误原因说明 #

之前的代码直接拼接"json="+json，即使JSON内容无特殊字符，Angular发送请求时可能未处理隐性格式问题（如换行符、编码差异），或Laravel解析未编码参数时误识别内容，导致提取的JSON不完整/格式错误，最终触发解析报错。

Laravel后端验证示例 #

确保后端正确获取并解析参数：

public function register(Request $request) {
  $jsonString = $request->input('json');
  $userData = json_decode($jsonString, true);

  // 业务逻辑处理...
}

内容的提问来源于stack exchange，提问作者insert coin design