[Javascript] Chargement d'un point de terminaison interdomaine avec jQuery AJAX


Answers

Vous pouvez utiliser Ajax-cross-origin un plugin jQuery. Avec ce plugin, vous utilisez jQuery.ajax() cross domain. Il utilise les services Google pour y parvenir:

Le plugin AJAX Cross Origin utilise Google Apps Script en tant que proxy jSON getter dans lequel jSONP n'est pas implémenté. Lorsque vous définissez l'option crossOrigin sur true, le plug-in remplace l'URL d'origine par l'adresse de script Google Apps et l'envoie en tant que paramètre d'URL codée. Le script Google Apps utilise les ressources de Google Servers pour récupérer les données distantes et les renvoie au client en tant que JSONP.

C'est très simple à utiliser:

    $.ajax({
        crossOrigin: true,
        url: url,
        success: function(data) {
            console.log(data);
        }
    });

Vous pouvez en lire plus ici: http://www.ajax-cross-origin.com/

Question

J'essaye de charger une page HTML inter-domaine en utilisant AJAX mais à moins que le type de données soit "jsonp" je ne peux pas obtenir une réponse. Cependant, en utilisant jsonp, le navigateur attend un type mime de script mais reçoit "text / html".

Mon code pour la demande est:

$.ajax({
    type: "GET",
    url: "http://saskatchewan.univ-ubs.fr:8080/SASStoredProcess/do?_username=DARTIES3-2012&_password=P@ssw0rd&_program=%2FUtilisateurs%2FDARTIES3-2012%2FMon+dossier%2Fanalyse_dc&annee=2012&ind=V&_action=execute",
    dataType: "jsonp",
}).success( function( data ) {
    $( 'div.ajax-field' ).html( data );
});

Est-il possible d'éviter d'utiliser jsonp pour la demande? J'ai déjà essayé d'utiliser le paramètre crossDomain mais cela n'a pas fonctionné.

Sinon, est-il possible de recevoir le contenu html dans jsonp? Actuellement, la console dit "inattendu" dans la réponse jsonp.




Il suffit de mettre cela dans l'en-tête de votre page PHP et ça marche sans API:

header('Access-Control-Allow-Origin: *'); //allow everybody  

ou

header('Access-Control-Allow-Origin: http://codesheet.org'); //allow just one domain 

ou

$http_origin = $_SERVER['HTTP_ORIGIN'];  //allow multiple domains

$allowed_domains = array(
  'http://codesheet.org',
  'http://.com'
);

if (in_array($http_origin, $allowed_domains))
{  
    header("Access-Control-Allow-Origin: $http_origin");
}



Je posterai ceci au cas où quelqu'un rencontrerait le même problème que moi en ce moment. J'ai une imprimante thermique Zebra, équipée du serveur d'impression ZebraNet, qui offre une interface utilisateur HTML pour éditer plusieurs paramètres, voir l'état actuel de l'imprimante, etc. J'ai besoin de connaître l'état de l'imprimante, qui est affichée dans l'une de ces pages html, offert par le serveur ZebraNet et, par exemple, alert () un message à l'utilisateur dans le navigateur. Cela signifie que je dois d'abord obtenir cette page html en Javascript. Bien que l'imprimante se trouve dans le LAN du PC de l'utilisateur, cette même politique d'origine reste fermement sur mon chemin. J'ai essayé JSONP, mais le serveur renvoie html et je n'ai pas trouvé un moyen de modifier sa fonctionnalité (si je pouvais, j'aurais déjà défini l'en-tête magique Access-control-allow-origin: *). J'ai donc décidé d'écrire une petite application de console en C #. Il doit être exécuté en tant qu'administrateur pour fonctionner correctement, sinon il trolls: D une exception. Voici du code:

// Create a listener.
        HttpListener listener = new HttpListener();
        // Add the prefixes.
        //foreach (string s in prefixes)
        //{
        //    listener.Prefixes.Add(s);
        //}
        listener.Prefixes.Add("http://*:1234/"); // accept connections from everywhere,
        //because the printer is accessible only within the LAN (no portforwarding)
        listener.Start();
        Console.WriteLine("Listening...");
        // Note: The GetContext method blocks while waiting for a request. 
        HttpListenerContext context;
        string urlForRequest = "";

        HttpWebRequest requestForPage = null;
        HttpWebResponse responseForPage = null;
        string responseForPageAsString = "";

        while (true)
        {
            context = listener.GetContext();
            HttpListenerRequest request = context.Request;
            urlForRequest = request.RawUrl.Substring(1, request.RawUrl.Length - 1); // remove the slash, which separates the portNumber from the arg sent
            Console.WriteLine(urlForRequest);

            //Request for the html page:
            requestForPage = (HttpWebRequest)WebRequest.Create(urlForRequest);
            responseForPage = (HttpWebResponse)requestForPage.GetResponse();
            responseForPageAsString = new StreamReader(responseForPage.GetResponseStream()).ReadToEnd();

            // Obtain a response object.
            HttpListenerResponse response = context.Response;
            // Send back the response.
            byte[] buffer = System.Text.Encoding.UTF8.GetBytes(responseForPageAsString);
            // Get a response stream and write the response to it.
            response.ContentLength64 = buffer.Length;
            response.AddHeader("Access-Control-Allow-Origin", "*"); // the magic header in action ;-D
            System.IO.Stream output = response.OutputStream;
            output.Write(buffer, 0, buffer.Length);
            // You must close the output stream.
            output.Close();
            //listener.Stop();

Tout ce que l'utilisateur doit faire est d'exécuter cette application de console en tant qu'administrateur. Je sais que c'est trop ... frustrant et compliqué, mais c'est une sorte de solution au problème de la politique de domaine au cas où vous ne pouvez pas modifier le serveur de quelque façon que ce soit.

edit: de js je fais un simple appel ajax:

$.ajax({
                type: 'POST',
                url: 'http://LAN_IP:1234/http://google.com',
                success: function (data) {
                    console.log("Success: " + data);
                },
                error: function (e) {
                    alert("Error: " + e);
                    console.log("Error: " + e);
                }
            });

Le html de la page demandée est retourné et stocké dans la variable de données .




Deviner. Utilisé ceci à la place.

$('.div_class').load('http://en.wikipedia.org/wiki/Cross-origin_resource_sharing #toctitle');