練馬区のゴミ分別検索ページが使いにくいのでGASでWebAPIを作った

9964 ワード
練馬区 WebAPI gas WebAPI テキストリンク

目的

数ヶ月前に練馬区に引っ越したものの、ゴミの分別がめちゃくちゃめんどくさい。
それはいいとして、公式ページの「これは何ゴミ？」的なページも使いづらい。
LineでBot作って、聞いたら応えてくれるようにしたらいいんじゃね？ということで、
汎用性を高めるためにとりあえずまずはWebAPIを開発した。

用意するもの

  • Googleアカウント（Google DriveでGASを利用。GASでのWebAPIの作り方はこちらを参照）

やったこと

データの用意

以前にダクソ3のフレーバーテキストをランダムに返すAPIを作ったときと同じで、データが無い。いや、あるんだけどそもそも使いづらいから今回の話になってるわけで...。
ちなみに練馬区さんのゴミ検索ページはココ。
あいうえお順のページの飛んでから、気合で探す（ブラウザの検索機能使えば多少はましだけど）しかない...。

スクレイピングすることも考えたけど、そんなに頻繁に変わるものでもないと思うので、
とりあえずスプレッドシートにコピペコピペ＆コピペ。

これでデータは揃った...ことにしましょう。

API仕様の決定

前回のダクソ3のときとは違って、「検索キーワードを入れてもらう→合致したデータを返す」という流れになるはずなので、今回はリクエストパラメータを受け取らなきゃいけない...。

とりあえず、こんな感じでリクエストを投げてもらうことにします。

http://hogehoge.com?searchkey=魚の骨

コーディング

まずはGETリクエストが来たときの挙動を定義します。

リクエストパラメータ「searchkey」で検索キーワードを受け取り、あいまい検索でスプレッドシートから該当する情報を抽出する。

endpoint.gs

//GET時の挙動
//getData関数を呼び出して検索キーワードを渡し、戻り値としてゴミ配列を受け取る
//JSONにしてレスポンスとして返す
function doGet(e) {
  var garbages = getData(e.parameter.searchkey);

  return ContentService.createTextOutput(JSON.stringify(garbages)).setMimeType(ContentService.MimeType.JSON);
}

//検索キーワードを受け取り、シートA列であいまい検索を行う
//マッチした行をゴミオブジェクトとして登録し、これを全行分繰り返す
//ゴミオブジェクトたちを配列に保存して投げ返す
function getData(searchkey){

  var sheet = SpreadsheetApp.openById('1LLJXJeSubmD_Nqtb-wxBrZEmYn9Hiby_AjbpL3gwP2g');

  //A列のデータをごっそり読み取り
  var columnAVals = sheet.getRange('A:A').getValues();
  var columnBVals = sheet.getRange('B:B').getValues();
  var columnCVals = sheet.getRange('C:C').getValues();

  //このあとの繰り返し条件に使うので、最後の行番号を取得
  var lastRow = columnAVals.filter(String).length;

  var garbages = new Array();
  for(var i = 1; i <= lastRow; i++){


    if(((columnAVals[i].toString()).indexOf(searchkey)) !== -1){
      garbages.push(new GarbageData(columnAVals[i].toString(), columnBVals[i].toString(), columnCVals[i].toString()));
    }
  }

  return garbages;
}

上でしれっと使ってしまっていますが、今回返すべき情報は単一の情報ではなく、「ゴミの種類」「分別方法」「出し方」の3つが合わさった「ゴミオブジェクト」になるので、ここはお得意のオブジェクト指向を活用してゴミクラスを作っておきます。

Garbage.gs
GarbageData = function(itemname, category, notice){
  this.itemname = itemname;
  this.category = category;
  this.notice = notice;
};

GarbageData.prototype.getItemname = function(){
  return this.itemname;
};

GarbageData.prototype.getCategory = function(){
  return this.category;
};

GarbageData.prototype.getCategory = function(){
  return this.notice;
};

動作確認

前回同様、設計もクソも無いですがあとはWebアプリケーションとして公開するだけです。
公開の仕方は前回の記事（こちら）を見ていただくとして、動作確認です。

ブラウザで試してみます。

https://script.google.com/macros/s/AKfycbymo1obfb9uD6E8lewUEhUtI1zq9VuAQa4OBAi2iWF1F9ijOR4/exec?searchkey=空き缶

できたー。
改行コードとか入っちゃってますが、まあそのうち調整すればいいですかね。
そのうちLINE Botと連携しようと思います。