98 votes

window.open avec les en-têtes

Est-ce que je peux contrôler les en-têtes HTTP envoyés par window.open (cross browser) ?

Si non, puis-je d'une manière ou d'une autre window.open une page qui émet ensuite ma demande avec des en-têtes personnalisés dans sa fenêtre contextuelle ?

J'ai besoin de quelques astuces.

56voto

Quentin Points 325526

Puis-je contrôler les en-têtes HTTP envoyés par window.open (cross browser) ?

Non

Si ce n'est pas le cas, puis-je d'une manière ou d'une autre ouvrir par window.open une page qui émet ensuite ma requête avec des en-têtes personnalisés dans sa fenêtre pop-up ?

  • Vous pouvez demander une URL qui déclenche un programme côté serveur qui effectue la demande avec des en-têtes arbitraires et renvoie ensuite la réponse.
  • Vous pouvez exécuter JavaScript (qui dit probablement adieu à l'amélioration progressive) qui utilise XHR pour faire la demande avec des en-têtes arbitraires (en supposant que l'URL s'inscrit dans la politique de la même origine), puis traiter le résultat en JS.

J'ai besoin de quelques trucs astucieux...

Il serait peut-être utile que vous décriviez le problème au lieu de demander si les solutions possibles fonctionneraient.

26voto

Francky Vincent Points 71

Malheureusement, vous ne pouvez pas contrôler les en-têtes en utilisant window.open().

Sympa et facile, comment j'ai réussi à ouvrir un fichier avec des en-têtes personnalisés :

const viewFile = async (url) => {

  // Change this to use your HTTP client
      fetch(url, {/*YOUR CUSTOM HEADER*/} ) // FETCH BLOB FROM IT
        .then((response) => response.blob())
        .then((blob) => { // RETRIEVE THE BLOB AND CREATE LOCAL URL
          var _url = window.URL.createObjectURL(blob);
          window.open(_url, "_blank").focus(); // window.open + focus
      }).catch((err) => {
        console.log(err);
      });
};
  • Télécharger le fichier dans le cache
  • window.open to cache

11voto

Igor Points 1468

Si vous contrôlez le côté serveur, il serait possible de définir la valeur de l'en-tête dans la chaîne de requête et de l'envoyer comme ça ? De cette façon, vous pourriez l'analyser à partir de la chaîne de requête si elle n'est pas trouvée dans les en-têtes.

Juste une idée... Et vous avez demandé une astuce :)

0 votes

L'ajout d'un en-tête dans la chaîne de requête n'est pas susceptible de poser des problèmes de sécurité ? puisqu'il ne sera pas crypté en https.

3 votes

Les chaînes d'interrogation sont cryptées avec https. stackoverflow.com/questions/2629222/ Mais vous ne devriez toujours pas mettre d'informations sensibles dans la chaîne de requête... L'OP n'a pas spécifié le type d'en-têtes qu'il souhaite mettre dans la chaîne de requête.

0voto

actanble Points 9

Comme le meilleur anwser a écrit en utilisant XMLHttpResponse sauf window.open et je fais l'abstrait-anwser comme une instance.

Le fichier Js principal est download.js Télécharger-JS

 // var download_url = window.BASE_URL+ "/waf/p1/download_rules";
    var download_url = window.BASE_URL+ "/waf/p1/download_logs_by_dt";
    function download33() {
        var sender_data = {"start_time":"2018-10-9", "end_time":"2018-10-17"};
        var x=new XMLHttpRequest();
        x.open("POST", download_url, true);
        x.setRequestHeader("Content-type","application/json");
//        x.setRequestHeader("Access-Control-Allow-Origin", "*");
        x.setRequestHeader("Authorization", "JWT " + localStorage.token );
        x.responseType = 'blob';
        x.onload=function(e){download(x.response, "test211.zip", "application/zip" ); }
        x.send( JSON.stringify(sender_data) ); // post-data
    }

-4voto

sunil bishnoi Points 1

Vous ne pouvez pas ajouter directement des en-têtes personnalisés avec fenêtre.open() dans la fenêtre popup mais pour cela, nous avons deux solutions possibles


  1. Ecrire une méthode Ajax pour appeler cette URL particulière avec des en-têtes dans un fichier HTML séparé et utiliser ce HTML comme url dans <i>window.open()</i> voici abc.html
        $.ajax({
        url: "ORIGIONAL_URL",
        type: 'GET',
        dataType: 'json',
        headers: {
            Authorization : 'Bearer ' + data.id_token,
            AuthorizationCheck : 'AccessCode ' +data.checkSum , 
            ContentType :'application/json'
        },

        success: function (result) {
              console.log(result);
        },
        error: function (error) {

        } });

appeler html

window.open('*\abc.html')

ici, la politique CORS peut bloquer la demande si CORS n'est pas activé dans l'URL demandée. .


  1. Vous pouvez demander une URL qui déclenche un programme côté serveur qui effectue la demande avec des en-têtes personnalisés et renvoie ensuite la réponse en redirigeant vers cette URL particulière.

Supposons qu'en Java Servlet (/requestURL) nous fassions cette requête

`

_String[] responseHeader= new String[2]; responseHeader[0] = "Bearer " + id_token; responseHeader[1] = "AccessCode " + checkSum;

        String url = "ORIGIONAL_URL";

        URL obj = new URL(url);
        HttpURLConnection urlConnection = (HttpURLConnection) obj.openConnection();
        urlConnection.setRequestMethod("GET");
        urlConnection.setDoInput(true);
        urlConnection.setDoOutput(true);
        urlConnection.setRequestProperty("Content-Type", "application/json");
        urlConnection.setRequestProperty("Accept", "application/json");
        urlConnection.setRequestProperty("Authorization", responseHeader[0]);
        urlConnection.setRequestProperty("AuthorizationCheck", responseHeader[1]);
        int responseCode = urlConnection.getResponseCode();
        if (responseCode == HttpURLConnection.HTTP_OK) {
            BufferedReader in = new BufferedReader(new 
                         InputStreamReader(urlConnection.getInputStream()));
            String inputLine;
            StringBuffer response1 = new StringBuffer();

            while ((inputLine = in.readLine()) != null) {
                response1.append(inputLine);
            }
            in.close();
            response.sendRedirect(response1.toString());
            // print result
            System.out.println(response1.toString());
        } else {
            System.out.println("GET request not worked");
        }_ 

`

appeler le servlet dans window.open('/requestURL')

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X