Question JavaScript XMLHttpRequest en utilisant JsonP


Je veux envoyer des paramètres de demande à un autre domaine

Je sais déjà que Cross Scripting a besoin de JsonP et j'ai utilisé JsonP avec Jquery ajax

mais je ne comprends pas comment faire des scripts croisés en utilisant XMLHttpRequest

code suivant mon code XMLHttpRequest de base.

Je suppose que j'ai besoin de chager xhr.setRequestHeader() et je dois ajouter un code d'analyse

s'il vous plaît me donner une idée

var xhr;
function createXMLHttpRequest(){    
    if(window.AtiveXObject){
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }else{
        xhr = new XMLHttpRequest();
    }   
    var url = "http://www.helloword.com";   
}

function openRequest(){ 
    createXMLHttpRequest();
    xhr.onreadystatechange = getdata;
    xhr.open("POST",url,true);
    xhr.setRequestHeader("Content-Type",'application/x-www-form-urlencoded');
    xhr.send(data); 
}

function getdata(){
    if(xhr.readyState==4){
        if(xhr.status==200){
            var txt = xhr.responseText;
            alert(txt);
        }
    }   
}

24
2018-04-01 08:23


origine


Réponses:


JSONP n'utilise pas XMLHttpRequests.

La raison pour laquelle JSONP est utilisé est de surmonter les restrictions d'origine croisée des XHR.

Au lieu de cela, les données sont récupérées via un script.

function jsonp(url, callback) {
    var callbackName = 'jsonp_callback_' + Math.round(100000 * Math.random());
    window[callbackName] = function(data) {
        delete window[callbackName];
        document.body.removeChild(script);
        callback(data);
    };

    var script = document.createElement('script');
    script.src = url + (url.indexOf('?') >= 0 ? '&' : '?') + 'callback=' + callbackName;
    document.body.appendChild(script);
}

jsonp('http://www.helloword.com', function(data) {
   alert(data);
});

Par souci de simplicité, cela n'inclut pas le traitement des erreurs si la demande échoue. Utilisation script.onerror si vous en avez besoin


58
2018-04-01 08:30



Je sais que vous avez déjà la réponse mais si quelqu'un d'autre veut un exemple d'utilisation de promesses ici.

function jsonp(url) {
    return new Promise(function(resolve, reject) {
        let script = document.createElement('script')
        const name = "_jsonp_" + Math.round(100000 * Math.random());
        //url formatting
        if (url.match(/\?/)) url += "&callback="+name
        else url += "?callback="+name
        script.src = url;

        window[name] = function(data) {
            resolve(data);
            document.body.removeChild(script);
            delete window[name];
        }
        document.body.appendChild(script);
    });
}
var data = jsonp("https://www.google.com");
data.then((res) => {
    console.log(res);
});

0
2018-02-21 21:59



Vous ne pouvez pas faire le scripting croisé en utilisant XMLHttpRequest. Si vous voulez traverser le domaine sans Jquery, vous devez créer un nouveau noeud de script et en définir l'attribut src.


-4
2018-04-01 08:32