回答:
アイデアは、これをブックマークに保存し、毎回フォームを埋めるのではなく、すばやく起動することです。
この目的のために、次のHTMLページが実行されます。ほとんどのブラウザで動作するはずです。
<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>
名前を付けて保存するC:\getToPostと、次のURLをブックマークできます。
file:///C:/getToPost?name1=value1&name2=value2#http://url.com/service
名前や値にほとんどの文字をそのまま使用できます。通常どおり、次をエンコードします。
# -> %23
% -> %25
& -> %26
= -> %3D
アドオンや外部ファイルに依存する必要のないクロスブラウザソリューションを探している場合、次の構文を使用して、Javascriptを直接ブックマークに配置してこれを実現できます。
javascript:(function(){ <Your Javascript code goes here> })();
デニスの答えからいくつかのコードを借りて説明します：
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();}
)();
欠点は、ブックマークが1行であるため、このすべてが1行で行かなければならないということです。これはブックマーク自体に含まれます：
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(); })();
多くのスペースを使用して、読みやすいものに簡単に変換し、1行に戻すことができます。上記の例では、Notepad ++などの「」を\ r \ nに置き換えて、複数行に戻すことができます。次に、それを単一行に戻すには、検索して\ r \ nを置換し、「」に置き換えて単一行に戻します。これにより、気が曲がりにくくなります...
他の答えに基づいて！
コードのデバッグバージョンに加えて、クリーンアップと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(); */
})();
明らかに、対応するhtmlがない場合、タグ名「form」を持つ要素は存在しない可能性があります...存在する場合、事態はさらに悪化します。上記はこれをよく示しています。Chrom javascript：URI /ブックマークが新しいタブで機能しないため、最初に一度ナビゲートする必要があることに注意してください。これにより、ドキュメントオブジェクトが生成されますが、javascript：alert（ 't'）;だけでも生成されます。何もしません。
私は以下を提案します。
(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();
})();
デバッグ設定を削除し、入力例をクリーンアップして、予想される内容を明確にします。http://jscompress.com/などを実行して、1行を取得します。
!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()}();
編集：実用例を提供します。
米国ミネソタ州ミネアポリスでは、これを使用して無料WiFi ESSID「USIW Free WiFi」にアクセスします。https://login.usiwireless.com/mplsfree/logon.php?originalurl=www.google.com/を使用してアカウントを登録した後、悪用の理由でクレジットカードが必要です。
これを使用して、明らかに置き換えられたネットワークにログインします。
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()}();
最新のブラウザ機能とES6を使用したJavaScriptブックマークレットアプローチの短縮バージョン：
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()
}以下をブックマークのターゲットとして設定し、URLとformDataを適切に置き換えます。
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()}
私が同じ問題に直面したとき、Firefoxのこの美しいアドオンを見つけました：Bookmark POST
そのブックマークを使用して、ブックマークされたPOSTリクエストへの4つの簡単なステップ（javascriptは不要）：
POSTDATA={YOUR_REQUEST_BODY_HERE}し、ブックマークの説明として文字列を追加します。私はこれが受け入れられた答えを持つ古い質問であることを知っています。ただし、その答えは非常に手作業であり、ユーザーのJavaScriptプログラミング作業が必要です。他のブラウザアドオン/拡張機能/プラグインがリストされていますが、最新のブラウザバージョンでは動作しないか、まだかなり手動です。ブックマークレットを生成するブックマークレットを作成しました（@raphinesseの回答から変更されたコードが含まれています）。私のブックマークレットは https://github.com/GlenCoakley/createFormSubmittingBookmarkletsにあります。