Backlogのお知らせを通知するChrome拡張作った

はじめに

全国1億2623万人の布袋寅泰ファンの皆さん、こんにちは
@garnetddolphin です。
参画したプロジェクトでBacklogを使用する機会があり、お知らせがあったら通知するChrome拡張を作ったので公開します。

開発の経緯

backlogに登録すると、深夜に「本日のBacklogプロジェクトレポート」というメールが届きます。正直うっとうしい。メールの通知で起きたことも何度かありました。このメールから開放されたい、けど通知があったら気づきたい... API公開してるじゃん→作ろう！

実装

manifest.json とbackground.js、backlog-favicon_48.pngを作成し、同フォルダに入れておきます。
こちらを[chrome://extensions/]![backlog-favicon_48.png]
(chrome://extensions/)の「パッケージ化されていない拡張機能を読み込む」から読み込みます。

manifest.json

{
  "name": "Backlog Desktop notification",
  "version": "1.0.0",
  "manifest_version": 3,
  "description": "Backlog のお知らせを通知します",
  "permissions":[
    "alarms",
    "webRequest",
    "notifications"
  ],
  "host_permissions": [
    "*://*/*/*/"
  ],
  "background": {
    "service_worker": "background.js"
  },
  "icons": {
    "48": "backlog-favicon_48.png",
  }
}

background.js

function showNotification() {
  let url =
    "https://crewinc.backlog.com/api/v2/notifications/count?[アカウントのAPIキー]&alreadyRead=false";

  fetch(url, { method: "GET" })
    .then((response) => response.json())
    .then((data) => {
      if (data.count >= 1) {
        let options = {
          type: "basic",
          title: "Backlog 通知",
          message: "お知らせが" + data.count + "件あります！確認して！",
          iconUrl: "backlog-favicon_48.png",
        };
        chrome.notifications.create(options);
      }
    });
}

chrome.alarms.create("check_backlog_unReadNotification", {
  delayInMinutes: 0,
  periodInMinutes: 10,
});
chrome.alarms.onAlarm.addListener((alarm) => {
  if (alarm.name === "check_backlog_unReadNotification") {
    showNotification();
  }
});

backlog-favicon_48.png

まとめ

深夜のメールから開放されてハッピー！
10分に1度じゃなくてWebhookとかで即時実行したいよね