Hatena::ブログ(Diary)

Griever Twitter

2010/09/04

Chrome で画像の一括ダウンロード

拡張の権限なんか必要なく、ただのブックマークレットです。

Chrome の Dev 版で動作確認。

javascript:(function(){
	Array.prototype.slice.call(document.querySelectorAll(
		'a[href$=".png"], a[href$=".gif"], a[href$=".jpg"], a[href$=".jpeg"], a[href$=".bmp"],' + 
		'a[href$=".PNG"], a[href$=".GIF"], a[href$=".JPG"], a[href$=".JPEG"], a[href$=".BMP"]'
	)).some(function(e){
		dispatchMouseEvents({ type:'click', altKey:true, target:e, button:0 });
	});
	
	function dispatchMouseEvents(opt) {
		var evt = document.createEvent('MouseEvents');
		evt.initMouseEvent(opt.type, opt.canBubble||true, opt.cancelable||true, opt.view||window, 
		                   opt.detail||0, opt.screenX||0, opt.screenY||0, opt.clientX||0, opt.clientY||0, 
		                   opt.ctrlKey||false, opt.altKey||false, opt.shiftKey||false, opt.metaKey||false, 
		                   opt.button||0, opt.relatedTarget||null);
		opt.target.dispatchEvent(evt);
		return evt;
	}
})();

↑を実行するとテスト用画像が DL されます。

テスト用画像(http://st-hatena.com/users/Gr/Griever/user_p.gif)


やってることは画像リンクに Alt + クリックイベント送ってるだけ。

Google 画像検索とかはリダイレクトをなんとかしなきゃいけないし、ファイルタイプによっては確認が入るみたいです(調べてない


リンクはページ内に無くても良いので

var e = document.createElement('a');
e.href = 'hogehoge.png';
dispatchMouseEvents({ type:'click', altKey:true, target:e, button:0 });

こんな感じにすれば「選択範囲内の画像を保存」とか「連番の画像を保存」とかできそうですね。



拡張の API に DL 絡みがないのにブックマークレットで DL ができちゃうのはどうなんだろう。。

Chrome さんはリンクにクリックイベント送られるのは想定してないんですかね?新しいタブとかも開き放題なんですが…。

改良(改悪?)した

Google Images で使っちゃダメですよ???

新しい Google Images では絶対使っちゃダメですよ???

javascript:(function(){
	var regexp = /https?:\/\/[^&?#]+?\.(?:jpe?g|png|gif|bmp)(?:$|\b)/i;
	var array = Array.prototype.slice.call(document.querySelectorAll(
		'a[href*=".png"], a[href*=".gif"], a[href*=".jpg"], a[href*=".jpeg"], a[href*=".bmp"],' + 
		'a[href*=".PNG"], a[href*=".GIF"], a[href*=".JPG"], a[href*=".JPEG"], a[href*=".BMP"]'
	));
	
	for (var i = 0, l = array.length; i < l; i++) {
		var m = regexp(array[i].href);
		if (!m) continue;
		var a = document.createElement('a');
		a.href = m;
		dispatchMouseEvents({ type:'click', altKey:true, target:a, button:0 });
	}

	function dispatchMouseEvents(opt) {
		var evt = document.createEvent('MouseEvents');
		evt.initMouseEvent(opt.type, opt.canBubble||true, opt.cancelable||true, opt.view||window, 
		                   opt.detail||0, opt.screenX||0, opt.screenY||0, opt.clientX||0, opt.clientY||0, 
		                   opt.ctrlKey||false, opt.altKey||false, opt.shiftKey||false, opt.metaKey||false, 
		                   opt.button||0, opt.relatedTarget||null);
		opt.target.dispatchEvent(evt);
		return evt;
	}
})();

alifeclubalifeclub 2010/09/10 21:04 とても魅力的な記事でした。
また遊びにきます。
ありがとうございます。

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/Griever/20100904/1283603283