无法将JSON对象发送到XMLHttpRequest [英] Unable to send JSON object to XMLHttpRequest

问题描述

我无法将JSON对象发送到XMLHttpRequest().但是，如果我通过send()发送字符串数据，它将起作用.例如，以下代码有效:

I am unable to send JSON object to XMLHttpRequest(). However, if I send string data through send(), it works. For example, the following code works:

var xhr = new XMLHttpRequest();
var url = 'https://xyz.info/api/contacts';
xhr.open("POST", url,true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

xhr.onreadystatechange = function() {//Call a function when the state changes.
     if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
                // Request finished. Do processing here.
     }
}
xhr.send("apikey=ee694eabf9e3&firstname=Raja1&lastname=Kumars&phone=123456");

但是，如果我尝试使用JSON发送数据，它将不会向URL发送任何内容.以下代码不起作用.

However, if I try to send data using JSON, it posts nothing to the url. The following code does not work.

var xhr = new XMLHttpRequest();
var url = 'https://xyz.info/api/contacts';
    xhr.open("POST", url,true);
    //xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.setRequestHeader("Content-Type", "application/json");

    xhr.onreadystatechange = function() {//Call a function when the state changes.
    if(xhr.readyState == XMLHttpRequest.DONE && xhr.status == 200) {
            // Request finished. Do processing here.
        }
    }
    xhr.send(JSON.stringify({
                    'apikey' :'ee6915d4ee4b4df66bba82277e3',
                    'firstname' : 'Kumar',
                    'lastname' : 'Sunder',
                    'phone':'5557773334'
    }));        

推荐答案

您在两个呼叫中发送的信息完全不同.一些示例代码:

You're sending very different information in your two calls. Some sample code:

var _stringify = JSON.stringify({ 'apikey' :'ee6915d4ee4b4df66bba82277e3', 'firstname' : 'Kumar', 'lastname' : 'Sunder', 'phone':'5557773334' }); console.log(_stringify); var _orig = "apikey=ee694eabf9e3&firstname=Raja1&lastname=Kumars&phone=123456" var _encoded = encodeURI(_stringify); console.log(_orig); console.log(_encoded); 当您将原始字符串打印到控制台日志中时，它看起来就像您期望的那样:

var _stringify = JSON.stringify({ 'apikey' :'ee6915d4ee4b4df66bba82277e3', 'firstname' : 'Kumar', 'lastname' : 'Sunder', 'phone':'5557773334' }); console.log(_stringify); var _orig = "apikey=ee694eabf9e3&firstname=Raja1&lastname=Kumars&phone=123456" var _encoded = encodeURI(_stringify); console.log(_orig); console.log(_encoded); when your original string is printed to the console log, it looks as you would expect:

apikey=ee694eabf9e3&firstname=Raja1&lastname=Kumars&phone=123456 当JSON.stringify的结果打印到控制台时，它返回: {"apikey":"ee6915d4ee4b4df66bba82277e3","firstname":"Kumar","lastname":"Sunder","phone":"5557773334"} 也就是说，它带有许多额外的双引号和左右括号.如果要以字符串的形式发送所有内容(如初始示例所示)，则需要对JSON.stringify调用的结果进行URI编码.这就是使用"_encoded"变量发生的情况，该变量包含: %7B%22apikey%22:%22ee6915d4ee4b4df66bba82277e3%22,%22firstname%22:%22Kumar%22,%22lastname%22:%22Sunder%22,%22phone%22:%225557773334%22%7D

apikey=ee694eabf9e3&firstname=Raja1&lastname=Kumars&phone=123456 when the result of JSON.stringify is printed to the console, it returns: {"apikey":"ee6915d4ee4b4df66bba82277e3","firstname":"Kumar","lastname":"Sunder","phone":"5557773334"} That is, it comes complete with lots of extra double quote marks and left and right brackets. If you want to send all of that as a string (as in your initial example), you would need to URI encode the result of the JSON.stringify call. This is what happens with the "_encoded" variable, which contains: %7B%22apikey%22:%22ee6915d4ee4b4df66bba82277e3%22,%22firstname%22:%22Kumar%22,%22lastname%22:%22Sunder%22,%22phone%22:%225557773334%22%7D

这篇关于无法将JSON对象发送到XMLHttpRequest的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！