1. ホーム
  2. 質問と答え
  3. C＃Web APIを使用したMicrosoft Azure認証

C＃Web APIを使用したMicrosoft Azure認証

2017-08-26 20 views
2

私はAzure、C＃およびWeb APIを初めて使用しています。まず、愚かな質問のように聞こえるかもしれないので、事前にお詫びしたいと思います。C＃Web APIを使用したMicrosoft Azure認証

C＃Web APIとフロントエンドWebアプリケーションをローカルに開発している間に、すでにAzureの認証を使用している可能性がありますか？誰かのMicrosoftアカウントを使って認証するのと同じですか？

ありがとうございます！

EDIT

は、だから私はすでにこのリンクに基づいてアプリを設定している： ユーザーは、それがMicrosoftのログインページにリダイレクトされる認証されていない私のフロントエンドのWebアプリケーションでhttps://docs.microsoft.com/en-us/azure/app-service-mobile/app-service-mobile-how-to-configure-microsoft-authentication

、私がログインしようとしたとき、私は以下のエラーが表示されます。

enter image description here

A私はまだAzureに何も配備していないことに注意してください。私のコードはまだローカルです。今は認証が必要です。

誰かが私を助けてくれることを願っています。

おかげ

UPDATE

だから私は角にmsalを統合することを可能にした誰かが作成したmsalxライブラリを使用してMSALを実装することができました。自分の個人的なMicrosoftアカウントを使用してログインした後、すでにアクセストークンを取得できますが、問題はWeb APIにアクセスすると、常に401 Unauthorizedと表示されることです。

ありがとうございます！私の理解に基づいて

enter image description here

出典

2017-08-26 Jed

答えて

1

私の知る限りでは、App Service Authentication/Authorization使用のために、あなたのC＃のWeb APIは、紺碧に展開する必要があります。 App Service Authentication/Authorization（Easy Auth）は、Azure App Serviceの機能で、紺色のアプリケーションと同じサンドボックスで動作するネイティブIISモジュールとして実装されています。詳細は、Architecture of Azure App Service Authentication/Authorizationを参照してください。あなたのシナリオに基づいて

、次のアプローチを参照してください可能性：

使用アプリケーションサービスの認証/承認（簡単認証）

  • ​​

  • アクセスhttps://{your-appname}.azurewebsites.net/.auth/login/microsoftaccountを介して、ブラウザを使用して、Web APIを正常にセットアップし、Microsoftアカウントで認証されたユーザーのみがyにアクセスできるようにしますフロントエンドWeb Appの当社Web API

  • 、あなたは、あなたがあなたのWeb APIにアクセスするためのトークンとして値authenticationTokenでx-zumo-authリクエストヘッダを設定することができ、ログにJavaScript client library for Azure Mobile Appsを活用し、authenticationTokenとuserIdを取得することができ次のようにユーザーを認証する方法の詳細については

    enter image description here

    を、あなたはHow to: Authenticate usersを参照することができます。

    注：お近くのSPAについては、あなたはCORS設定を構成して、紺碧のウェブアプリの「SETTINGS>認証/承認」の下許可される外部へのリダイレクトのURLを追加する必要があります。詳細については、issueを参照してください。あなたはAD v2.0のエンドポイントであなたは人MSAの両方であなたのウェブAPIを保護することができ、あなたのOAuth 2.0のベアラ認証を設定することができ

    • あなたのウェブAPIで認証を設定

    職場または学校のアカウント。 Web APIを構築する方法については、Secure an MVC web APIを参照してください。

  • フロントエンドWebアプリケーションの場合は、MSAL.jsライブラリを利用してログを記録し、access_tokenを取得して、Web API HTTP bearer requestを呼び出すためのトークンを使用できます。 UPDATE

    •

次のように

は私がAppModelv2-WebAPI-DotNetからTodoListServiceプロジェクトを使用し、その後、私のクライアントのために次のHTMLを使用します。

<!DOCTYPE html> 
<html> 
<head> 
    <title>Login</title> 
    <meta charset="utf-8" /> 

    <!-- IE support: add promises polyfill before msal.js --> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.4/bluebird.min.js" class="pre"></script> 
    <script src="https://secure.aadcdn.microsoftonline-p.com/lib/0.1.1/js/msal.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
</head> 
<body> 
    <script class="pre"> 
    var userAgentApplication = new Msal.UserAgentApplication("b3dd78af-d9da-459d-bf01-f87104d87450", null, function (errorDes, token, error, tokenType) { 
     // this callback is called after loginRedirect OR acquireTokenRedirect (not used for loginPopup/aquireTokenPopup) 
    }); 

    userAgentApplication.loginPopup(["user.read"]).then(function (token) { 
     var user = userAgentApplication.getUser(); 
     console.log(user); 
     console.log('access token:' + token); 

     InvokeApi(token); 

    }, function (error) { 
     alert('login error:' + error); 
    }); 

    function InvokeApi(token) { 
     $.ajax({ 
      type: "GET", 
      url: "http://localhost:9184/api/values", 
      headers: { 
       'Authorization': 'Bearer ' + token, 
      }, 
     }).done(function (data) { 
      console.log('invoked Web API \'http://localhost:9184/api/values\' with result: ' + data); 
      alert(data); 
     }).fail(function (jqXHR, textStatus) { 
      alert('Error getting data'); 
     }); 
    } 
    </script> 
</body> 
</html>

結果：

enter image description here

さらに、このgitサンプルJavaScript Single Page Application with an ASP.NET backend, using msal.jsを参照できます。

出典

2017-08-28 05:51:27

+0

私のAPIまたはアプリが既にそこに配備されている場合、本質的に私はAzureの認証のみを使用できますか？ Azureにデプロイせずに自分のMicrosoftアカウントを使ってユーザーを認証できる方法はありますか？ – Jed

+1

組み込みのEasy Auth機能の場合は、Azureでしか使用できませんでした。あなたの要件に基づいて、オプション2を利用することができます。その後、WebアプリケーションをAzureにデプロイせずに実行できます。上記のチュートリアルに沿ってWeb APIを構築し、MSAとの認証にMSAL.jsを使用して、トークンを使用してWeb APIにアクセスすることができます。 –

+0

これは、後でそこに配備されるWebアプリケーションを開発するときにAzureにサブスクリプションを取得する必要はないということですか？ Btw、私の要件を明確にしたあなたの答えに感謝します。私は2番目の選択肢に行くつもりです。 – Jed

2

、あなたはそれらのMicrosoftアカウントを持つユーザーを認証しようとしています。

ここでは、Microsoftのアカウントに基づいて認証を使用するようにWebアプリケーションを設定して有効にする方法に関する有用なガイドです。

https://docs.microsoft.com/en-us/azure/app-service-mobile/app-service-mobile-how-to-configure-microsoft-authentication

ほかに、それはあなたが設定し、ローカルアプリを設定した後、それをローカルにテストすることができますはいです。

ここには、Microsoftアカウント認証を使用するGitHubレポのサンプルWebアプリケーションがあります。

https://github.com/lexdevel/MicrosoftAccountAuthentication

出典

2017-08-27 04:40:36 juvchan

+0

こんにちは、私の質問を編集していただきありがとうございます。参照してください。ありがとう – Jed

関連する問題

 関連する問題