Javascript API GET請求CORS錯誤

Question

如果我使用錯誤的術語，我很新，所以道歉。 我正在嘗試使用Trello API提取數據，但在Chrome控制台中收到以下錯誤：

無法加載https://api.trello.com/1/cards/5a42e19364345a7d84ba3f5f/members ：當請求的憑據時，響應中的“Access-Control-Allow-Origin”標頭的值不能是通配符“*”模式是'包含'。 因此，不允許來源“ http：// localhost：8080 ”訪問。 XMLHttpRequest發起的請求的憑據模式由withCredentials屬性控制。

經過一些研究后我發現這是一個CORS問題。 我正在使用帶有Python的Google App Engine。 這個錯誤是我可以修復的，還是API的錯誤？ 我設法使用此API執行POST請求沒問題。 我已經閱讀了很多關於CORS的信息，但還沒有找到問題的解決方案。

這是我的GET請求的Javascript代碼，它只是從Trello API復制/粘貼，所以我不確定是什么問題：

var authenticationSuccess = function() {
  console.log('Successful authentication');
};

var authenticationFailure = function() {
  console.log('Failed authentication');
};

window.Trello.authorize({
  type: 'popup',
  name: 'Work Requests App',
  scope: {
    read: 'true',
    write: 'true' },
  expiration: 'never',
  success: authenticationSuccess,
  error: authenticationFailure
});

var data = JSON.stringify(false);

var xhr = new XMLHttpRequest();
xhr.withCredentials = true;

xhr.addEventListener("readystatechange", function () {
  if (this.readyState === this.DONE) {
    console.log(this.responseText);
  }
});

xhr.open("GET", "https://api.trello.com/1/cards/5a42e1936434a7d84ba3f5f/members");

xhr.send(data);

Answer 1

看起來你正試圖將兩種不同的Trello API工作方式結合起來 - 使用client.js並發出直接的HTTP請求。

我建議首先使用client.js因為它在使用Trello API時提供了許多輔助函數。 例如， .authorize()方法將.authorize()您為API密鑰生成令牌並將其存儲在本地。 要使用client.js在示例中獲取卡片數據的請求，您的代碼應如下所示：

<html>
  <script
    src="https://code.jquery.com/jquery-3.2.1.min.js"
    integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
    crossorigin="anonymous"></script>
  <script src="https://trello.com/1/client.js?key=XXXXXXXXX"></script>
  <script>

    var requestSuccess = function(response) {
      console.log(JSON.stringify(response, null, 2));
    }

    var authenticationSuccess = function() {
      console.log('Successful authentication');
      // Now that you are authenticated, you can start
      // making requests to the API
      window.Trello.rest("GET", "cards/5a42e1936434a7d84ba3f5f/members", requestSuccess);
    };

    var authenticationFailure = function() {
      console.log('Failed authentication');
    };

    window.Trello.authorize({
      type: 'popup',
      name: 'Work Requests App',
      scope: {
        read: 'true',
        write: 'true' },
      expiration: 'never',
      success: authenticationSuccess,
      error: authenticationFailure
    });
  </script>
</html>

當您在腳本中包含client.js時，您需要包含您的API（從登錄Trello時訪問trello.com/app-key獲得）。 用您的API密鑰替換上面的XXXXXXXXX 。

如果你想向Trello的API發出直接的HTTP請求，你需要生成一個令牌（你可以從你檢索API密鑰的同一頁面上這樣做），你的代碼看起來像這樣：

<html>
  <script>  
    var xhr = new XMLHttpRequest();

    xhr.addEventListener("readystatechange", function () {
      if (this.readyState === this.DONE) {
        console.log(this.responseText);
      }
    });

    var yourToken = "XXXXXXXXXX";
    var yourKey = "XXXXXXXXXX";

    xhr.open("GET", "https://api.trello.com/1/cards/5a42e1936434a7d84ba3f5f/members?key=" + yourKey + "&token=" + yourToken);

    xhr.send();
  </script>
</html>

同樣，您需要添加API密鑰和令牌。

Javascript API GET請求CORS錯誤

問題描述

1 個解決方案

解決方案1
0 2018-01-17 19:21:20

Javascript API GET請求CORS錯誤

問題描述

1 個解決方案

解決方案1 0 2018-01-17 19:21:20

解決方案1
0 2018-01-17 19:21:20