jQuery Ajax Note
- A causa delle restrizioni di sicurezza del browser, la maggior parte delle richieste Ajax sono soggette alla stessa politica di origine ; la richiesta non può recuperare correttamente i dati da un dominio, sottodominio, porta o protocollo diversi.
- Le richieste di script e JSONP non sono soggette alle stesse restrizioni della politica di origine.
Esistono alcuni modi per superare la barriera interdominio :
Ci sono alcuni plugin che aiutano con le richieste tra domini :
Dritta!
Il modo migliore per ovviare a questo problema è creare il proprio proxy nel back-end, in modo che il proxy punti ai servizi in altri domini, perché nel back-end non esiste la stessa restrizione della politica di origine . Ma se non riesci a farlo nel back-end, presta attenzione ai seguenti suggerimenti.
Avvertimento!
L'uso di proxy di terze parti non è una pratica sicura, perché possono tenere traccia dei tuoi dati, quindi possono essere utilizzati con informazioni pubbliche, ma mai con dati privati.
Gli esempi di codice mostrati di seguito usano jQuery.get () e jQuery.getJSON () , entrambi sono metodi abbreviati di jQuery.ajax ()
CORS Ovunque
CORS Anywhere è un proxy node.js che aggiunge le intestazioni CORS alla richiesta proxy.
Per utilizzare l'API, basta aggiungere il prefisso all'URL con l'URL dell'API. (Supporta https : vedi repository github )
Se si desidera abilitare automaticamente le richieste tra domini quando necessario, utilizzare il frammento seguente:
$.ajaxPrefilter( function (options) {
if (options.crossDomain && jQuery.support.cors) {
var http = (window.location.protocol === 'http:' ? 'http:' : 'https:');
options.url = http + '//cors-anywhere.herokuapp.com/' + options.url;
//options.url = "http://cors.corsproxy.io/url=" + options.url;
}
});
$.get(
'http://en.wikipedia.org/wiki/Cross-origin_resource_sharing',
function (response) {
console.log("> ", response);
$("#viewer").html(response);
});
Qualunque sia l'origine
Qualunque sia l'origine è un accesso jsonp interdominio . Questa è un'alternativa open source a anyorigin.com .
Per recuperare i dati da google.com, puoi utilizzare questo frammento:
// It is good specify the charset you expect.
// You can use the charset you want instead of utf-8.
// See details for scriptCharset and contentType options:
// http://api.jquery.com/jQuery.ajax/#jQuery-ajax-settings
$.ajaxSetup({
scriptCharset: "utf-8", //or "ISO-8859-1"
contentType: "application/json; charset=utf-8"
});
$.getJSON('http://whateverorigin.org/get?url=' +
encodeURIComponent('http://google.com') + '&callback=?',
function (data) {
console.log("> ", data);
//If the expected response is text/plain
$("#viewer").html(data.contents);
//If the expected response is JSON
//var response = $.parseJSON(data.contents);
});
Proxy CORS
CORS Proxy è un semplice proxy node.js per abilitare la richiesta CORS per qualsiasi sito Web. Consente al codice javascript sul tuo sito di accedere a risorse su altri domini che sarebbero normalmente bloccati a causa della stessa politica di origine.
Come funziona? CORS Proxy sfrutta la condivisione delle risorse tra le origini, che è stata aggiunta insieme a HTML 5. I server possono specificare che desiderano che i browser consentano ad altri siti Web di richiedere risorse che ospitano. CORS Proxy è semplicemente un proxy HTTP che aggiunge un'intestazione alle risposte dicendo "chiunque può richiederlo".
Questo è un altro modo per raggiungere l'obiettivo (vedi www.corsproxy.com ). Tutto quello che devi fare è rimuovere http: // e www. dall'URL inviato in proxy e anteporre l'URL conwww.corsproxy.com/
$.get(
'http://www.corsproxy.com/' +
'en.wikipedia.org/wiki/Cross-origin_resource_sharing',
function (response) {
console.log("> ", response);
$("#viewer").html(response);
});
Browser proxy CORS
Recentemente ho trovato questo, che coinvolge varie utility di condivisione remota Cross Origin orientate alla sicurezza. Ma è una scatola nera con Flash come backend.
Puoi vederlo in azione qui: Browser proxy CORS
Ottieni il codice sorgente su GitHub: koto / cors-proxy-browser