人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ブックマークレットに関する質問です

「ブラウザで現在表示しているページのソースを、特定のCGIにPostするブックマークレット」
上記は可能でしょうか?

また、もし可能でしたら、例えば
http://a.com/b.cgi
に、「c=<表示しているページのソース>」をPostするブックマークレットを教えて頂けないでしょうか?

ちょっと論点が合っているか自信がないのですが、Postするのは
・開いているURLのソース
・現在開かれているソース(例えばAjaxによる改変後の)
のどちらでも構いませんし、「<body>内のみ」程度の制限でしたら問題ありません

> Ajax により改変された、現在表示中の HTML のソースコードを確認する
http://labs.cybozu.co.jp/blog/kazuho/archives/2006/10/ajax_savvy_viewsource.php

どなたかご存じの方ご教授お願いできないでしょうか?

(また、当方Perl/PHPは遊び程度に組めますがJavaScriptを組めません)

●質問者: flatlight
●カテゴリ:コンピュータ インターネット
✍キーワード:Ajax CGI HTML JavaScript Perl
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● pahoo
●20ポイント

ブックマークレットなら、「ブラウザで現在表示しているページのURLを、特定のCGIにPostする」ことで十分だと思うのですが――。


セキュリティ対策上、「ブラウザで現在表示しているページのソース」すべてを送出するのは許されないと思います。

ページのソースの body タグに id が指定されていれば――たとえば

<body id="main">

となっていれば、下記の JavaScript によって body タグで囲まれた部分だけ変数 sour に post されます。

<script language="JavaScript">
sour = document.getElementById("main").innerHTML;
document.myform.action = "http://hoge/hogehoge.cgi';
document.myform.action += "?sour=" + sour;
document.myform.method = "post";
document.myform.submit();
</script>
◎質問者からの返答

回答ありがとうございます。ただ

javascript:(function(){sour=document.getElementById('main').innerHTML;

document.myform.action='http://hoge/hogehoge.cgi';

document.myform.action+='?sour='+sour;document.myform.method='post';

document.myform.submit();})();

をIEお気に入りに登録して発動させたところ「'document.myform'は Null またはオブジェクトではありません。」とのエラーで実行できませんでした。。。

また、

http://labs.cybozu.co.jp/blog/kazuho/archives/2006/10/ajax_savvy...

のページでは「<body>」内のソース全てを取得できているようなのですが、同様に「<body>」内のソースを取得しPostすることはできない、ということなのでしょうか?


2 ● shintabo
●20ポイント

javascript:(

function() {

var code = document.body.innerHTML;

var act = document.createElement('form');

act.action = 'http://modperlis.bounceme.net/work/body.cgi';

act.method = 'post';

act.name = 'myform';

var hid = document.createElement('input');

hid.type = 'hidden';

hid.name = 'body';

hid.value = code;

act.appendChild(hid);

document.body.appendChild(act);

document.myform.submit();

}

)();

=perl

以下、body.cgi

=cut

#!/usr/bin/perl

use strict;

use warnings;

use CGI;

my $cgi = CGI->new();

print "Content-type:text/html\n\n";

print $cgi->param('body');

exit;

__END__

◎質問者からの返答

回答ありがとうございます。相変わらず「'document.myform'は Null またはオブジェクトではありません。」とエラーが出るのでFirefoxでも試してみたところ、Firefoxでは動作いたしました。こういうことを全く理解していないのですが、IEでは動かないブックマークレット、という感じなのでしょうか?

とはいえ僕も普段はFirefoxなので非常に役立ちました。あと24時間ほど経ちましたら質問締めさせて頂きます。ありがとうございました


3 ● zero-uhura
●20ポイント

もろもろ横着したソースなうえ、別ウインドウからHTMLソースを送信していますがいかがでしょうか。


提示されているURLを参考にしてみる。

javascript:window.open('', '_blank', 'width=100,height=100,resizable=1,scrollbars=1').document.write('Send html:<form method="POST" action="http://a.com/b.cgi"><input type="hidden" name="c" value="' + escape(document.body.innerHTML) + '"><input type="submit"></form>')

Microsoft.XMLHTTP でソースを再取得してみる(IE限定)。

javascript:var f=function(){var r="";var getter=new ActiveXObject("Microsoft.XMLHTTP");getter.onReadyStateChange=function(){if(getter.readyState==4){if(getter.status==200){r=getter.responseText;}else{alert("error : status is "+getter.status);}}else{getter.send(null);}};getter.open("GET",location.href,true);return r;};c=f();if(c==""){alert("HTML取得に失敗しました。");}else{window.open('','_blank','width=100,height=100,resizable=1,scrollbars=1').document.write('Send html:<form method="POST" action="http://a.com/b.cgi"><input type="hidden" name="c" value="'+escape(c)+'"><input type="submit"></form>')};undefined;

↓分解すると

var f = function () {
var r = "";
var getter = new ActiveXObject("Microsoft.XMLHTTP");
getter.onReadyStateChange = function() {
if(getter.readyState == 4){
if(getter.status == 200){
r = getter.responseText;
}else{
alert("error : status is " + getter.status);
}
}else{
getter.send(null);
}
}
getter.open("GET", location.href, true);
return r;
}

c = f();
if (c == "") {
alert("HTML取得に失敗しました。");
} else {
window.open('', '_blank', 'width=100,height=100,resizable=1,scrollbars=1').document.write('Send html:<form method="POST" action="http://a.com/b.cgi"><input type="hidden" name="c" value="' + escape(c) + '"><input type="submit"></form>')
}
undefined;
◎質問者からの返答

ありがとうございます。上のブックマークレットは「ページソースをPostするためのウインドウを描画する」という役割ですよね。これならIEでも動作するようです。上でも書きましたが24時間後に質問締めさせて頂きます。ありがとうございました

ひょっとしたら

・IE/Firefoxの両方で使える(この条件を最初に書くべきだったんですね。。。)

・「Formを描画する」よりどちらかといえば「自動でPostする」

ブックマークレットがあるかもしれないので、あと24時間ほど開けさせて頂きます


4 ● shintabo
●30ポイント ベストアンサー

/* shintaboです。 */

/* 申し訳ないです。一生の不覚でした */

/* 訂正のjavascriptです */

javascript:(

function() {

var code = document.body.innerHTML;

var act = document.createElement('form');

act.action = 'http://modperlis.bounceme.net/work/body.cgi';

act.method = 'post';

act.name = 'myform';

act.id = 'myform';

var hid = document.createElement('input');

hid.type = 'hidden';

hid.name = 'body';

hid.value = code;

act.appendChild(hid);

document.body.appendChild(act);

document.getElementById('myform').submit();

}

)();

/* IEの場合、動的に生成したformタグにidをつけないと */

/* objectが取れてませんでした・・・orz */

/* DELETE FROM PERLER WHERE id = 'shintabo@perler' */

◎質問者からの返答

ありがとうございます!完璧に動作いたしました。まさに探していたとおりのブックマークレットです

二度もお時間取らせてしまってすみませんでした。早速使わせて頂きます。ありがとうございました

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