使用jQuery Ajax调用带JWT的本地API时遇错误求助

咱先从你给出的代码里揪几个可能导致出错的点，再给你对应的解决方案：

• 请求方法的大小写问题
  jQuery的Ajax配置里，请求方法的参数是小写的method，你写的是大写Method，这会导致jQuery忽略这个配置——虽然你这里要发GET请求（默认就是GET），但如果后续改成POST这类方法，就会出问题，先把这个细节修正过来。

• JWT令牌有效性问题
  你提供的令牌结尾是...，首先要确保令牌是完整无截断的；另外看令牌里的exp字段值是1521568448，这个时间戳对应的是2018年3月左右，早就过期了！过期的令牌会被API直接拒绝，赶紧换成最新生成的有效令牌。

• 跨域资源共享（CORS）配置
  如果你的前端页面运行的端口和API的50298端口不一样，浏览器会触发跨域检查，这时候需要你的API服务端配置CORS：

  • 允许前端所在的Origin访问
  • 允许携带Authorization请求头（毕竟JWT是通过这个头传递的）
  • 允许对应的请求方法（比如你用的GET）

• 添加错误回调排查具体问题
  你的代码里没有设置error回调，根本看不到具体是啥错误（比如401未授权、404找不到接口、500服务器错误），建议加上这个回调来获取详细错误信息，方便精准排查：

$.ajax({
  url: 'http://localhost:50298/api/Validate',
  method: 'GET', // 修正为小写method
  dataType: 'json',
  beforeSend: function(xhr) {
    xhr.setRequestHeader("Accept", "application/json");
    // GET请求不需要Content-Type（没有请求体），可以删掉这行冗余配置
    // xhr.setRequestHeader("Content-Type", "application/json");
    xhr.setRequestHeader("Authorization", "Bearer 这里替换成你的有效完整JWT令牌");
  },
  success: function(response) {
    console.log("请求成功:", response);
  },
  error: function(xhr, status, error) {
    console.error("请求出错详情:");
    console.error("状态码:", xhr.status);
    console.error("响应内容:", xhr.responseText);
    console.error("错误信息:", error);
  }
});

• 请求头的冗余设置
  对于GET请求来说，Content-Type请求头其实是多余的，因为GET请求没有请求体，你可以把这行删掉，避免不必要的配置干扰。

按照上面的步骤逐一排查，应该能解决你的问题。

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