1. スピーク3

SPEAK 3アプリケーションでのロールベースの認証の有効化

Version:
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

デフォルトでは、すべてのユーザーがSPEAK3アプリケーションのすべての機能にアクセスできます。

場合によっては、Sitecore管理者に、アプリケーションの特定の機能へのアクセスを特定のユーザーに制限させたい場合があります。このトピックでは、Sitecoreロールベースの認証を使用して、アプリケーションでセキュリティを有効にする方法について説明します。その後、管理者はセキュリティ エディタを使用して、アプリケーションの機能へのアクセスをユーザーに許可または拒否できます。

準備

開始する前に、アプリケーションのどの部分にアクセスを制限する必要があるかを決定する必要があります。アクセスの制限には、コンポーネントの無効化や、一連のユーザーのインターフェイスからのコンポーネントの削除が含まれる場合があります。

たとえば、アプリケーションには、フォーム内のコンポーネントの特性を編集する機能があります。一部のユーザーはすべてのフィールドへのフル アクセスを持つ必要がありますが、アクセスを制限し、一部のフィールドを読み取り専用にするか、他のユーザーに対して完全に非表示にする必要があります。

セキュリティを有効にする機能領域のリストを作成したら、これらの領域ごとにSitecoreアイテムを作成します。これらの項目は、このトピックの残りの部分で "アクセス項目" と呼ばれます。

セキュリティエディタを使用してアクセスを提供または制限するには、ユーザーやロールなどの特定のアカウントに対して、coreデータベース内のアクセス項目に対する読み取りおよび書き込みアクセスを許可または拒否します。物事を整理するには、アプリケーションのルートアクセスフォルダの下にすべてのアクセスアイテムを作成します。

アプリケーションは、アクセス項目に対する現在のユーザーのアクセス設定をリクエストし、それに応じて関連する機能を有効、無効、表示、または非表示にします。

Sitecoreでアクセス アイテムを設定する

次の手順に従って、アクセス項目を設定します。

  1. /sitecore/templates/System/Speak3/ComponentAccessFolderテンプレートを使用して、coreデータベースにアクセス フォルダを作成します。これは、アクセスアイテムを追加するルートアクセスフォルダになります。

  2. 必要なアクセス項目を、/sitecore/templates/System/Speak3/ComponentAccessSettingテンプレートを使用してアクセスフォルダに追加します。

  3. Security Editorを使用して、各アクセス項目の読み取りおよび書き込み権限を指定します。

Angularアプリケーションを構成する

次の手順に従って、アクセスアイテムを使用するようにAngularアプリケーションを設定します。

  • SciAuthModuleモジュールをインポートし、ルート アクセス フォルダーの項目IDを引数として指定します。

  • たとえば、app.module.tsでは次のようにします。

    import { SciAuthModule } from '@speak/ng-sc/auth';
    
    @NgModule({
        imports: [
            SciAuthModule.withItemId('{DA4466EE-92C8-4D69-B4AB-2E0CA36ADD22}'),
        ],
    })
    
    export class AppModule { }
            

    export class AppModule { }

高度なシナリオでは、アプリケーションのさまざまな部分で異なるアクセス フォルダーをターゲットにすることができます。これを行うには、アプリケーションの必要なすべての部分でSciAuthModuleを、対応するアクセス フォルダー アイテムIDと共にインポートします。

たとえば、section-a.module.tsでは次のようにします。

import { SciAuthModule } from '@speak/ng-sc/auth';
@NgModule({
  imports: [
    SciAuthModule.withItemId('{DA4466EE-92C8-4D69-B4AB-2E0CA36ADD22}'),
  ],
})
export class SectionA { }

そして、section-b.module.tsでは:

import { SciAuthModule } from '@speak/ng-sc/auth';
@NgModule({
  imports: [
    // A different item-id.
    SciAuthModule.withItemId('{1727B934-FAA1-4317-B34B-AFC99A50B60F}'),
  ],
})
export class SectionB { }

SciAuthServiceを使用する

SPEAK 3が提供するSciAuthServiceモジュールを使用して、アクセス項目のアクセス許可を取得します。

SciAuthServiceサービスには2つの方法があります。hasReadhasWrite. どちらも引数としてitemNameが必要であり、Observableを返します。itemNameはアクセス アイテムの名前である必要があります。

このサービスは、テンプレートから直接、asyncパイプと組み合わせて使用できます。例えば:

import { SciAuthService } from '@speak/ng-sc/auth';
@Component({
  selector: 'auth-service-example',
  template: `
    <div *ngIf="authService.hasRead('OptionalContent') | async">Optional content</div>
    <button [disabled]="!(authService.hasWrite('Button1') | async)">Disableable btn</button>
  `
})
export class ExampleComponent {
  constructor(public authService: SciAuthService) { }
}

または、observablesをサブスクライブしてから、通常の変数を使用することもできます。これには追加のコードが必要ですが、そうすればコードが理解しやすくなります。例えば:

@Component({
  selector: 'auth-service-example',
  template: `
    <div *ngIf="hasRead">Optional content</div>
    <button [disabled]="hasWrite">Disableable btn</button>
  `
})
export class ExampleComponent {
  hasRead: boolean;
  hasWrite: boolean;
  constructor(private authService: SciAuthService) { }
  ngOnInit() {
    this.authService.hasRead('OptionalContent').subscribe(value => this.hasRead = value);
    this.authService.hasWrite('Button1').subscribe(value => this.hasWrite = value);
  }
}
この記事を改善するための提案がある場合は、 お知らせください!