Question

我正在尝试允许匿名用户访问我的应用程序并使用此库：使用Angular 5的'keycloak-angular'。在说明中，它要求我像这样初始化应用程序：

providers: [
    {
        provide: APP_INITIALIZER,
        useFactory: keycloakInitializer,
        multi: true,
        deps: [KeycloakService]
    }

export function keycloakInitializer(keycloak: KeycloakService): () => Promise<any> {
return (): Promise<any> => {
    return new Promise(async (resolve, reject) => {
        try {
            await keycloak.init({
                config: {
                    url: 'my-url',
                    realm: 'my-realm',
                    clientId: 'my-client-id'
                },
                initOptions: {
                    onLoad: 'check-sso',
                    checkLoginIframe: false
                }
            });
            resolve();
        } catch (error) {
            reject(error);
        }
    });
};

这样做会自动触发keycloak服务器的登录提示。有没有办法只按需触发登录？

谢谢

Answer 1

是的，这可以做到。当您使用工厂提供程序时，angular会在解析依赖项时调用工厂。

要延迟提示，请将函数包装在返回原始函数的工厂函数中并提供该函数。

这是看起来像什么

export async function initializeApp( keycloak: KeycloakService, deferredInitializer: typeof keycloakInitializer ) { if (someCondition) { const initializer = await deferredInitializer(keycloak); } } export async function keycloakInitializer(keycloak: KeycloakService) { await keycloak.init({ config: { url: 'my-url', realm: 'my-realm', clientId: 'my-client-id' }, initOptions: { onLoad: 'check-sso', checkLoginIframe: false } }); } const providers = [ { provide: APP_INITIALIZER, useFactory: initializeApp, deps: [KeycloakService, keycloakInitializer] } ];

实际的keycloakInitializer函数编写得非常糟糕，所以我要为后代重构它。

export async function keycloakInitializer(keycloak: KeycloakService) { await keycloak.init({ config: { url: 'my-url', realm: 'my-realm', clientId: 'my-client-id' }, initOptions: { onLoad: 'check-sso', checkLoginIframe: false } }); }

Answer 2

实际上，您可以直接创建自定义或来宾用户表单密钥斗篷。在keycloak本身中设置角色和访问限制。最后，您可以使用angular-oauth2-oidc来使用户登录到应用程序。因此，如果您需要获取页面的内容，或者只是让访客用户可以访问页面，请使用上面创建的凭据登录访客用户。 angular-oauth2-oidc为登录，注册，更新，删除，添加用户等提供了一些其他资源。因此，您只需登录来宾用户即可。但是，您需要额外的安全性实现，以确保来宾用户不会访问安全页面或资源。

只需

npm i angular-oauth2-oidc

有关更多信息，请参见此github存储库。

Angular 5 + Keycloak允许匿名用户

2 个答案: