Stockage d'une demande HTTP POST dans un signet ou quelque chose de similaire à celui d'une demande GET

26

Vous pouvez stocker un signet avec une demande GET comme ceci:

http://url.com/service?variable=value

Pouvez-vous stocker une demande POST d'une manière ou d'une autre dans Chrome? Peut-être avec un plugin? Ou peut-être dans Firefox?

L'idée est que je le stocke dans un signet et que je le déclenche rapidement au lieu d'avoir à remplir un formulaire à chaque fois.

google-chrome http bookmarks Petruza
la source
En relation? Google Chrome: possibilité de soumettre des demandes POST / GET?
slhck
1
Selon votre système d'exploitation, vous souhaiterez peut-être utiliser curlpour envoyer la demande POST à ​​partir d'un fichier
slhck
aussi: Comment enregistrer un signet dans Firefox avec des données POST
Rich Homolka
Découvrez l'extension Greasemonkey, disponible pour FF et Chrome.
ott--

Réponses:

17

L'idée est que je le stocke dans un signet et que je le déclenche rapidement au lieu d'avoir à remplir un formulaire à chaque fois.

À cet effet, la page HTML suivante fera l'affaire. Cela devrait fonctionner dans la plupart des navigateurs.

<html>
    <head>
        <title>getToPost</title>
        <script>
            function getToPost()
            {
                var form = document.getElementsByTagName('form')[0];
                form.style.visibility = 'hidden';
                form.action = document.location.hash.substr(1);
                var search = decodeURIComponent(document.location.search);
                search = search.substr(1).split('&');
                for(var i = 0, j = search.length, input; i < j; i++)
                {
                    input = document.createElement('input');
                    search[i] = search[i].split('=');
                    input.name = search[i][0];
                    input.value = search[i][1];
                    form.appendChild(input);
                }
                form.submit();
            }
        </script>
    </head>
    <body onload="getToPost()">
        <form method="POST"></form>
    </body>
</html>

Enregistrez-le sous C:\getToPostet vous pouvez mettre en signet l'URL suivante:

file:///C:/getToPost?name1=value1&name2=value2#http://url.com/service

Vous pourrez utiliser la plupart des caractères dans les noms ou les valeurs littéralement. Encodez les éléments suivants comme d'habitude:

#   ->   %23
%   ->   %25
&   ->   %26
=   ->   %3D
Dennis
la source
Cela a fonctionné directement pour un site, merci! Cependant, pour un autre site utilisant AJAX (je pense) cela ne fonctionne pas encore (je me trompe peut-être); y a-t-il quelque chose qui changerait si le get / post-thing est géré par AJAX?
noisette sur natty
6

Si vous recherchez une solution multi-navigateur qui ne nécessite pas de modules complémentaires ou de fichiers externes, Javascript peut être placé directement dans un signet pour y parvenir, en utilisant cette syntaxe:

javascript:(function(){ <Your Javascript code goes here> })();

Emprunter du code de la réponse de Denis pour illustrer:

javascript:(function()
{ 
var form = document.getElementsByTagName('form')[0];
form.style.visibility = 'hidden';
form.method = 'post';
form.action = 'https://your.urlgoes.here/build?delay=0sec';
var search = 'name=ENVIRONMENT&value=production&name=DEPLOYTYPE&value=Incremental&name=BRANCH&value=master&statusCode=303&redirectTo=.&json={"parameter": [{"name": "ENVIRONMENT", "value": "production"}, {"name": "DEPLOYTYPE", "value": "Incremental"}, {"name": "BRANCH", "value": "master"}], "statusCode": "303", "redirectTo": "."}&Submit=Build';
search = search.substr(1).split('&');
for(var i = 0, j = search.length, input; i < j; i++)
{
input = document.createElement('input');
search[i] = search[i].split('=');
input.name = search[i][0];
input.value = search[i][1];
form.appendChild(input);
}
 form.submit();}
)();

L'inconvénient est que tout cela doit aller sur une seule ligne, car un signet est une seule ligne, donc il peut être un peu compliqué de travailler avec. Cela va dans le signet lui-même:

javascript:(function(){    var form = document.getElementsByTagName('form')[0];   form.style.visibility = 'hidden';   form.method = 'post';   form.action = 'https://your.urlgoes.here/build?delay=0sec';   var search = 'name=ENVIRONMENT&value=production&name=DEPLOYTYPE&value=Incremental&name=BRANCH&value=master&statusCode=303&redirectTo=.&json={"parameter": [{"name": "ENVIRONMENT", "value": "production"}, {"name": "DEPLOYTYPE", "value": "Incremental"}, {"name": "BRANCH", "value": "master"}], "statusCode": "303", "redirectTo": "."}&Submit=Build';   search = search.substr(1).split('&');   for(var i = 0, j = search.length, input; i < j; i++)   {   input = document.createElement('input');   search[i] = search[i].split('=');   input.name = search[i][0];   input.value = search[i][1];   form.appendChild(input);   }    form.submit();   })();

Un certain nombre d'espaces peuvent être utilisés pour convertir facilement en quelque chose de plus lisible et revenir à la ligne unique. Dans l'exemple ci-dessus, "" peut être remplacé par \ r \ n dans quelque chose comme Notepad ++ pour le reconvertir en plusieurs lignes. Ensuite, pour le reconvertir en une seule ligne, une recherche et remplacer pour \ r \ n le remplacement par "" le reconvertit en une seule ligne. Cela le rend légèrement moins courbé ...

jotap
la source
3

S'appuyant sur les autres réponses!

La version de débogage du code, plus le nettoyage ET jsbeautifier.org/.

(function() {
    var ThisAction = 'https://your.urlgoes.here/build?delay=0sec';
    /* A little JSON never hurt anyone */
    var ThisPost = {
        name: 'ENVIRONMENT',
        value: 'production',
        name: 'DEPLOYTYPE',
        value: 'Incremental',
        name: 'BRANCH',
        value: 'master',
        statusCode: '303',
        redirectTo: '.',
        json: '{"parameter": [{"name": "ENVIRONMENT", "value": "production"}, {"name": "DEPLOYTYPE", "value": "Incremental"}, {"name": "BRANCH", "value": "master"}], "statusCode": "303", "redirectTo": "."}',
        Submit: 'Build'
    };

    /* Help us locate this function */
    console.trace();
    /* See what we are looking at */
    console.log(document);
    var form = document.getElementsByTagName('form')[0];
    form.style.visibility = 'hidden';
    form.method = 'post';
    form.action = ThisAction;
    for (var key in ThisPost) {
        if (ThisPost.hasOwnProperty(key)) {
            input = document.createElement('input');
            input.name = key;
            input.value = ThisPost[key];
            form.appendChild(input);
        }
    }
    /* form.submit(); */
})();

De toute évidence, sans le code HTML correspondant, l'élément avec le nom de balise 'form' pourrait bien ne pas exister ... et les choses sont pires si c'est le cas. Ce qui précède le démontre bien. Notez que dans chrome javascript: les URI / Signets ne fonctionnent pas dans un nouvel onglet, vous devez d'abord naviguer une fois. Cela remplit l'objet document, mais même juste un javascript: alert ('t'); ne fait rien.

Je suggère ce qui suit.

(function() {
    var ThisAction = 'https://your.urlgoes.here/build?optional=uri_get';
    /* A little JSON never hurt anyone */
    var ThisPost = {
        multiple: 'value',
        key: 'pairs',
        or: 'JSON like so...',
        note: 'the double quotes and last item with NO trailing comma.',
        json: '{parameter: [{name: "stuff"}]}'
    };

    var form = document.createElement('form');
    form.style.visibility = 'hidden';
    form.method = 'post';
    form.action = ThisAction;
    for (var key in ThisPost) {
        if (ThisPost.hasOwnProperty(key)) {
            var input = document.createElement('input');
            input.name = key;
            input.value = ThisPost[key];
            form.appendChild(input);
        }
    }
    document.body.appendChild(form);
    form.submit();
})();

