0

Ich habe ein Problem mit get token, wenn ich mich mit Azure Active Directory unter Verwendung von msal.js anmelde.Token kann nicht abgerufen werden, wenn ich mich mit Azure Active Directory unter Verwendung von msal.js anmelde

Vielleicht beschreibe ich Sie, wie die App in verschiedenen Situationen funktioniert.

I. Automatische Anmeldung mit Active Directory-Authentifizierung ist deaktiviert. Callback für Application Registration Portal ist auf Homepage der App festgelegt. Ich habe den Code aus https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/devApps/VanillaJSTestApp/index_LoginPopup.html

  1. die App eingeben unbefugt
  2. Klicken Sie auf die Schaltfläche, die loginPopup läuft, nach dem Einloggen in-Token.

Alles funktioniert, aber ich möchte Genehmigung mit Active Directory-Authentifizierung

II. Automatische Anmeldung mit Active Directory-Authentifizierung ist aktiviert. Der Rückruf im Application Registration Portal ist auf "***. Auth/login/aad/callback" eingestellt. Ich habe den Code aus https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/devApps/VanillaJSTestApp/index_LoginPopup.html

  1. die App mit der Berechtigung eingeben und melden Sie sich mit Active Directory-Authentifizierung
  2. acquireTokenSilent Fehler sendet wie „user_login_error: Benutzeranmeldung ist erforderlich“.
  3. Klicken Sie auf die Schaltfläche, die loginPopup läuft, nach der Anmeldung ich Fehler wie „die Antwortadressen Die Antwortadresse **** nicht überein für die Anwendung konfiguriert ist“ get

UPDATE: Nach dem Satz userAgentApplication. redirectUri = '**** /. auth/login/BVD/Rückruf' und laufen loginPopup, Token wird geliefert, aber es ist immer noch doppelt log in.

Zusammengefasst nach der Anmeldung mit Azure ich Fehler von acquireTokenSilent " user_login_error: Benutzeranmeldung ist erforderlich ".

III. Ich möchte die App verhalten, wie folgt:

  1. Geben Sie die App mit Genehmigung und melden Sie sich mit Active Directory-Authentifizierung

Token Get Kann ich es so?

+0

„Die Antwortadresse **** nicht die Antwortadressen für die Anwendung konfigurieren überein“. Dieser Fehler bedeutet, dass ein Problem mit Ihrer App-Konfiguration vorliegt. Stellen Sie sicher, dass Ihre Antwort-URL korrekt ist. Können Sie die Details in Ihrer App-Konfiguration und den genauen Fehler teilen, den Sie erhalten? –

+0

Dieser Fehler wird angezeigt, weil die Antwort-URL auf Azure Active Directory ("/.auth/login/aad/callback") gesetzt ist, die ich zur Autorisierung verwenden möchte. Wenn die Antwort-URL auf die App für die Startseite eingestellt ist, funktioniert loginPopup, aber ich möchte es nicht. Ich möchte Token nach der Anmeldung mit Active Directory-Authentifizierung. – tmszyman

+0

Sie müssen sicherstellen, dass die Antwort-URL, die Sie bearbeiten möchten, ** auch ** in der Anwendungsregistrierung korrekt eingestellt ist. Es sieht so aus, als ob Ihre Startseite bei der App-Registrierung eingerichtet wurde, nicht aber Ihr "Rückruf" -Endpunkt. –

Antwort

0

Sie mischten die Easy Auth und die Website manuell mit MSAL zu schützen.

Wenn Sie die Popup-Seite für die automatische Anmeldung mit dem Azure Active Directory-Popup verwenden möchten, können Sie die Quelle ändern, um die Funktion loginPopup() beim vollständigen Laden des Dokuments hinzuzufügen.Hier ist ein Codebeispiel für Ihre Referenz:

<html> 
<head> 
    <title>authentication with Msal.js app</title> 
    <style> 
     .hidden { 
      visibility: hidden 
     } 

     .visible { 
      visibility: visible 
     } 
    </style> 
