ヤフオクの検索一覧をまとめてウォッチリストに入れるChrome拡張機能

http://internet.watch.impress.co.jp/www/article/2003/0226/ya.htm

検索結果一覧を表示しているとき、そのページの出品をまとめてウォッチリストに入れるGoogle Chrome拡張機能である。ファイルはbackground.jsとmanifest.jsonの2つのみ。

manifest.json


{
  "name": "Add Watch List",
  "description": "Add items to watch list",
  "version": "2.0",
  "permissions": ["activeTab"],
  "background": {
    "scripts": ["background.js"],
    "persistent": false
  },
  "browser_action": {
    "default_title": "Add Watch List"
  },
  "manifest_version": 2
}



background.js

// Called when the user clicks on the browser action.

chrome.browserAction.onClicked.addListener(function(tab) {

  // No tabs or host permissions needed!

  console.log('Adding items to a watch list in ' + tab.url);

  // pop up page information

  //alert(tab.title);

  var url = tab.url;

  var xmlHttp = new XMLHttpRequest();

  xmlHttp.open("GET", url, false);

  xmlHttp.onload = function (e) {

  if (xmlHttp.readyState === 4) {

    if (xmlHttp.status === 200) {

      console.log(xmlHttp.responseText);

      } else {

      console.error(xmlHttp.statusText);

      }

    }

  };

  xmlHttp.onerror = function (e) {

    console.error(xhr.statusText);

  };

  xmlHttp.send(null);

  var src = xmlHttp.responseText;

  var count = 0;

  var poss = src.indexOf('<p class="modWlBtn" onclick="return false;"><a href="');

  var posl = src.indexOf('" class="b unwt" id="');

  var watch_url = src.slice(poss+53,posl);

  var watch_button_urls = [watch_url];

 

  while (poss != -1){

    count++;

    poss = src.indexOf('<p class="modWlBtn" onclick="return false;"><a href="', poss+1);

    posl = src.indexOf('" class="b unwt" id="', poss+1);

    if(poss>0){

    watch_button_urls.push(src.slice(poss+53,posl));     

    }

  }

//  window.open('http://www.yahoo.co.jp');



  console.log(watch_button_urls);

  var count2 = 0;

   for(var i=0;i<watch_button_urls.length;i++){

    count2++;

    chrome.tabs.create({url:watch_button_urls[i]});

   }

  alert(count2);

});

ウォッチリストへ追加するのは、a hrefのリンクを踏むことによって実現している。まず、ソースコードからウォッチリストのURLを探してきて、配列 watch_button_urlsに格納する。URLは
<p class="modWlBtn" onclick="return false;"><a href="

" class="b unwt" id="
に挟まれている。 そして、各要素に対してchrome APIからchrome.tabs.create({url:url})を呼びだして、ウォッチリスト追加の新規タブを開く。 この時点の問題点は、ウォッチリストに追加しようとした数だけ、それがたとえ既にウォッチリストに追加されていても、その数だけ新規タブが生成されてしまうこと。 クラウドワークスでここまでのプロトタイプを送ったが、契約が成立しなかったので公開しました。 この拡張機能は、上の2ファイルを空っぽのフォルダに入れ、chromeを起動し、設定から拡張機能をえらび、右上のデベロッパーモードをONにし、左上の「パッケージ化されていない拡張機能を読み込む」によって、さきほどのフォルダを指定することで読み込めます。 デバッグは、拡張機能のページから
を探してきて、バックグラウンドページを開く。すると、コンソールが表示される。今回はjsファイルのみで。htmlファイルがないので、このようになる。htmlがあればアドレスバーに chrome-extension://extensionのID/background.html のように入力してコンソールを開ける。

コメント