无法从 Chrome 扩展向 REST API 发送 POST 请求答案

【问题标题】：Can't send POST request to a REST API from a Chrome extension无法从 Chrome 扩展向 REST API 发送 POST 请求
【发布时间】：2019-06-17 14:07:40
【问题描述】：

我正在为我的销售部门编写一个 Chrome 扩展程序，以帮助将潜在客户从一个 Freshsales 帐户转移到另一个帐户，我使用他们的 RESTful API 来实现这一点。 GET 请求运行良好，但我似乎无法发出任何 POST（甚至 PUT）请求。

响应总是“422 Unprocessable Entity”（当我尝试对我尝试发送的 JSON 进行字符串化时）或“500 Internal Server Error”（当我尝试按原样发送 JSON 时）。奇怪的是问题不在于端点——我可以从 Node.js 应用程序甚至使用 cURL 成功地向它发出 POST 请求。所以我认为它必须与扩展有关。

下面的代码使用 JQuery Ajax 发送请求，但是我也尝试使用 fetch、XmlHTTPRequest 进行此操作，甚至尝试使用 Axios 只是为了更好地衡量。没有任何效果。

这是我的 popup.js 文件中的测试函数的摘录（它以前在 content.js 中，但它的工作原理不一样）：

$.post({
    url: "https://{domain}.freshsales.io/api/leads",
    headers: {
      "Authorization": "Token token={api_token}",
      "Content-Type": "application/json"
    },
    data: {"lead":{"first_name":"James","last_name":"Testson","email":"james.test@gmail.com","company":{"name":"Business Inc."}}}
  }).then(function(res){
    console.log(res);
  }, function(err){
    console.log(err);
  });
}

这是我的manifest.json（这是教程中经过编辑的示例，因此可能存在一些不必要的权限）

  {
    "name": "Lead Transfer Tool",
    "version": "1.0",
    "description": "guess what it does",
    "permissions": [
      "activeTab", "declarativeContent", "storage", "https://*/*"
    ],
    "background": {
      "scripts": ["background.js"],
      "persistent": false
    },
    "page_action": {
      "default_popup": "popup.html"
    },
    "manifest_version": 2
  }

最大的问题是我什至无法正确调试 - 响应要么是单个错误代码（如果出现错误 422），要么是整个 HTML 页面，基本上说“出了点问题，我们很抱歉， ETC。” （如果出现错误 500）。有什么特定的东西与 Chrome 扩展有关吗？或者我只是看错了方向？

【问题讨论】：

你在发布到类似 httpbin 的东西时有同样的问题吗？
不，只有当我尝试向 Freshservice API 发出请求时才会发生这种情况。顺便说一句，问题已经解决了——他们的 API 根本不支持 CORS。

标签： javascript api google-chrome-extension httprequest

【解决方案1】：

在此我使用 content.js 来做我需要做的所有事情也许这对你有帮助：

        let xml = new XMLHttpRequest();
        xml.open('POST', "https://localhost:44311/crawler/hsx", true);
        xml.setRequestHeader("Content-Type", "application/json; charset = UTF-8");//t think this is main problem cause your error
        xml.onreadystatechange = function () {
            if (xml.readyState == 4) {
                console.log("Success!");
            }
        }
        xml.send(JSON.stringify(arrObj[i]));
    }

你也可以指出我的缺点，谢谢！

【讨论】：