Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

SlackDeckの通知多重で鳴っちゃう問題で詰んだ話 #31

Open
yamamoto-yuta opened this issue Dec 3, 2023 · 0 comments
Open

SlackDeckの通知多重で鳴っちゃう問題で詰んだ話 #31

yamamoto-yuta opened this issue Dec 3, 2023 · 0 comments
Labels
article publish

Comments

@yamamoto-yuta
Copy link
Owner 

# 必要に合わせてコメントアウトを外して記載してください

# 記事の説明文(無い場合は本文先頭200文字を使用)
#ogp_description:

# サムネイル画像のテーマ -> 'default' or 'upload'
thumbnail_theme: default

# サムネイル画像の背景画像(1280x670px推奨, なくてもOK)
#thumbnail_image_url: 

# 予約投稿の日時(無い場合は現在時刻を使用)
#posted_at: YYYY-MM-DD hh:mm

※ この記事は、私が2022/12/20に書いたメモを転記したものです。

３行で

  • SlackDeck は複数の <iframe> に Web 版 Slack を表示するため，通知が来ると多重で音が鳴ってしまう
  • この問題を解決するために色々調べてみたところ， Slack の通知は Notification API を用いて行われていることが分かった
  • しかし， <iframe> の通知許可はメインフレームの通知許可から行うべきであることも分かり，多重で音が鳴っている挙動が適切な挙動ということになってしまった

SlackDeck とは？

Slack のチャンネルを横に並べられる Chrome 拡張機能

image.png (191.4 kB)

https://chrome.google.com/webstore/detail/slackdeck/cocnkjpcbmoopfpmogblnjpjdfcaohod

何が問題だったか？

SlackDeck は，メインの Slack を表示する <body> とカラムとして Slack を表示する <iframe> で構成されている．図にすると次の通り:

image

この状態で Slack に通知が来ると， <body> と全ての <iframe> で通知音が鳴ってしまい，多重で通知音が鳴ってしまう．

これが原因で SlackDeck を Chrome から削除してしまうユーザもいたため，今回，修正を試みた次第．

調べて分かったこと

  • Slack では通知の送信に Notification API を利用している

ウェブ通知の最も顕著な用途の一つが、ウェブベースのメールや IRC アプリケーションにおいて、新しいメッセージを受信したときに、ユーザーがほかのアプリケーションで何かをしていても通知をする必要がある場合です。これには数多くの事例が存在し、例えば Slack などがあります。
引用: 通知 API の使用 - Web API | MDN

  • <iframe> から通知許可を求めるメソッド Notification.requestPermission() は Chrome から非推奨と言われている

Remove the ability to call Notification.requestPermission() from non-main frames.
This change will align the requirements for notification permission with that of push notifications, easing friction for developers. It allows us to unify notification and push permissions.
引用: Remove Usage of Notifications from iFrames - Chrome Platform Status

  • この非推奨宣言に対応した事例を見てみると，代わりにトップレベルのフレームから許可を要求するか新しいウィンドウで開くのが良いらしい

参考: Notification.requestPermission from iframe deprecated · Issue #17 · amazon-connect/amazon-connect-streams

以上より， <body> で表示している Slack の通知を許可したならば <iframe> で表示している Slack も許可されているのが適切．つまり，多重で通知音が鳴っている挙動が適切となる．

どうする？

どうしよう…
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
article publish
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@yamamoto-yuta