Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Word Press Voice Over Authentication

5af8e5bd2f24e4ea0cee732c6cc259b3?s=47 haruharuharuby
September 03, 2017

Word Press Voice Over Authentication

2 factor authentication.
You can use authentication by your voice

5af8e5bd2f24e4ea0cee732c6cc259b3?s=128

haruharuharuby

September 03, 2017
Tweet

Transcript

  1. WordPress Voice Over Auth For 09/03 Word Bench Osaka/Kyoto/Nagano TiNm’S

  2. Tomoharu Ito 税法上 今年は    の フリーランス コミュニティ    を運営 発起人 在住 プログラマー

    (2017年 7月〜 だれやねん。
  3. こんなログイン画面を作ります。

  4. Voice Over Auth User ①、⑥ ②、⑦ ④ ⑤ ⑧ ③

  5. ザクッと概要 1. ユーザーがログイン画面を表示 2. ログイン画面表示時に、ワンタイムパスワードの生成をリクエスト 3. パスワードをpush通知 4. ユーザーはAmazon Echoにパスワードを言う

    5. ユーザーが発話したパスワードを認証 6. ユーザーはユーザーとパスワードを入力してログイン 7. 認証が通過しているかをチェック 8. 通常のWP認証と⑥の認証が通過してれば、ログインを許可
  6. 材料 ユーザーがログインした ときに、 ワンタイムパスワードの 発行を リクエストするプラグイ ンが必要。

  7. 材料 パスワードの発行、失効、 認証を行うバックエンドが 必要。 今回はAWSを利用し、 サーバーレスで構築。

  8. 材料 ユーザーからの発話を 受け付けるAlexa Skill が必要。

  9. TiNm’S WordPress プラグイン

  10. ベースとなるWordPress

  11. Wp voice authentication plugin ログイン画面のカスタマイズ 認証処理をフック

  12. Wp Voice Authentication Plugin 40行くらい。

  13. API をたたくためのAPI wp_remote_get wp_safe_remote_post wp_remote_post wp_remote_request などなど。。

  14. TiNm’S 認証API

  15. 認証API https://voa.tinms.net/code

  16. 認証API リソースパス HTTP メソッド 機能 /code GET 認証されてるいか確認 PUT ワンタイムパスワードの生成

    PATCH 認証処理 DELTE ワンタイムパスワードの破棄
  17. 認証API できるだけ少ないリソースで、多くの処理をまかな えるように考える。

  18. バックエンドはAWS でサーバーレスに構築 API Gateway

  19. バックエンドはAWS でサーバーレスに構築 130行くらい

  20. バックエンドはAWS でサーバーレスに構築 パスワードの発行はダイナモで管理

  21. Alexa Skill User: Alexa, ask wp authentication Alexa: Hi! Please

    your authentication code User: 1234 Alexa: OK! You can log in your WordPress.
  22. Alexa Skill 140行くらい

  23. Alexa Skill Developer.amazon.com のGUI でひたすら設定

  24. DEMO ムービー

  25. ありがとうございました。 TiNm’S TiNm’S ito@tinms.net