GET 请求中的 setRequestHeader 错误答案

【问题标题】：Error with setRequestHeader in GET requestGET 请求中的 setRequestHeader 错误
【发布时间】：2019-05-30 08:12:23
【问题描述】：

下面的 JS 函数应该发送一个 GET 请求到

http://127.0.0.1:5000/api.xml

与

?query=toast

function sendRequest(str){
    var request = new XMLHttpRequest();
    console.log('sending request');
    request.onreadystatechange = function() {
        if (request.readyState == XMLHttpRequest.DONE) {
            json=request.responseText;
            //json.forEach(function(obj) { 
            //});
            for (word in json){
                var row=table.insertRow();
                var scoreC=row.insertCell();
                var wordC=row.insertCell();
                scoreC.innerHTML=json[word];
                wordC.innerHTML=word;
            }
        } else {
            concole.log("Silence on the line");
        }
    }
    request.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    request.open('GET', 'http://127.0.0.1:5000/api.xml?query='+str, true);
    request.send();
  // and give it some content 
    //var newContent = document.createTextNode(resp); 
    //console.log(resp.responseType);
}

相反，它总是查询

http://127.0.0.1:5000/?word=toast

忽略我需要 GET 的事实

http://127.0.0.1:5000/api.xml

【问题讨论】：

你在哪里调用sendRequest函数？
注意：你应该在请求打开后设置请求头。
@hoangdv request.send() 还是什么意思？
@eddie 不，我想看到类似sendRequest("toast") 的内容，何时调用该函数？

标签： javascript html onclick

【解决方案1】：

1)Stephan Schrijver 指出

request.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

只有跟在后面才有效

request.open('POST', 'http://127.0.0.1:5000/api.xml?query='+str, true);

作为 POST 请求的一部分

是no longer required for GET requests

2) 还有，

request.open('GET', 'http://127.0.0.1:5000/api.html?query='+str, true);

必须在readyStateChange函数之前定义

【讨论】：

【解决方案2】：

试试这个

function sendRequest(str) {
    const request = new XMLHttpRequest();
    request.onreadystatechange = function() {
        if (this.readyState === 4) {
            if (this.status === 200) {
                console.log(this.responseText);
                const json = this.responseText;
                for (word in json) {
                    var row = table.insertRow();
                    var scoreC = row.insertCell();
                    var wordC = row.insertCell();
                    scoreC.innerHTML = json[word];
                    wordC.innerHTML = word;
                }
            } else if (this.response == null && this.status === 0) {
                console.log(this.responseText);
            } else {
                console.log('Error');
            }
        }
    };
    request.open('GET', 'http://127.0.0.1:5000/api.xml?query=' + str, true);
    request.send(null);
}

【讨论】：

【解决方案3】：

首先，您应该创建所需的 URL，打开请求，然后设置请求标头。让我举个例子：

function sendRequest(){
  let theUrl = 'http://127.0.0.1:5000/api.xml'

  let xmlHttp = new XMLHttpRequest();
  let fooStr='?query=toast';
  theUrl = `http://127.0.0.1:5000/api.xml${fooStr}`;
  xmlHttp.open( "GET", theUrl, false ); // false for synchronous request
  xmlHttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

  xmlHttp.send( null );
  return xmlHttp.responseText;
}

sendRequest();

或者在你的情况下：

request.open('GET', 'http://127.0.0.1:5000/api.xml?query='+str, true);
request.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
request.send();

【讨论】：