BOOK☆WALKER読み放題用のChrome拡張機能作った

· 6 min read

こんにちは。

突然ですがみなさんBOOK☆WALKERの読み放題は利用されていますか？
私はマンガ・雑誌も文庫・ラノベもサービス開始当初から利用しているのですが、「連載お気に入り」機能に少々不満を持っていました。

サービスを利用している方は分かると思うのですが「連載お気に入り」について少し説明すると、雑誌に連載中のお話を「連載お気に入り」として登録しておくと最新号が配信された時に通知されたり、以下の画像のようにマイページに最近更新された連載の一覧を出してくれる機能です。

読み放題の前身であるマガジン☆WALKERも利用していたのですが、雑誌のお気に入り機能はあっても連載のお気に入り機能はなかったので、サービス提供開始時は便利になったと喜んでいました。

が、サービスを1年以上使っているとこの「連載お気に入り」機能への不満点も出てきました。

新連載に対応していない場合が多い

これが一番困りますね。月刊連載だと面白い新連載があったとしても、次の号（1ヶ月後）には存在を忘れていて気付くともう読み返せないことがたまにあります。
新連載時点でお気に入りに登録できれば一覧に出てくるのでいいのですが、数か月登録できない（下手すると数か月できない）状況の連載もあるので困りものです。

表記ゆれに対応してない

例えば以下の作品。

連載タイトルが「波原さんはぶちまけたい！」なのですが、配信日（発売日）が消えています。これは連載が終わったり、読み放題で読める分がなくなったりするとこういう表記になります。

でもこの連載タイトル、普通に今でも連載をやっているので読み放題でも読めます。なぜ、拾われないのでしょう。

以下の画像は「波原さんはぶちまけたい！」の連載雑誌、電撃だいおうじ最新号（VOL97）の目次です。

登録されている連載タイトルは「波原さんはぶちまけたい！」、現在の連載タイトルは「波原さんはぶちまけたい!」
「！」と「!」の違いです。全角半角です。

この小さな違いがあるだけで「連載お気に入り」機能は役目を果たさなくなってしまいます。

これに気付いた数か月前にサポートセンターにお問い合わせをしてみたのですが、現在手作業で更新しているらしく、こうした表記ゆれの対応も手作業になるそうです。

出版社も統一してくれよ……というお気持ち。

一覧表示の上限

毎月27日は何の日でしょう？

答えは「電撃マオウ」「電撃大王」「電撃だいおうじ」「コミックキューン」「コミックアライブ」の発売日です！

多すぎるんだよ。この日だけで連載お気に入りが40件以上更新されます。

でもマイページの連載お気に入り一覧は32件の表示が限界のようです……。
数日前には「少年エース」だったり「月刊アクション」だったりの更新も入ります。
マイページだけじゃ管理できないのが現状です。

ここまでくると、読み落としがあっても無理はないでしょう。

Chrome拡張機能でなんとかできないか？

この現状をなんとかしたい。しかしBOOK☆WALKER側にお願いしてもすぐに対応できるはずもなく。

卒業研究でChrome拡張機能を作成したのを思い出し、これなら自作の連載管理機能を実装できるのはと思い試してみることに。
そして完成したのがこちら。 ChromeとEdge(chromium版)で使えます。 非公式の拡張機能です。導入する場合は自己判断でお願いします。

Indexed Database APIの利用

拡張機能を思いついた当初はローカルストレージに連載タイトルを保存しておけば機能の実装が可能だろうと思っていたのですが、どうやらIndexed Database APIというブラウザ標準のデータベースがあるようです。こちらはRDBMSライクに使えるDBシステムで、意外と簡単にデータの管理ができました。

データベースはご利用しているPC内のみに保存されます。他人からのぞかれる心配は恐らくありませんが、自身で所持しているPC間でも共有ができません。

画像みたいにシリーズと連載タイトルをKey pathにしてそれぞれお気に入り連載を管理するようにできました。

JSの非同期処理に苦しんだ

データベースの検索だったり、DOM操作だったり、こいつら全部非同期処理で上から順番に実行される保証がない。

普段Pythonを使っているので、コールバックを使った（でもはコールバックは古い書き方らしい）同期的な書き方をするのに苦労しました。
そのうちasync/awaitに書き換えたいと思う。

CSS完全に理解した

★と既読・未読マークの設置にどれだけの時間をかけたのでしょう。

最低限の機能の実装が完了

現在実装できた機能は以下の2つです。

見た目はこんな感じで目次を開くと★マークが現れ、押すとお気に入り連載として登録され未読・既読マークが表示されるようになります。
※雑誌を開いたときに雑誌ページにアクセスしてシリーズ名を取得する関係上、開いてすぐ目次を開くとうまく機能しない場合があります。

とりあえず新連載を読んだその場でお気に入り登録ができるので、次の号読み忘れるということもなくなるはずです。

また表記ゆれの対策として、全角英数字記号はすべて半角に変換してデータベースへ保存。参照時も半角に変換して参照するので、ある程度の表記ゆれには対応できます。

なお、一度拡張機能をアンインストールするとデータベースも削除されてしまいます。

今後実装したい機能

まずは読み忘れ通知機能を実装したい。

読み放題雑誌の期限は取得できるので、データベースでうまく管理して期限間際になったら通知できるような仕組みを考えています。
ポップアップで読んでいない連載の確認機能なども実現したいのですが、休載をどうやってデータベースで扱うか考えているところです。

現状ポップアップは機能していないのでどうにかしたい。

ついでに読み放題とは関係ありませんが、BOOK☆WALKERで買った本を読書メーターに1冊ずつ登録する作業がとてもめんどくさいので、ワンクリックで自動で登録してくれる機能もありかもしれないと思っているところです。

おわりに

高校生の頃から愛用しているBOOK☆WALKERですが、まだまだ改善してほしいところがたくさんあります。

「お気に入り連載」機能についてはChrome拡張機能で手元のブラウザ環境をいじることで、改良版の機能作成が可能だったのでJSの勉強がてら作成してみました。
いつか公式から機能の改善が行われると思うので、それまでは自己満足の範囲内で機能を追加していこうかなと思っています。

また機能の更新をしたら適当に紹介したいと思います。