メニュー

Rate this page:

Thanks for rating this page!

We are always striving to improve our documentation quality, and your feedback is valuable to us. How could this documentation serve you better?

Authy、C#およびASP.NET MVCを使用した二要素認証

Two-Factor Authentication (2FA) is an excellent addition to your web application to improve the security of your user data by requiring something your users have to be present for step-up transactions, log-ins, and other actions. Multi-factor authentication validates the identity of a user while logging into the app through their mobile device (or sometimes through other clients)

この ASP.NET MVC サンプルアプリケーションは、Authy を使用して二要素認証(2FA)を実証します。このサンプルアプリを自分で実行するには、コードをダウンロードし、GitHub の指示に従ってください

第 2 要素については、ユーザーが携帯電話を所有していることを以下のいずれかによって検証します。

  • モバイル Authy アプリへの OneTouch プッシュ通知をユーザーに送信する
  • モバイル Authy アプリを通じてユーザーにトークンを送信する
  • Sending them a one-time token in a text message sent via Twilio

See how VMware uses Twilio Two-Factor Authentication to secure their enterprise mobility management solution.

ここをクリックしてチュートリアルをはじめましょう!

Authy の設定

If you haven't already, now is the time to sign up for Authy with Twilio. Create your first application, naming it whatever you wish. After you create your application, your production API key will be visible on your Authy dashboard:

Authy ダッシュボード

Once we have an Authy API key, we store it in the Web.config file. We also need to register Authy as a 2FA provider in our IdentityConfig.

        
        
        
        
        Authy2FA/App_Start/IdentityConfig.cs

        Register Authy as 2FA provider

        Authy2FA/App_Start/IdentityConfig.cs

        Now Authy is part of our ApplicationUserManager as a two-factor authentication provider. Let's take a look at how we register a user with Authy.

        Register a user using Authy

        ユーザーをAuthyに登録する

        When a new user signs up for our website, we call this controller to handle storing our new user in the database as well as registering the user with Authy.

        All Authy needs to get a user set up for your application is the user email, phone number and country code. In order to do two-factor authentication, we need to make sure we ask for this information at sign up.

        ユーザーを Authy に登録すると、authy_id が返されます。これは、Authy でユーザーのアイデンティティを確認する方法となるため、非常に重要です。

              
              
              
              
              Authy2FA/Controllers/ManageController.cs

              ユーザーをAuthyに登録する

              Authy2FA/Controllers/ManageController.cs

              Having registered our user with Authy, we then can use Authy's OneTouch feature to log them in.

              See how to log a user in with Authy

              Authy OneTouchでログインする

              ユーザーがウェブサイトにログインしようとしたら、第 2 形式の識別をユーザーに求めます。まずは、OneTouch 検証を見てみましょう。

              OneTouch は以下のように機能します。

              • We attempt to send a OneTouch Approval Request to the user.
              • ユーザーがOneTouchを有効にしていれば、 success メッセージが返されます。
              • The user hits approve in their Authy app.
              • Authy makes a POST request to our app with an approved status.
              • ユーザーをログインさせます。
              OneTouchリクエストの送信方法

              OneTouchリクエストを送信する

              When our user logs in, we let them decide which two-factor authentication provider will be used. It can be either Authy One Touch or Authy Token. Authy OneTouch should be used when the user has a registered OneTouch device.

              Authy lets us pass details with our OneTouch request including a message, a logo, and any other details we want to send. We could easily send any number of details by appending details['some_detail']. You could imagine a scenario where we send a OneTouch request to approve a money transfer:

              var request = new NameValueCollection
              {
                { "message", "Request to Send Money to Jarod's vault" },
                { "details['Request From']", "Jarod" },
                { "details['Amount Request']", "1,000,000" },
                { "details['Currency']", "Galleons" }
              };
              
                    
                    
                    
                    
                    Authy2FA/Providers/AuthyOneTouchProvider.cs

                    Implement OneTouch Approval

                    Authy2FA/Providers/AuthyOneTouchProvider.cs

                    Once we send the request we need to update our user's AuthyStatus based on the response. But first we have to register a OneTouch callback endpoint.

                    コールバックエンドポイントの登録方法を確認する

                    Configure OneTouch Callback

                    OneTouch リクエストの送信後にユーザーが何を行ったのかをアプリで認識するためには、コールバックエンドポイントを Authy に登録する必要があります。

                    注:リクエストが Authy から来ていることを確認するために、Authy から来ているリクエストではないと思われる場合にそのリクエストを停止するヘルパーメソッドを記述しました。

                    Here in our callback, we look the user up using the authy_id sent with the Authy POST request. At this point we would ideally use a websocket to let our client know that we received a response from Authy, but for this version we're going to keep it simple and just update the AuthyStatus on the user. Then all our client-side code needs to do is check for user.AuthyStatus == "approved" before logging in the user.

                          
                          
                          
                          
                          Authy2FA/Controllers/AuthyController.cs

                          Configure OneTouch Callback to validate request

                          Authy2FA/Controllers/AuthyController.cs

                          Our application is now capable of using Authy for two-factor authentication. However, we are still missing an important part: the client-side code that will handle it.

                          Handle authentication in the browser

                          二要素をブラウザーで処理する

                          サーバーサイドで何が起こっているのかについてはすでに見てきましたので、次に JavaScript がそれらのサーバーエンドポイントとどのように連係しているのかを見てみましょう。

                          When we expect a OneTouch response, we will begin polling /Authy/OneTouchStatus until we either see that OneTouch login was either approved or denied. Let's take a look at this controller and see what is happening.

                                
                                
                                
                                
                                Authy2FA/Scripts/onetouch.js

                                Let's take a closer look at how we check the login status on the server.

                                Check the user's login status

                                ログインステータスをチェックする

                                This endpoint waits for the user status to be either approved or denied.

                                      
                                      
                                      
                                      
                                      Authy2FA/Controllers/AuthyController.cs

                                      ログインステータスをチェックする

                                      Authy2FA/Controllers/AuthyController.cs

                                      Finally, we can confirm the login.

                                      Confirm the login

                                      2FA ステップを完了する

                                      AuthyStatus が承認された場合、ユーザーはホームページにリダイレクトされます。それ以外の場合は、/Account/Login フォームを表示します。

                                            
                                            
                                            
                                            
                                            Authy2FA/Controllers/AccountController.cs

                                            That's it! We've just implemented two-factor authentication using three different methods and the latest in Authy technology. You can check out the whole project on Github.

                                            関連トピック

                                            次はどこでしょうか?

                                            Twilio を使う C# 開発者であれば、他のチュートリアルもお楽しみください。

                                            IVR: フォンツリー

                                            IVR(interactive voice response:自動音声応答)システムで、発信者を適切な担当者および情報に簡単にルーティングできます。 

                                            通話のトラッキング

                                            Twilio を使って、マーケティングキャンペーンの有効性を測定します。

                                            これは役に立ちましたか?

                                            Thanks for checking out this tutorial! If you have any feedback to share with us, we'd love to hear it. Connect with us on Twitter and let us know what you build!

                                            Kevin Whinnery Agustin Camino Andrew Baker Paul Kamp Kat King Hector Ortega
                                            Rate this page:

                                            ヘルプが必要ですか?

                                            We all do sometimes; code is hard. Get help now from our support team, or lean on the wisdom of the crowd browsing the Twilio tag on Stack Overflow.