Googleマイマップを強引に自動更新する技術と物語 #プログラミングLT === tag: プログラミングLT スライド全閲覧リンク: https://hackmd.io/p/B10OgAAcE?print-pdf#/ --- ### Googleマイマップを強引に自動更新する技術と物語 プログラミングLT 2019 hotuta [@hotu_ta](https://twitter.com/hotu_ta) <!-- - [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新する技術と物語というタイトルでLTをします、"ほつた"です - よろしくお願いします！ - なお、スライドは公開済みで、ハッシュタグをつけてスライドに関するリンクをツイートをしましたのでご確認ください！ --> --- ## My Profile :busts_in_silhouette: :thought_balloon: - Full Name: Jumpei Hotta - Twitter: [@hotu_ta](https://twitter.com/hotu_ta) - My tweet is only Japanese! - GitHub ID: [hotuta](<https://github.com/hotuta>) - My Site: https://hotuta.github.io - My Favourite Programming Language: [Ruby](https://www.ruby-lang.org/) - My Favourite [Selenium](https://github.com/SeleniumHQ/selenium) Library: [Capybara](https://github.com/teamcapybara/capybara) - **Dislike Programming Language: ["P" Language (PHP, Python)](https://twitter.com/hotu_ta/status/670420676960874496)** <!-- - Hottaです。Hotta Jumpeiです。 - プログラミング言語 [Ruby](https://www.ruby-lang.org/)が大好きで、[P言語]((https://twitter.com/hotu_ta/status/670420676960874496))が大嫌いです。 - スライドに書くスペースがなかったので口頭で告白しますが、好きなエディタはRubyMineです - 自己紹介は時間の都合上、割愛させていただきます MEMO: 秒 --> --- ## I will write in Japanese <!-- - ということで、 - ここから日本語が分からない方は、Google翻訳を活用するなりしていただけると幸いです MEMO: 秒 --> --- ## 宣伝 - NEWS: 平成最後の重大事件が起こりました - 気になる方は、下記のリンクよりLTスライドをご確認ください - https://twitter.com/hotu_ta/status/1119128917548224513 <!-- - 自己紹介は割愛しましたが、その分宣伝をさせていただきます - 実は、平成最後の重大事件が起こりました - 気になる方は下記のリンクよりLTスライドをご確認ください MEMO: 秒 --> --- ## 目次 - 第1章 [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)とは？ - 第2章 [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を自動更新するアイデア - 第3章 [Selenium](https://github.com/SeleniumHQ/selenium)を使って、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新する - 第4章 [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新して長期運用していた事例 - 第5章 番外編: 〜やり過ぎには気をつけよう〜[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)関連事例物語 <!-- - それでは、これら5章をお送りします MEMO: 秒 --> --- **⚠注意: このスライドは、知的好奇心を満たすことを目的としています。** **hotutaはいかなる責任も負いません。** **このスライドは、サイト運営者に対して警告および対策としての機能も有します。** <!-- - なお、このスライドは、知的好奇心を満たすことを目的としており、hotutaはいかなる責任を負いません。 - また、このスライドは、サイト運営者に対して警告および対策をしていただくことも目的です。 MEMO: 秒 --> --- ## 第1章 [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)とは？ <!-- - まず、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)とは？ MEMO: 秒 --> --- ## [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)とは？ - 天下のGoogle先生が提供している、地図サービス - GUI(PCのマウス操作)、NUI(スマホタッチ操作)で好きなようにピンを立てられるなどなど - **CSVファイルなどの対応ファイルをアップロードすると、ピンを複数容易に立てられる** <!-- - Googleマイマップとは、天下のGoogle先生が提供する地図サービスです - Webから、またはスマホアプリから好きなようにピンを立てられるなどなどすることが出来るサービスです - CSVファイルなどをアップロードすると、ピンを複数容易に立てられる MEMO: 秒 --> --- ### [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)の特徴 - 無料 - 天下のGoogle先生が運用してくれる - なのに、完全無料 <!-- - [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)の最大の特徴は、 - 無料 - 天下のGoogle先生が運用してくれる - なのに、完全無料 - 無料嬉しいですよね！ MEMO: 秒 --> --- ## 第2章 [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を自動更新するアイデア <!-- - ということで、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新する手法をご紹介します MEMO: 秒 --> --- ##### [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新する方法(案) - 公式APIを用意してもらうよう要請する - やるだけ無駄っぽい😭 - 非公式APIを叩く - 自分は、API仕様の読解コストが高そう - テストフレームワークの[Selenium](https://github.com/SeleniumHQ/selenium)を使う - [Selenium](https://github.com/SeleniumHQ/selenium)ガチ勢の自分からすると、[Selenium](https://github.com/SeleniumHQ/selenium)を使ってやるのは朝飯前 - その他(金💰の弾丸次第) <!-- そもそも、なんで強引に操作しないとならないのかというと、天下のGoogle先生は大人の事情により、Googleマイマップに関する公式APIを用意していただけていません😭 ということで、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引にするには、これら4つの方法があるだろうと考えました。 MEMO: 秒 --> --- ## 第3章 [Selenium](https://github.com/SeleniumHQ/selenium)を使って、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新する <!-- - ということで、[Selenium](https://github.com/SeleniumHQ/selenium)を使って、Googleマイマップを強引に自動更新する技術を紹介します MEMO: 秒 --> --- ## [Selenium](https://github.com/SeleniumHQ/selenium)とは？ - 自分がスクレイピング用途で愛用している、ブラウザテスト自動化ツール - ちょろめ、狐などの主要ブラウザをコードベースで自動操作することが出来る - E2E(End-to-End)テストというもので愛用されていて、運用ツライ話をよく聞く - ちなみに、[Selenium](https://github.com/SeleniumHQ/selenium)を熟知しているだけで、飯が食っていける会社(テスト会社)が多数ある <!-- - [Selenium](https://github.com/SeleniumHQ/selenium)とは、自分がスクレイピング用途で愛用しているブラウザテスト自動化ツールです - ちょろめ、きつねといった主要ブラウザをコードベースで自動操作することができます - [Selenium](https://github.com/SeleniumHQ/selenium)は、E2E(End-to-End)テストというもので愛用されていて、よく運用ツライ話を聞きます - ちなみに、[Selenium](https://github.com/SeleniumHQ/selenium)を熟知しているだけで、飯が食っていける会社(テスト会社)が数多くあります MEMO: 秒 --> --- ## どうやって[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新するのか お知らせ: 下記を実践したサンプルOSS👉[赤チャリマップ(redcycle-map)](https://github.com/hotuta/redcycle-map) - Rails APIモードを使って、Capybaraというライブラリを入れる([Selenium](https://github.com/SeleniumHQ/selenium)を容易に扱うため) - モデルを新規作成して、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新処理をするコードを書く - rails cでモデルのメソッドを叩いて実行 <!-- - さて、どうやって[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新するのかです - hotutaが考えたベストプラクティスをご紹介します - まず、[Selenium](https://github.com/SeleniumHQ/selenium)を容易に扱うために、Rails APIモードを使って、[Capybara](https://github.com/teamcapybara/capybara)というライブラリを入れます - そして、モデルを新規作成して、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新処理をするコードを書きます - 最後に、rails cでモデルのメソッドを叩いて実行します - たったこれだけで、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新できます - といっても、サンプルがないと自動更新処理をするコードをどう書けばいいんだという話なので、後で自分が開発してOSSとなっているプロジェクトを紹介します - 適当にコードを読んで、自由と自己責任で実践してみてください MEMO: 秒 --> --- ## 第4章 [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新して長期運用した話 <!-- - こうして、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新することが出来るようになりました - 問題は、運用です。アプリでもなんでも、単純に作ればいいという話だけではなく、しっかり運用をしていく必要があります。 MEMO: 6分0秒 --> --- ### [Heroku](https://jp.heroku.com/)を使う - [Heroku](https://jp.heroku.com/)とは？ - PaaS(Platform as a Service)で有名なサービスで、アプリを簡単に公開することができる <!-- - そこで、運用のためにHerokuを使います - [Heroku](https://jp.heroku.com/)とは、Platform as a Serviceで有名なサービスで、アプリを簡単に公開することができるサービスです MEMO: 秒 --> --- #### [Heroku](https://jp.heroku.com/)について - [What are the best Platform as a Service providers that have a free plan?](https://www.slant.co/topics/3478/~best-platform-as-a-service-providers-that-have-a-free-plan) - 初心者でも2分でアプリを公開できて素晴らしい」など高評価👍多数 - 一方で、本番サービス運用で使うと利用料金が高い、日本サーバーが実質選べないレイテンシ問題といったデメリットあり - 問題点を十分理解した上で使いこなせば、**無料で満足するほど使える** - データベースPostgreSQLの1万レコード制限といった制約を理解して使いこなす価値あり <!-- - 海外のレビューサイトを見ると、「初心者でも2分でアプリを公開できて素晴らしい」など良い評価が数多くあります - 一方で、本番サービス運用でHerokuを使うと利用料金が高い、日本サーバーが実質選べないので、サイトの表示速度が低下してしまうレイテンシ問題といった問題があります - 問題点を十分理解した上で使いこなせば、無料で満足するほど使えます 以下、スペースの都合上、スライドよりカット - [**Heroku Scheduler**](https://devcenter.heroku.com/articles/scheduler)超絶便利 MEMO: 秒 --> --- #### 事例1: [UberEATS全店舗マップ](<https://redcycle.hatenablog.com/entry/2017/12/23/111116>) - 多数のUberEATS配達員から大絶賛をいただいているマップ - UberEATS全ての店舗の場所を把握することができて、計画を立てやすくなり、稼ぎやすくなる - 大人の事情により、OSSにする予定はありません🙇 - UberEATSの配達員に興味がある方、ものすごく良い情報があります - TwitterのリプライやDMからでも、お気軽にご相談ください！ <!-- - [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)と[Heroku](https://jp.heroku.com/)を活用して、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を強引に自動更新して長期運用した事例をご紹介します - 1つ目の事例は、[UberEATS全店舗マップ](<https://redcycle.hatenablog.com/entry/2017/12/23/111116>)になります - 多くのUberEATS配達員から大絶賛をいただいているマップで、 - このマップにより、UberEATS全ての店舗の場所を把握することができて、計画が立てやすくなり、稼ぎやすくなるといった大きな役割を担っています - 大変申し訳ございませんが、大人の事情により、OSSにする予定はありません🙇 - UberEATSの配達員に興味がある方、ものすごく良い情報があるので、お気軽にご相談ください！ MEMO: 秒 --> --- ### 長期運用して分かった問題点 - 少し前まで、毎時間更新処理をしてしまっていた - 表示回数が約5万回超えたところで更新処理が出来なくなるバグ(?) - 新規に[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を作って対処 - 定期的に、謎現象で更新処理に失敗する - 更新が止まるだけで、地図は閲覧できるのが良い👍が、更新が止まったことをユーザーは気づきにくい😭 <!-- - で、この[UberEATS全店舗マップ](<https://redcycle.hatenablog.com/entry/2017/12/23/111116>)を長期運用して分かった問題点です - 少し前まで、毎時間更新処理をしてしまっていたため、表示回数が約5万回超えたところで更新処理が出来なくなるバグに遭遇しました - 天下のGoogle先生のバグか仕様か何かで、仕方なく新規に[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)を作って対処しました - あと、定期的に謎現象でマップ情報更新に失敗します - でも、更新処理に失敗するだけで、地図は閲覧できる状況が続いて良いです - ただ、更新が止まったことをユーザーに気づかせるのが、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)上では難しいです MEMO: 秒 --> --- #### 第5章 番外編: 〜やり過ぎには気をつけよう〜[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)関連事例物語 <!-- - さて、番外編として、[Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)関連でhotutaがやり過ぎてしまったネタ事例をご紹介します MEMO: 秒 --> --- ### 事例2: [赤チャリマップ(redcycle-map)](https://github.com/hotuta/redcycle-map) - [赤チャリ](https://docomo-cycle.jp/minato/)と呼ばれているシェアサイクルのポート情報をまとめたマップ - 公式アプリのマップがものすごく使いにくいので、使いやすくしたもの - OSSです🤗 <!-- - 自分は[赤チャリマップ](https://github.com/hotuta/redcycle-map)というマップを制作しました - なぜ制作したかというと、本家のマップが非常につかいにくかったためです MEMO: 秒 --> --- ## 今思えば、やり過ぎた... - 当初、シェアサイクルのポート情報を取得するため、**10分に1回ログインしてスクレイピング** - アカウントが乗っ取られていませんか？とメールが届き、鬼電される - 何もかもスルーした上で、これはやり過ぎた、まずいと思ってスクレイピングを停止 <!-- - 当初、シェアサイクルのポート情報を取得するため、10分に1回ログインしてスクレイピングしていました - するとアカウントが乗っ取られていませんか？とメールが届いた上に何回か電話が掛かってきました - もちろんスルーした上で、これはやり過ぎて逮●されてもおかしくないことをしてしまったと思い、スクレイピングを辞めました MEMO: 秒 --> --- ### 圧倒的な技術力💪 - Androidアプリをキャプチャして、非公式APIを見つけて叩くように - その後のアップデートで、非公式APIのAPIキーが変更される - 単純にキャプチャしてもAPIキーが確認できない😭 - 圧倒的な技術力💪でAPIキーをハックして、力尽きる - 自分がやりたかったことを概ね実現してるサービスを発見し、プロジェクトは塩漬け <!-- - でも、やっぱり情報を抜き取ってマッピングしたいじゃないですか - なので、Androidアプリをキャプチャして、非公式APIを見つけて叩くようにしました - すると、叩きすぎたからか、その後のアップデートで、非公式APIのAPIキーが変更されました - 単純にキャプチャしてもAPIキーが確認できなくなってしまったため、圧倒的な技術力を行使してデコンパイルなどなどをして、APIキーをハックして燃え尽きました - その後、[自分がやりたかったことを概ね実現してるサービス](<https://mixway.ekispert.net/ports>)を発見し、プロジェクトは塩漬けとなりました MEMO: 秒 --> --- #### さいごに - [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)はいいぞ - 数個ピンを立てるなら便利 - 数千個ピンを立てる長期運用はツライ - [Selenium](https://github.com/SeleniumHQ/selenium)はいいぞ - GUIベースのWebサイトをスクレイピングする用途なら便利 - スクレイピング用途なら、おとなしくプログラミング言語Rubyを使うべし - 何事も、やり過ぎには気をつけよう！ - 運が悪いと逮●される😭 - スクレイピング逮●事例: [Librahack(岡崎市立中央図書館)事件](<https://ja.wikipedia.org/wiki/%E5%B2%A1%E5%B4%8E%E5%B8%82%E7%AB%8B%E4%B8%AD%E5%A4%AE%E5%9B%B3%E6%9B%B8%E9%A4%A8%E4%BA%8B%E4%BB%B6>) <!-- - さいごに - [Googleマイマップ](https://www.google.co.jp/intl/ja/maps/about/mymaps/)と[Selenium](https://github.com/SeleniumHQ/selenium)はいいぞ - 何事も、やり過ぎには気をつけよう MEMO: 秒 -->