¿Qué es JSONP?

¿Qué es JSONP? JSONP es una técnica que permite realizar solicitudes de datos a dominios diferentes al de la página web que hace la solicitud. ¿Cómo se utiliza JSONP? Se utiliza añadiendo un script a la página que llama a un recurso externo, el cual debe devolver un script en formato JSONP.

Primero hay que saber.

1. El principio fundamental de JSONP es que la página objetivo llama a un método de la página local y le pasa parámetros.
2. Las páginas dinámicas que usamos comúnmente son jsp, php, aspx.

¿Por qué se necesita JSONP?

Debido a las restricciones de seguridad del navegador, los datos no se pueden solicitar directamente entre dominios (incluyendo diferentes dominios raíz, subdominios o diferentes puertos), a menos que el dominio de destino te autorice a acceder. Por ejemplo, configurando crossdomain.xml o autorizando en los encabezados HTTP.

Sin embargo, crossdomain.xml permite que los sitios web configurados accedan a todos los datos, y la configuración de los encabezados es muy complicada.

Por lo tanto, se puede configurar jsonp en los datos devueltos autorizados por ti para permitir que esta interfaz permita a todos los llamadores obtener datos.

El principio de JSONP.

jsonp es el principio de utilizar una función de retorno de llamada.

En una página web, si introduces el js de otra página, el js de esa página puede llamar al código de tu página.

La solicitud directa de JavaScript y el código JavaScript generado en páginas dinámicas (JSP, PHP, ASPX) tienen el mismo efecto.

function showjson(json){
    alert(json.url);
}

如果引用的js或动态页面里有 showjson({"url":" http://www.bejson.com "});这行代码的话,那就会弹出 http://www.bejson.com

La primera forma de JSONP es cargar el objetivo en forma de JavaScript, aunque en realidad el otro lado sea un PHP.

A continuación, solicitamos en esta página. http://www.ibilibili.com/static/js/forbejson/userinfo.php Los datos de la página, este página PHP tendrá una función de retorno de llamada showjson, que invocará el método showjson de nuestra página bejson y pasará un JSON como argumento:

< ?php 
    // Aquí está en la página PHP, llamando al método showjson, este método debe coincidir con el método de callback definido anteriormente en la página local.
    echo 'showjson({"url":"http://www.bejson.com"})';
?>

Solicitud y función de retorno en PHP:

$("#getuserp").click(function(){
    $.getScript("//www.bejson.com/test/userinfop.php");
});

Entonces, si interceptamos el paquete, veremos (como en la imagen de arriba) que al hacer clic en el botón se envía una solicitud HTTP.

Solicitado // www.bejson.com/test/userinfop.php página,

页面里输出了 showjson({"url":" http://www.bejson.com "}) ,

Porque es por... cargado en forma de archivo javascript Por lo tanto, hará una llamada de retorno a la página local showjson (ver la flecha verde) y pasará los parámetros JSON (ver la flecha roja), por lo que se abrirá la URL dentro del JSON.

Utiliza directamente ajax de jQuery para solicitar jsonp.

Gracias. calabaza Indica el error en el código y proporciona el código correcto.

​x
 $.ajax({
     url:'//www.bejson.com/test/userinfop.php',
     type:"GET",
            dataType:"jsonp",
            jsonp: false, 
            jsonpCallback: "showjson", // El valor aquí debe ser el mismo que el nombre de la función de callback.
            success:function(data){
                console.log("Script loaded and executed.");
            },
            error:function (textStatus) { // Función que se llama después de que la solicitud falla
                console.log(JSON.stringify(textStatus));
            }
});