时间戳

首页 > 解决方案 > jquery ajax中的cors问题

javascript - jquery ajax中的cors问题

问题描述

// find elements
url = 'https://btacertified.com/api/v1/courses';
apitoken = 'RjBMcmlabzZIa3I0bExSM0ZadnN5MFpRNkg5Y3R6UmcyS25uaTFrZVRUcUQ3RUNBVkpHR09LWVNJbklG5c9a7a09c78b6';
var button = $("button")

$(document).ready(function() {
  // handle click and add class
  button.on("click", function() {

    $.ajax({
      url: url,
      type: "POST",
      crossDomain: true,
      data: JSON.stringify({
        "a": 1
      }),
      dataType: "jsonp",
      beforeSend: function(xhr) {
        xhr.withCredentials = true;
      },
      headers: {
        'Access-Control-Allow-Origin': 'https://jsfiddle.net',
        'Authorization': apitoken
      },
      success: function(response) {
        var resp = JSON.parse(response)
        alert(resp.status);
      },
      error: function(xhr, status) {
        alert("error");
      }
    });
  })
});
<!doctype html>
<html lang="en">

<head>
  <title></title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

<body>
  <div id="banner-message">
    <button>Click Me</button>
  </div>
</body>

</html>

我正在使用标头中的 apitoken 授权进行发布 API 以检索 json。

我收到一个 CORS 错误，它是“被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：没有 'Access-Control-Allow-Origin' 标头”。

PS：我检查了类似的 CORS 帖子对我没有任何作用，我无法控制 3rd 方 API 服务器，所以我不能在那里添加任何标题。使用 JSONP 我得到 405 错误

但我可以通过 apitest.com 在以下链接中看到结果。 https://apitester.com/shared/checks/27522c9ca1dc4e7f89fe488f3864909f

标签： javascriptjqueryajaxcors

解决方案

Charlietfl 是正确的，但如果您知道 api 可以处理 CORS 请求，您可能希望从您的请求中删除 access-control-allow-origin （我相信这是一个响应标头）并且您确定要将数据类型设置为 JSONP？也许摆脱这条线，让服务器决定（现在大多数 API 不需要 JSONP）。

推荐阅读