20
17

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

AWS マネジメントコンソールで大事な情報を隠す動的マスキング

Last updated at Posted at 2021-12-18

はじめに

AWS マネジメントコンソールには、ユーザー名や AWS Account ID やクレデンシャルなど、あまり他の方に見られたくない情報が表示されます。技術ブログに投稿するためのスクリーンショットやライブデモなどで、こういった情報を自動的にボカシ・モザイク・マスクを入れることが出来ます。

次のようなユースケースに便利です。

  • 技術ブログの執筆のために、手動で AWS Account ID を隠すのが面倒
  • デモで画面共有を見せるときに、見られたくない情報をかくしたい
  • 動画撮影したいけど、あとからマスク処理するのが面倒

次の URL で、ソラコムのテクノロジー・エバンジェリスト 松下さんが紹介されている方法を参考にしながら、AWS マネジメントコンソールでの動作を確認してみます。
https://blog.soracom.com/ja-jp/2021/08/12/dynamic-masking-webpage-using-css3/

どんな見た目になるのか

例えば、AWS のマネジメントコンソールでは、右上にログインに使った IAM User 名などが表示されます。この動的マスキング機能を使うことで、実際のブラウザ上で自動的にマスクされます。すごい。

image-20211218114913906.png

それでは手順を確認してみましょう。

Stylus をインストールする

Chrome に次の拡張機能をインストールします。Firefox でも動くらしい。

image-20211218113645387.png

AWS マネジメントコンソール用 css をインストールする

公開されている GitHub にアクセスします。
https://github.com/ma2shita/stylus-aws-management-console

Getting Started に書かれている、「stylus-aws-management-console.user.css」をクリックします。

image-20211218113841802.png

Stylus にこの css をインストールする画面に遷移するので、左側のインストールをおします。なお、内容が心配な方は右側に内容が表示されているので確認するとよいでしょう。

image-20211218113938947.png

CSS のコメントを見ると、いくつかのサービスに対応しているように見えます。

  • AWS IoT Core
  • AWS Lambda
  • Amazon CloudWatch Logs
  • Amazon SNS

GitHub で公開されているため、自分の必要なマスクを追加して Pull Request も投げられます。好きなようにカスタマイズしていくのがよいでしょう。

動作確認

これで設定完了です。インストールが非常に簡単でとてもよいですね!それでは、実際に AWS マネジメントコンソールにアクセスしてみると、右上のユーザー名がマスクされています!すごい。

image-20211218114913906.png

Lambda の ARN がマスキングされています

image-20211218122409931.png

まとめ

Stylus を使うことで、自動的に AWS のマネジメントコンソールでぼかしが表示されることを確認できました。対応しているサービスでは非常に便利に使っていくことができます。また、より使い方に合わせたぼかしが必要な場合は、簡単にカスタマイズができます。紹介ブログでカスタマイズ方法が記載されているので、次のURL を参考にカスタイマイズしていくのもよいとおもいます。

余談 : 独自 Repository

ソラコム松下さんが所有されている Repository に Pull Request をしておりますが、細かい部分で自分でカスタマイズをやり切りたい部分がでてきたので、Fork して独自追加をしています。こちらも参考にしていただけると良いと思います。

20
17
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
20
17

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?