この記事は635文字で約2分で読めます
Table of Contents
ペーパーレス時代に
これからの時代はペーパーレスです。名刺もきっとペーパーレスにするべきだと思います。(唐突)
直近オフライン系のイベントに参加する機会が多く、紙の名刺を供給するのが面倒なので電子名刺っぽいものを作ってみることにしました。
こんな感じ
こんな感じの構成にしてみました。
まず、デジタル名刺ページはAstroを使って作成をしております。ペライチのHTMLをビルドする形になります。
その後、pagecryptを使って、HTMLを暗号化します。
SubtleCrypto JavaScript APIをどうやら使っているらしく、AES256で暗号化されます。
pagecryptは大変優秀で、
- そのままHTMLにアクセスするとパスワードの入力フォームが表示され、正しいパスワードを入力することでアクセス。
- URLのアンカーに
https://example.com/#password
など、パスワードを設定することでパスワード画面を経由せずアクセス
ができます。
(ただし、後者のアクセスはGETリクエストのURLを中間経路でダッシュされる可能性があるので、機微情報を扱う際はおすすめしません。)
NFCタグにはパスワード付きURLを仕込んでおくことで、実質NFCタグ経由じゃないと名刺サイトにアクセスできなくする、という対応が可能となります。
ホスティングの基盤はrenderを使ってます。
デモ
この用にNFCタグにスマートフォンをかざすだけで、デジタル名刺サイトにアクセスができました!
Related Posts
2019-10-23JavaScript TypeScript Google Apps Script API FLASH SlackAPI Clasp GitHub Action Jest 自動テスト Unit Test
Google Apps Script(GAS)とAPI FLASHとSlackAPIをClaspとJestとGitHub Actionで調理して定期的にWebページのスクリーンショットを撮る