ADAL.js認可トークンを使用したSPAリクエスト

Question

AzureADに基づくアプリケーションを作成しようとしています。私は機能しているバックエンドを持っている、私はまた、ヘッダーにアクセストークンを渡すことによってアプリケーションに接続できる1つの機能的なクライアントサービスがあります。しかし

、私はこのコードを認可するADAL.jsを使用しよう：

$.ajax({ 
     url: '/api/folder', 
     type: 'POST', 
     headers: { 'Authorization': 'Bearer ' + getAuthHeaders(), }, 
     xhr: function() { 
      myXhr = $.ajaxSettings.xhr(); 
      if (myXhr.upload) { 
       myXhr.upload.addEventListener('progress', progressBar, false); 
      } 
      return myXhr; 
     }, 
     success: completeHandler = function (data) { 
      alert('Success!'); 
      modal.remove(); 
      updateFileBrowsers(folderName); 
     }, 
     error: errorHandler = function (jqXHR, textStatus, errorThrown) { 
      alert('Fail! :('); 
     }, 
     data: formData, 
     cache: false, 
     contentType: false, 
     processData: false 
    }, 'json'); 

私は、サーバーからの応答401を得ます。コントローラは非常にシンプルで、APIアクセスポイント上にコントローラ全体の[Authorize]表記があります。

私はトークンが空ではないことを確認しました。そうではありません。私はAzureアプリケーションにAppを追加しました。ログインして、ヘッダを設定し、クライアントのバックグラウンドアプリケーションで使用されているコントローラを使用するときに正常に接続を生成し、それを行うのとまったく同じ方法：

httpClient.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer", result.AccessToken); 

私が見ることができる唯一の違いは、1つのADALを使用していることです.jsと1つは.NETネイティブクラスを使用してリクエストヘッダーを設定します。

明確化：httpClientは魅力的に機能します。 SPAソリューションは動作しません。

Answer 1

401エラーに基づいて、使用していたトークンがあなたのサービスに対して認証できないようです。

考えられる原因の1つは、誤ったトークンをリソースに使用していた可能性が考えられます。 hereからトークンを解析して、audのトークンに含まれるクレームが、のウェブAPI用に設定したオーディエンスと一致するかどうかを確認できます。

このエラーのもう1つの理由は、期限切れのトークンを使用していた場合です。

クライアントのバックグラウンドアプリケーションで動作していたトークンを使用して、問題が修正されたかどうかを確認することをお勧めします。