我有一个旧的静态网站,它只是纯 HTML 和用于 UI 效果的简单 JavaScript。本网站中没有服务器端代码、API、配置文件或任何内容 - 只有原始 HTML 文件、CSS、图片等。
该网站将不会托管在 Azure 中。它将位于本地 IIS 服务器上。如果我将网站拉入 Visual Studio,“配置 Azure AD 身份验证”向导将显示:
An incompatible authentication configuration was found in this project ().
如何使用 Azure AD 保护简单的 HTML 文件?
最佳答案
Visual Studio“配置 Azure AD 身份验证”向导适用于 ASP.Net Web 应用和 Web API。
就您而言,您正在构建的内容被视为“单页应用程序”或SPA。即使您可能有多个页面,该术语也适用于没有后端代码的仅客户端 Web 应用程序。
为此,您应该遵循Azure AD Javascript Single Page Application示例。
其要点是,您应该使用 ADAL.js,如本示例的 app.js 所示。 ,大致如下:
// Configure ADAL
window.config = {
instance: 'https://login.microsoftonline.com/',
tenant: '[Enter your tenant here, e.g. contoso.onmicrosoft.com]',
clientId: '[Enter your client_id here, e.g. g075edef-0efa-453b-997b-de1337c29185]',
postLogoutRedirectUri: window.location.origin,
cacheLocation: 'localStorage', // enable this for IE, as sessionStorage does not work for localhost.
};
var authContext = new AuthenticationContext(config);
// Check For & Handle Redirect From AAD After Login
var isCallback = authContext.isCallback(window.location.hash);
authContext.handleWindowCallback();
$errorMessage.html(authContext.getLoginError());
if (isCallback && !authContext.getLoginError()) {
window.location = authContext._getItem(authContext.CONSTANTS.STORAGE.LOGIN_REQUEST);
}
// Check Login Status, Update UI
var user = authContext.getCachedUser();
if (user) {
//Do UI for authenticated user
} else {
//Show UI for unauthenticated user
}
// Register NavBar Click Handlers
$signOutButton.click(function () {
authContext.logOut();
});
$signInButton.click(function () {
authContext.login();
});
注意:还有一个 Angular SPA sample .
关于azure - 如何使用 Azure AD 保护简单的 HTML 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46372223/