Как настроить MSAL для поддержки AAD, Angular 7+, Azure Funcs - PullRequest
Новая
       51

Как настроить MSAL для поддержки AAD, Angular 7+, Azure Funcs

0 голосов
/ 28 февраля 2019

Я хотел бы понять, как настроить MSAL и связанные с ней артефакты, чтобы упростить следующую настройку.

  • Веб-сайт / приложение Frontend Angular 7+ опубликовано в учетной записи хранилища Azure и используется в качестве статического веб-сайта.
  • Базовый проект API-функций Azure для выполнения операций CRUD с базой данных Cosmos-DB
  • И внешний интерфейс веб-сайта Angular, и внутренний интерфейс API-функций Azure должны быть доступны только для пользователей в нашей Azure Active Directory.

Я попытался узнать, как настроить MSAL для моего предполагаемого варианта использования, изучив этот демонстрационный проект: https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/README.md. К сожалению, этот проект ссылается на серверный сайт API, который больше не работает.И биты бэкэнда не включены в репозиторий.

Демонстрационный проект msal-microsoft-authentication-library-for-js\lib\msal-angular\samples\MSALAngularDemoApp не работает как опубликованный.Попытки входа не удаются.Однажды встречается Uncaught (in promise): AADSTS650052: The app needs access to a service (\"api://a88bb933-319c-41b5-9f04-eff36d985612\") that your organization \"<MY-ORG>\" has not subscribed to or enabled.

С моей текущей конфигурацией в браузере я сталкиваюсь с отменой запроса, когда MSAL пытается сделать запрос следующей формы:

https://login.microsoftonline.com/67ba7efb-e8.....52-1f993843c3a0/oauth2/authorize?response_type=code+id_token&redirect_uri=https%3A%2F%2Fte.....nfuncs.azurewebsites.net%2F.auth%2Flogin%2Faad%2Fcallback&client_id=61601ca6-104.....524550f6ec&scope=openid+profile+email&response_mode=form_post&nonce=62877cb9e.....245f7f613_2019.....72304&state=redir%3D%252Fapi%252Fpeople%253Fcode%253DqJH4Bs%252F.....ameK%252FPh5S5Th%252FXttS.....D%253D%2526name-starts-with%253Dji

Так что я явно делаю хотя бы одну вещь неправильно.Ниже приводится краткое изложение моей конфигурации.Однако вместо попытки отладки моей конфигурации может оказаться проще (более эффективно) описать все шаги, необходимые для установки рабочей конфигурации. 

Azure Function App
Platform features
    Authentication / Authorization
        App Service Authentication: On
        Action to take when request is not authenticated
            Log in with Azure Active Directory
        Authentication Providers
            Azure Active Directory Configured (Express: Existing App)
            Advanced Settings Token Store
            ALLOWED EXTERNAL REDIRECT URLS
                Link to static website of storage container where Angular site is deployed
                E.g., https://<storagecontainer>.z5.web.core.windows.net/
    CORS
    ALLOWED ORIGINS
        https://<storagecontainer>.z5.web.core.windows.net/
        http://localhost:4200
Function Signatures
    `public static async Task<IActionResult> Function1([HttpTrigger(AuthorizationLevel.Function, "get", "post", "options", Route = null)] HttpRequest httpRequest, ILogger log) {`
...