ツイッターでアップロードした画像のオリジナル画像を表示するブックマークレット [メール投稿]
正己さんはTwitterを使っています: "ツイッターでオリジナル画像を表示する→ javascript:(function(){var%20url=document.location.href;url='https:'+url.split(':')[1]+':orig';window.open(url);})();"
...
ツイッター本家でアップロードした画像は、今のところ、
https://pbs.twimg.com/media/ファイル名(jpg、png、他)
らしく、このURLの末尾にサイズを指定する :large、:small、:medium、:thumb、:orig の付いたURLもある。
大きなサイズの画像をアップロードすると縮小されて表示されてることがある。URLにサイズ指定が無いのにアップロードしたオリジナルのサイズで表示されないことがある。サイズ指定の :orig がオリジナルの画像かもしれないので、サイズ指定がなかったり、:large、:small、:medium、:thumb がURLの末尾についている画像を :orig が付いた
https://pbs.twimg.com/media/ファイル名(jpg、png、他):orig
にして表示するのを容易にしたい。
そこで、ブックマークレットを作った。IE11でも使えるらしい。ただし、画像がツイートに埋め込まれた状態ではなく、画像だけが表示された状態でしか利用できない。上のようにツイートにスクリプトは残してあるが、忘れちゃうかもしれないのでブログに残す。
ブックマークレット→ 【to_orig】
追記(2015/2/28):
上のブックマークレットは、画像を表示させてからオリジナルに切り替えるものだったが、もっと便利に、statusページから直接オリジナル画像を別のタブで表示してくれて、画像が複数ある場合にも対応しているブッマークレットを作ってくれてる人がいた。
→【Twitter画像原寸表示ブックマークレット】
ここの「Twitter画像原寸表示 v1.141218c」を使ってみたが、とても便利だった。
どうやら、statusページのheadタグ内から'pbs.twimg.com/media/'を検索して':large'の前までのURLを抜き出して':orig'を付加する作業を検索範囲を縮小しながら繰り返しているらしい。
とても勉強になったので、私も同じ仕組みのスクリプトを作ってみた。最初は同じようにheadタグ内を検索するようにしていたのだが、headタグ内に画像などの情報が無い場合もあるのでbodyタグ内を検索させた。それから、'pbs.twimg.com/media/'を検索すれば早いのだけど、'pbs.twimg.com'で検索して/media/以外も拾えるようにしてみた。/profile_images/は邪魔なので除外し、bodyタグ内は同じ画像のURLが大量にあるので重複して表示しないようにして、さらに、返信元ツイートなどを表示している時にブックマークレットをクリックしたらエンコードされたテキストが抽出されてURLの終わりを見つけるのに失敗していたので、除外した。
他の情報にも対応できるようにと工夫したつもりだったが、/media/'以外はGIFアニメをmp4に変換しちゃった/tweet_video/とそのサムネイルの/tweet_video_thumb/しか見つからなくて、対して応用が利かなく、スクリプトが複雑になっただけだった。やはり、【Twitter画像原寸表示ブックマークレット】の「Twitter画像原寸表示 v1.141218c」の方を使った方が良い。
でも、バグを消しながら一所懸命作ったので、私のスクリプトとブックマークレットも載せておく。
ブックマークレット→ 【to_orig】
javascript:(function(){
var%20url=document.location.href;
var%20str=document.getElementsByTagName('bodyhead')[0].innerHTML;
if(url.indexOf('pbs.twimg.com/media/')!=-1){
url='https:'+url.split(':')[1]+':orig';window.open(url);
}
else%20if((url.indexOf('twitter.com')!=-1)&&(url.indexOf('status')!=-1)){
var%20posA=str.indexOf('pbs.twimg.com');
var%20posB=str.indexOf('"',posA+1);
var%20url0='';
while(posA!=-1){
url=str.substring(posA,posB);
if((url.split(':')[0]!=url0)&&(url.indexOf('profile_images')==-1)&&(url.indexOf('profile_banners')==-1)&&(url.indexOf('"')==-1)){
url0=url.split(':')[0];
if(url.indexOf('media')!=-1){url='https://'+url0+':orig'}
else{url='https://'+url}
window.open(url);
}
posA=str.indexOf('pbs.twimg.com',posB+1);
posB=str.indexOf('"',posA+1);
}
}
})();
var%20url=document.location.href;
var%20str=document.getElementsByTagName('
if(url.indexOf('pbs.twimg.com/media/')!=-1){
url='https:'+url.split(':')[1]+':orig';window.open(url);
}
else%20if((url.indexOf('twitter.com')!=-1)&&(url.indexOf('status')!=-1)){
var%20posA=str.indexOf('pbs.twimg.com');
var%20posB=str.indexOf('"',posA+1);
var%20url0='';
while(posA!=-1){
url=str.substring(posA,posB);
if((url.split(':')[0]!=url0)&&(url.indexOf('profile_images')==-1)&&(url.indexOf('profile_banners')==-1)&&(url.indexOf('"')==-1)){
url0=url.split(':')[0];
if(url.indexOf('media')!=-1){url='https://'+url0+':orig'}
else{url='https://'+url}
window.open(url);
}
posA=str.indexOf('pbs.twimg.com',posB+1);
posB=str.indexOf('"',posA+1);
}
}
})();
追記(2015/2/28):
やっぱりバグが残っていたので、bodyの中を検索するのを諦めてheadの中を検索するように一時的に変更した。画像以外のメディアもブックマークレットで単独表示できるようになればと思ったけれど、今はニーズが無いので諦める。
コメント 0