Javascript 无法使用XMLHttpRequest从rest api获取响应

我想使用XMLHttpRequest调用get-rest api，但遇到错误-

“未捕获的语法错误：JSON输入意外结束”

RESTAPI json响应数据

{
    "timestamp": "2018-06-08T16:52:50.509Z",
    "dataFrame": "AQAAKCoAAQgFKgABBg==",
    "fcnt": 825,
    "freq": 865572000,
    "port": 2,
    "rssi": -115,
    "snr": -16,
    "sf_used": 12,
    "id": 1528476770509,
    "dr_used": "SF12BW125",
    "decrypted": true
}

代码

函数UserAction（）{
var xhttp=newXMLHttpRequest（）；
xhttp.open（“GET”，“url”，true）；
setRequestHeader（“内容类型”、“应用程序/json”）；
setRequestHeader（“授权”，“基本a2Vyb==”）；
xhttp.send（）；
var response=JSON.parse（xhttp.responseText）；
}

---

编辑：

代码

函数userAction（）{
设xhttp=newXMLHttpRequest（）；
xhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
让response=JSON.parse（xhttp.responseText）；
var dataFrame=response.dataFrame；
/**处理响应的代码**/
}
};
xhttp.open（“GET”，“url”，true）；
setRequestHeader（“内容类型”、“应用程序/json”）；
setRequestHeader（“授权”，“基本a2VybmVsc==”）；
xhttp.send（）；

HTML

搜索

您应该侦听请求的事件，以便仅在请求完成后解析结果：

functio userAction（）{
设xhttp=newXMLHttpRequest（）；
xhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
让response=JSON.parse（xhttp.responseText）；
document.getElementById（“数据”）.innerHTML=response.dataFrame；
}
};
xhttp.open（“GET”，“filename”，true）；
setRequestHeader（“内容类型”、“应用程序/json”）；
setRequestHeader（“授权”，“基本a2Vyb==”）；
xhttp.send（）；
}

您需要将xhttp.onreadystate属性设置为回调函数，以处理各种状态，然后在收到响应时处理响应

---

您应该在输出请求之前检查请求的状态

函数UserAction（）{
var xhttp=newXMLHttpRequest（）；
xhttp.open（“GET”，“url”，true）；
setRequestHeader（“内容类型”、“应用程序/json”）；
setRequestHeader（“授权”，“基本a2Vyb==”）；
xhttp.onload=函数（）{
如果（xhttp.status==200）{
var response=JSON.parse（xhttp.responseText）；
}
}
xhttp.send（）；
}

getting error-Uncaught DomeException:未能在“XMLHttpRequest”上执行“setRequestHeader”：必须打开对象的状态。是的，我只是把顺序弄乱了一点，正在编辑。请告诉我它现在是否工作：）很好，请将问题标记为已回答：-）hai@Luca你能告诉我如何将dataFrame变量绑定到html H1标记吗？P可能的复制品

 <script>
        function UserAction() {
    var xhttp = new XMLHttpRequest();
        xhttp.open("GET", "url", true);
        xhttp.setRequestHeader("Content-type", "application/json");
        xhttp.setRequestHeader("Authorization", "Basic a2Vyb==");
        xhttp.send();
    var response = JSON.parse(xhttp.responseText);
}
    </script>

 <script>
     function userAction() {
        let xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function () {
            if (this.readyState == 4 && this.status == 200) {
                let response = JSON.parse(xhttp.responseText);
                var dataFrame = response.dataFrame;
                /** code that handles the response **/
            }
        };
        xhttp.open("GET", "url", true);
        xhttp.setRequestHeader("Content-type", "application/json");
        xhttp.setRequestHeader("Authorization", "Basic a2VybmVsc==");
        xhttp.send();
    </script>

 <button type="submit" onclick="userAction()">Search</button>
   <h1 id="data"></h1>