调用Insightly API返回状态码0的问题求助

我来帮你排查这个问题，状态码0在XMLHttpRequest里通常指向几个明确的原因，结合你的情况我们一步步来解决：

1. 先修正Authorization请求头的格式 #

你当前的认证头写法有个关键错误：Basic认证的格式是Basic （注意是空格，不是冒号）后面跟base64编码的「API密钥:」（冒号不能少，因为Insightly要求用API密钥作为用户名，密码留空）。

你之前写的是：

x.setRequestHeader('Authorization', 'Basic: b4c6c660-e20f-4f31-b90d-b6a11bfe4ef2');

这会导致服务器无法识别你的认证信息，正确的写法应该是：

const apiKey = 'b4c6c660-e20f-4f31-b90d-b6a11bfe4ef2';
// 把API密钥加冒号转成base64
const authHeader = 'Basic ' + btoa(apiKey + ':');
x.setRequestHeader('Authorization', authHeader);

2. 排查跨域（CORS）问题 #

你用hurl.it测试正常，但浏览器里返回状态码0，最大的可能是浏览器的同源策略限制：hurl.it是在服务器端发起请求，不受浏览器CORS规则约束，但如果你的脚本是在本地HTML文件、或者和Insightly API域名不同的网站里运行，浏览器会阻止跨域请求，这时候XHR的status就会显示为0。

解决CORS问题的办法： #

• 后端代理：搭建一个简单的后端服务（比如Node.js、PHP等），让前端请求你的后端，再由后端去调用Insightly API。这样就绕过了浏览器的跨域限制。
• 检查Insightly CORS支持：查看Insightly的API文档，确认是否允许浏览器端直接调用，以及是否需要在控制台配置允许的域名。如果官方不支持浏览器端直接调用，那只能用代理方案。

3. 正确处理异步请求的时机 #

你提到已经知道异步特性的问题，但还是要再强调：不要在x.send()之后立即访问x.status，这时候请求还没开始处理，状态必然是0。所有的状态判断和响应数据处理都要放在onload、onerror或者onreadystatechange事件回调里。

完整的修正代码示例：

var x = new XMLHttpRequest();
x.open("GET", "https://api.insight.ly/v2.2/Projects/Search?status=in%20progress&brief=false&count_total=false", true);

// 修正认证头
const apiKey = 'b4c6c660-e20f-4f31-b90d-b6a11bfe4ef2';
x.setRequestHeader('Authorization', 'Basic ' + btoa(apiKey + ':'));

// 请求成功完成的回调
x.onload = function () {
  if (this.status >= 200 && this.status < 300) {
    console.log('请求成功！状态码:', this.status);
    console.log('响应数据:', this.responseText);
  } else {
    console.log('请求失败，状态码:', this.status);
    console.log('错误信息:', this.statusText);
  }
};

// 捕获网络错误或CORS错误
x.onerror = function () {
  console.log('网络/跨域错误，状态码:', this.status);
};

x.send();

先尝试修正认证头，如果还是返回状态码0，那基本可以确定是CORS问题，这时候就需要用后端代理来解决了。

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