Supprimez les paramètres de débogage, nettoyez l'exemple d'entrée pour une meilleure clarté de ce qui est attendu. Parcourez http://jscompress.com/ ou autre et obtenez une seule ligne.

!function(){var e="https://your.urlgoes.here/build?optional=uri_get",t={multiple:"value",key:"pairs",or:"JSON like so...",note:"the double quotes and last item with NO trailing comma.",json:'{parameter: [{name: "stuff"}]}'},i=document.createElement("form");i.style.visibility="hidden",i.method="post",i.action=e;for(var o in t)if(t.hasOwnProperty(o)){var a=document.createElement("input");a.name=o,a.value=t[o],i.appendChild(a)}document.body.appendChild(i),i.submit()}();

Modifier: fournissez un exemple de travail.

À Minneapolis, dans le Minnesota, aux États-Unis, utilisez-le pour accéder au WiFi gratuit ESSID "USIW Free WiFi". Après avoir utilisé https://login.usiwireless.com/mplsfree/logon.php?originalurl=www.google.com/ pour enregistrer un compte, ils veulent une carte de crédit pour des raisons d'abus.

Utilisez-le pour vous connecter au réseau, avec les remplacements évidents.

javascript:!function(){var e="https://login.usiwireless.com/mplsfree/logon.pl",o={usernameLogin:"USER",passwordLogin:"PASSWORD",originalurl:"www.google.com/"},n=document.createElement("form");n.style.visibility="hidden",n.method="post",n.action=e;for(var i in o)if(o.hasOwnProperty(i)){var t=document.createElement("input");t.name=i,t.value=o[i],n.appendChild(t)}document.body.appendChild(n),n.submit()}();
Mike Mestnik
la source
3

Une version plus courte de l'approche du bookmarklet javascript utilisant les fonctionnalités de navigateur modernes et ES6:

post('https://example.com', {foo: 'bar'})

function post(url, formData) {
  const makeElem = (tag, props) => Object.assign(document.createElement(tag), props)
  const form = makeElem('form', { action: url, method: 'post', style: 'display: none' })
  for (const [name, value] of Object.entries(formData)) {
    form.appendChild(makeElem('input', { name, value }))
  }
  document.body.appendChild(form)
  form.submit()
}

Définissez ce qui suit comme cible de signet et remplacez l'URL et formData de manière appropriée.

javascript:post('https://example.com',{foo:'bar'});function post(a,b){const c=(e,f)=>Object.assign(document.createElement(e),f),d=c('form',{action:a,method:'post',style:'display: none'});for(const[e,f]of Object.entries(b))d.appendChild(c('input',{name:e,value:f}));document.body.appendChild(d),d.submit()}
raphinesse
la source
0

Lorsque j'ai rencontré le même problème, j'ai trouvé ce magnifique module complémentaire pour Firefox: Bookmark POST

Avec ce signet, ses quatre étapes faciles pour votre demande POST signet (aucun javascript requis):

  1. Ouvrez la page avec le formulaire que vous souhaitez mettre en signet et remplissez le formulaire de manière "typique". Ne soumettez pas encore.
  2. Ouvrez les outils de développement Web -> Analyse de réseau.
  3. Soumettez votre formulaire. La soumission apparaîtra dans l'analyse du réseau. Là, vous pouvez sélectionner "Modifier et envoyer à nouveau" et copier le "corps de la demande".
  4. Créez un signet sur la page du formulaire et ajoutez la chaîne POSTDATA={YOUR_REQUEST_BODY_HERE}comme description des signets .
SebastianH
la source
0

Je sais que c'est une vieille question avec une réponse acceptée. Cette réponse est cependant assez manuelle, nécessitant un effort de programmation javascript pour l'utilisateur. Il existe d'autres extensions / extensions / plugins de navigateur répertoriés, mais ils ne fonctionnent pas avec la dernière version du navigateur ou sont encore tout à fait manuels. J'ai écrit un bookmarklet qui génère un bookmarklet (qui inclut le code modifié de la réponse de @ raphinesse). Mon bookmarklet est ici: https://github.com/GlenCoakley/createFormSubmittingBookmarklets .

Glen
la source