</head> 
<body> 
    <!-- bluebird only needed if this page needs to run on Internet Explorer --> 
    <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://code.jquery.com/jquery-3.2.1.min.js" class="pre"></script> 

    <h1>Sending an email with msal.js and Microsoft Graph</h1> 
    <div> 
     <div id="label">Sign-in with Microsoft</div> 
     <button id="auth" onclick="loginPopup();">Login (with Popup)</button> 
    </div> 
    <div id="sendEmail" class="hidden"> 
     <input id="emailToSendTo" type="text" /> 
     <button id="auth" onclick="sendEmail();">Send email</button> 
    </div> 

    <pre class="response"></pre> 

    <script class="pre"> 
     var applicationConfig = { 
      clientID: '1e6af2ed-686c-4914-96ed-0cd7b1673cbb', 
      graphEndpoint: "https://graph.microsoft.com/v1.0/me/sendMail", 
      graphScopes: ["user.read", "mail.send"] 
     }; 
    </script> 

    <script> 
     var userAgentApplication = new Msal.UserAgentApplication(applicationConfig.clientID, applicationConfig.authority, authCallback); 
     function authCallback(errorDesc, token, error, tokenType) { 
      //This function is called after loginRedirect. msal object is bound to the window object after the constructor is called. 
      if (token) { 
      } 
      else { 
       log(error + ":" + errorDesc); 
      } 
     } 

     function loginPopup() { 
      userAgentApplication.loginPopup(applicationConfig.graphScopes).then(function (idToken) { 
       //Login Success 
       userAgentApplication.acquireTokenSilent(applicationConfig.graphScopes).then(function (accessToken) { 
        //AcquireToken Success 
        updateUI(); 
       }, function (error) { 
        //AcquireToken Failure, send an interactive request. 
        userAgentApplication.acquireTokenPopup(applicationConfig.graphScopes).then(function (accessToken) { 
         updateUI(); 
        }, function (error) { 
         console.log(error); 
        }); 
       }) 
      }, function (error) { 
       console.log(error); 
      }); 

     } 

     function updateUI() { 
      var authButton = document.getElementById('auth'); 
      authButton.innerHTML = 'logout'; 
      authButton.setAttribute('onclick', 'logout();'); 
      var label = document.getElementById('label'); 
      label.innerText = "Hello " + userAgentApplication.getUser().name + "! Please send an email with Microsoft Graph"; 

      // Show the email address part 
      var sendEmailSpan = document.getElementById('sendEmail'); 
      sendEmailSpan.className = "visible"; 
      var emailAddress = document.getElementById('emailToSendTo'); 
      emailAddress.value = userAgentApplication.getUser().displayableId; 
     } 

     function logout() { 
      // Removes all sessions, need to call AAD endpoint to do full logout 
      userAgentApplication.logout(); 
     } 

     function sendEmail() { 
      userAgentApplication.acquireTokenSilent(applicationConfig.graphScopes) 
       .then(function (token, error) { 
        $.ajax({ 
         type: "POST", 
         contentType: "application/json", 
         dataType: 'json', 
         beforeSend: function (request) { 
          request.setRequestHeader('Authorization', 'bearer ' + token); 
         }, 
         url: applicationConfig.graphEndpoint, 
         data: JSON.stringify({ 'message': getEmail(), 'saveToSentItems': true }), 
         processData: false, 
         success: function (msg) { 
          log('Mail sucessfully sent.'); 
         }, 
         statusCode: { 
          200: function() { 
           log('Mail sucessfully sent.'); 
          }, 
          202: function() { 
           log('Mail sucessfully sent.'); 
          } 

         } 
        }); 
       }); 
     } 

     function log(s) { 
      document.body.querySelector('.response').appendChild(document.createTextNode("\n\n" + JSON.stringify(s, true, 2))); 
     } 

     function getEmail() { 
      var email = { 
       Subject: 'Welcome to Microsoft Graph development with Msal and the Microsoft Graph sample', 
       Body: { 
        ContentType: 'HTML', 
        Content: getEmailContent() 
       }, 
       ToRecipients: [ 
        { 
         EmailAddress: { 
          Address: userAgentApplication.getUser().displayableId 
         } 
        } 
       ] 
      }; 
      return email; 
     } 

     // Get the HTMl for the email to send. 
     function getEmailContent() { 
      return "<html><head> <meta http-equiv=\'Content-Type\' content=\'text/html; charset=us-ascii\'> <title></title> </head><body style=\'font-family:calibri\'> <p>Congratulations " + userAgentApplication.getUser().name + ",</p> <p>This is a message from the Microsoft Graph Connect sample. You are well on your way to incorporating Microsoft Graph endpoints in your apps. </p> <h3>What&#8217;s next?</h3><ul><li>Check out <a href='https://graph.microsoft.io' target='_blank'>graph.microsoft.io</a> to start building Microsoft Graph apps today with all the latest tools, templates, and guidance to get started quickly.</li><li>Use the <a href='https://graph.microsoft.io/graph-explorer' target='_blank'>Graph explorer</a> to explore the rest of the APIs and start your testing.</li><li>Browse other <a href='https://github.com/microsoftgraph/' target='_blank'>samples on GitHub</a> to see more of the APIs in action.</li></ul> <h3>Give us feedback</h3> <ul><li>If you have any trouble running this sample, please <a href='https://github.com/microsoftgraph/angular-connect-rest-sample/issues' target='_blank'>log an issue</a>.</li><li>For general questions about the Microsoft Graph API, post to <a href='https://stackoverflow.com/questions/tagged/microsoftgraph?sort=newest' target='blank'>Stack Overflow</a>. Make sure that your questions or comments are tagged with [microsoftgraph].</li></ul><p>Thanks and happy coding!<br>Your Microsoft Graph samples development team</p> <div style=\'text-align:center; font-family:calibri\'> <table style=\'width:100%; font-family:calibri\'> <tbody> <tr> <td><a href=\'https://github.com/microsoftgraph/angular-connect-rest-sample\'>See on GitHub</a> </td> <td><a href=\'https://officespdev.uservoice.com/\'>Suggest on UserVoice</a> </td> <td><a href=\'https://twitter.com/share?text=I%20just%20started%20developing%20%23Angular%20apps%20using%20the%20%23MicrosoftGraph%20Connect%20sample!%20&url=https://github.com/microsoftgraph/angular-connect-rest-sample\'>Share on Twitter</a> </td> </tr> </tbody> </table> </div> </body> </html>"; 
     }; 


     $(document).ready(function() { 
      loginPopup(); 
     }); 
    </script> 
</body> 
</html> 
Verwandte Themen