console.lealog();

@leader22のWeb系に関する勉強めもブログですのだ

iPhoneのSleipnir MobileでInstapaperするブックマークレット

とは言っても偉大な先人のを参考に、ほんの一手間かけただけ・・です。

iPhone4のSleipnir Mobile1.4で動作確認しました。

・・・ただのブックマークレットです!

Sleipnir Mobile

これです、これ。
Sleipnir Mobile - Web ブラウザ App

カテゴリ: ユーティリティ

価格: 無料

個人的にはiPhoneのブラウザアプリはこれ一択やと思ってます。
特にこだわりなくSafariな方はぜひ一度試してみてください!

公式サイトもどうぞ→Sleipnir Mobile

べ、別にただ単に宣伝したいだけじゃないんだから・・・!


最近、はてブ連携機能がついてさらに使い勝手が良くなったのですが、ふとした不満がありまして。
「あとでよむ」できない!

私だけかもしれませんが、あるんですよそういうシチュエーションが。

Instapaper

いわゆる「あとでよむ」サービス。
もはや説明不要!

後述ですが、ReadItLaterはちゃんとブックマークレットありました。

公式サイト→Instapaper

ソース

※このソースは、@ganymede_j3さんのブックマークツールバーからInstapaperに追加するJavascriptをつくってみたを参考に作成しました。
※↑のサイトでも書かれていますが、利用に際して一切の責任は負えませんのでご了承ください。

3行目と4行目の、”あなたの〜”のところを、自分仕様に変更して使ってみてください。

javascript:(function(){
  var instapaper='https://www.instapaper.com/api/add?username=$USR$&password=$PASS$&url=$URL$&title=$TTL$'; // 要求するAPIを準備
  var username=escape('あなたのアドレスかユーザーネーム'); // Instapaper登録したときのを!
  var password=escape('あなたのパスワード').replace(///g,'%2F'); // こちらもおなじく!(任意らしいので不要かも?
  var url=escape(location.href).replace(///g,'%2F');  // あとで読みたいURL
  var ttl=encodeURI(document.title); // Instapaperの画面に出るURL用
  instapaper=instapaper.replace('$USR$',username).replace('$PASS$',password).replace('$URL$',url).replace('$TTL$',ttl); // さっき準備したやつに値を入れてく
  call(instapaper); // ↓のcall関数を実行!
  function call(instapaper){ // ↑で準備したAPIを要求
    var req=new XMLHttpRequest(); // XMLHttpRequestオブジェクト作ってー
    req.open('GET',instapaper); // GETでリクエスト!
    req.onreadystatechange=function(aEvt){  // さて、返答はどうでしょう
      if(req.readyState==4){  // ステータスが4:リクエスト処理完了
        if(req.status>201){  // APIから戻ってくるステータスは、成功したとき201だそうな by 公式APIガイド
          alert('Error..'); // だから201より大きい数字が返ってきたら、残念ながらエラーです。 その他に400、403、500が返ってくるらしい by 公式APIガイド
        }else{
          alert('Done!'); // そうじゃないなら成功です。やったー!
        }
      }
    };
  req.send(null); // 送るデータはないのでnull
  }
})(); // という関数です。

元のままだと、タイトルが文字化けするケースがあったので、そこだけ追記してます。

後半のソースはほんとにそのままです。
ほんとにお世話になります。

最初検索する前は、「平文で全部APIに向かって投げて、処理結果も無視してとにかく登録さえできりゃOK!!」とか考えてたので、ほんと自分のスキルのなさを実感しますです・・。

コメントは自分の勉強のために付け足しました。
間違ってたら教えてください。

一行にしたやつ。
同じく”あなたの〜”を変更してください。

javascript:(function(){var instapaper='https://www.instapaper.com/api/add?username=$USR$&password=$PASS$&url=$URL$&title=$TTL$';var username=escape('あなたのアドレスかユーザーネーム');var password=escape('あなたのパスワード').replace(///g,'%2F');var url=escape(location.href).replace(///g,'%2F');var ttl=encodeURI(document.title);instapaper=instapaper.replace('$USR$',username).replace('$PASS$',password).replace('$URL$',url).replace('$TTL$',ttl);call(instapaper);function call(instapaper){var req=new XMLHttpRequest();req.open('GET',instapaper);req.onreadystatechange=function(aEvt){if(req.readyState==4){if(req.status>201){alert('Error..');}else{alert('Done!');}}};req.send(null);}})();

メールかなんかでiPhoneに送って、コピーして、Sleipnir MobileなりSafariを開いて、適当なページお気に入りにして、そのお気に入りのURLを編集で↑をペーストして編集完了、あとで読みたいページに行った時にこのお気に入りを開こうとすると!
・・・まぁ、こんな記事読む人には詳しい説明はいらないか・・。

ちなみに、PC版のSafariChromeの最新版でも動きました。(たぶんIE以外は動くはず?)

ブックマークレットなんて普通は・・

言うまでもなく、いわゆるブックマークレットというやつです。
これを作ってから検索してみました。
するとこんなものが・・・!

Tapmarklets - iPhone、Android などのスマートフォン用 Web ブラウザ向けブックマークレット集(スマートフォン専用ページ)

そうです。
Sleipnir Mobileの開発元、Fenrir社さんのとこの、ブックマークレット集サイトです。

Instapaper連携のんをわざわざ作っておいて、ここにあったらなんて徒労!!と思ったのですが、検索する限り見当たらなかったです。
せーふせーふw

良い勉強になりました。

にしてもFenrir社さんはいつ見ても綺麗なサイト+アプリよねー。
WindowsでIE使う時は、絶対Sleipnir派です。
Mac版もこないだリリースされてましたね。