Как создать Запрос JSONP из Javascript без JQuery?

Question

Как создать Запрос JSONP из Javascript без JQuery?

Могу ли я сделать междоменный запрос JSONP в JavaScript без использования jQuery или другой внешней библиотеки? Я хотел бы использовать сам JavaScript, а затем проанализировать данные и сделать их объектом, чтобы я мог его использовать. Обязательно ли использовать внешнюю библиотеку? Если нет, как я могу это сделать?

117

javascript jsonp

задан informatik01 26 October 2013 в 00:31

3 ответа

Другие вопросы по тегам:

javascript jsonp

Похожие вопросы:

score 1 · Answer 1

Ниже приведен пример JavaScript , чтобы сделать вызов JSONP без JQuery:

Также вы можете сослаться на мой GitHub хранилище для справок.

https://github.com/shedagemayur/JavaScriptCode/tree/master/jsonp

window.onload = function(){
    var callbackMethod = 'callback_' + new Date().getTime();

    var script = document.createElement('script');
    script.src = 'https://jsonplaceholder.typicode.com/users/1?callback='+callbackMethod;

    document.body.appendChild(script);

    window[callbackMethod] = function(data){
        delete window[callbackMethod];
        document.body.removeChild(script);
        console.log(data);
    }
}

score 8 · Answer 2

как я использую jsonp, как показано ниже:

function jsonp(uri) {
    return new Promise(function(resolve, reject) {
        var id = '_' + Math.round(10000 * Math.random());
        var callbackName = 'jsonp_callback_' + id;
        window[callbackName] = function(data) {
            delete window[callbackName];
            var ele = document.getElementById(id);
            ele.parentNode.removeChild(ele);
            resolve(data);
        }

        var src = uri + '&callback=' + callbackName;
        var script = document.createElement('script');
        script.src = src;
        script.id = id;
        script.addEventListener('error', reject);
        (document.getElementsByTagName('head')[0] || document.body || document.documentElement).appendChild(script)
    });
}

затем используйте метод 'jsonp' следующим образом:

jsonp('http://xxx/cors').then(function(data){
    console.log(data);
});

ссылка:

JavaScript XMLHttpRequest с использованием JsonP

http://www.w3ctech.com/topic/721 (поговорим о способе использования Promise)

score 0 · Answer 3

Если вы используете ES6 с NPM, вы можете попробовать модуль узла "fetch-jsonp". Fetch API Обеспечивает поддержку для выполнения вызова JsonP как обычного вызова XHR.

Предварительное условие: вы должны использовать isomorphic-fetch модуль узла в вашем стеке.