---
title: "ウォークスルー:Sitecore認証のテスト用ユーザーとページ作成"
slug: "walkthrough--creating-a-user-and-page-for-testing-sitecore-authentication"
abstract: "Sitecore認証サービスを呼び出してJSSアプリから認証してください"
---
# ウォークスルー:Sitecore認証のテスト用ユーザーとページ作成

Sitecore Services Client(SSC)には認証サービスが含まれており、JSSアプリケーションでSitecoreにログインし、RESTリクエストを使って .ASPXAUTHクッキーを設定することができます。

> !注SSC認証サービスはSSL/TLS接続を必要とし、ローカル開発のためにSitecoreサイト用の証明書とSSLバインディングを設定する必要があります。JSSアプリからSSC認証を試みる前に、HTTPSプロトコルを使ってSitecoreインスタンスにアクセスすることは、セキュリティ警告があっても動作するはずです。

JSSサンプルアプリで認証とセキュリティをテスト・探索するには、Sitecore内でユーザーと保護されたルートを作成する必要があります。

> !重要以下の手順では、JSSアプリケーションをSitecoreにインポートする必要があります。

このウォークスルーでは、以下の方法を説明します:

-   エクストラネットユーザーを作成する
-   保護されたルートを作成する
-   JSSアプリをSSC認証サービスで認証するように設定してください

## エクストラネットユーザーを作成する

Sitecoreにログインするには、ユーザーを作成する必要があります。

ユーザーを作成するには:

1.  SitecoreにログインしてLaunchpadにアクセスしてください。
2.  **アクセス管理**セクションで**、ユーザーマネージャー**をクリックします。
3.  リボンの上で「 **新」**をクリックします。
4.  以下のフィールドを指定します:
    -   **ユーザー名** - お好きなユーザー名を入力してください。
    -   **ドメイン** - *エクストラネット*を選択します。
    -   **メール** - 有効なメールアドレスを入力してください。
    -   **パスワード** - お好きなパスワードを入力してください。
5.  **「次へ**」をクリックしてから**「閉じる**」をクリックしてください。

## 保護されたルートを作成する

JSSアプリからSitecore認証サービスで認証をテストするには、少なくとも1つの保護ルートが必要で、その保護ルートはユーザーがコンテンツにアクセスする前にログインする必要があります。

保護されたルートを作成する方法:

1.  SitecoreにログインしてLaunchpadにアクセスしてください。
2.  **コンテンツ編集**セクションで「**コンテンツエディター**」をクリックしてください。
3.  コンテンツツリーで、例えばJSSアプリの *Home* 項目に */sitecore/content/JssReactWeb/home*に移動します。
4.  *Home*アイテムを右クリックしてから「**挿入**」→「**拡張ルート**」をクリックします。
5.  ルートの名前を入力してください。
6.  新しいルートが選択されたまま、 **セキュリティ** タブの **プリセット** セクションで「 **ログイン必須** 」チェックボックスを選択します。
7.  **OK**をクリックします。
8.  変更点を公開してください。

## JSSアプリをSSC認証サービスで認証するように設定してください

SSC認証サービスを使って、JSSアプリに簡単なログイン/ログアウト機能を追加できます。

アプリケーションがどこで実行されているかによって認証方法は3つあります。

### Sitecoreインスタンスに対してローカル開発中に認証する

[開発中にSitecoreに接続](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/start-a-jss-app-in-connected-mode.html "Start a JSS app in connected mode")されたJSSアプリケーションを実行する際、ローカルサーバーがアプリを提供し、アプリはブラウザ上でレンダリングされますが、SSC認証サービス要求はリモートのSitecoreインスタンスに送信されます。

接続モードでアプリケーションを実行しながら認証するには:

1.  scjssconfig.jsonファイルで、リモートSitecoreホストのURLをHTTPSプロトコルに切り替えてSSLを使用するように設定します。例えば、https://JssReactWeb.
    
2.  アプリケーション構成では、ヘッダーをAccess-Control-Allow-HeadersとAccess-Control-Allow-Credentials:
    
    <add name="Access-Control-Allow-Headers" value="Content-Type, Accept, X-Requested-With, Session" />
    <add name="Access-Control-Allow-Credentials" value="true" />
    
3.  SSC認証サービスは、OPTIONSプリフライトのクロスオリジンリクエスト(CORS)を標準でサポートしておらず、404応答を生じさせるため、リクエストはURLでエンコードされたボディを使ってログインサービスに送信し、*JSON送信しない*ことを必ず確認してください。例えば:
    
    // an example of sending a URL-encoded body using the fetch API (JavaScript)
    
    import queryString from 'query-string';
    
    const payload = {
     domain: 'extranet',
     username: 'test',
     password: 'b'
    }
    
    fetch('https://site.core.local/sitecore/api/ssc/auth/login?sc\_apikey={DCE1069B-36E8-4A66-946E-C1B07071C38C}', {
     headers: {
     Accept: 'application/json',
     'Content-Type': 'application/x-www-form-urlencoded',
     },
     credentials: 'include',
     method: 'POST',
     body: queryString.stringify(payload),
    }).then((response) => {
     console.log(response);
    });
    

### 統合されたJSSアプリで認証

[アプリケーションを統合モードで](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/start-a-jss-app-in-integrated-mode.html "Start a JSS app in integrated mode")実行する場合、SSC認証サービスへの呼び出しはアプリケーションと同じホスト名に対して行われ、追加のセットアップは不要です。

認証が正しく動作するために:

-   HTTPSプロトコルを用いてSSL経由でSitecoreホストにアクセスします。例えば、 https://JssReactWeb.を訪問することで。

### ヘッドレスでサーバーサイドレンダリングされたJSSアプリで認証する

サーバー [サイドでJSSアプリケーションをヘッドレスレンダリング](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/walkthrough--rendering-a-jss-app-server-side-using-the-headless-jss-proxy.html "Walkthrough: Rendering a JSS app server-side using the headless JSS proxy")する際、プロキシシステムはCORSの問題なくSSC認証サービスや .ASPXAUTHクッキーへのリクエストをプロキシします。

認証が正しく動作するために:

1.  config.jsファイルで、apiHostをHTTPSプロトコルに更新します。例えば、https://JssReactWeb.
2.  プライベート署名済みの証明書を使って開発中のSitecoreインスタンスにプロキシする場合は、SSL証明書の検証問題を防ぐための正しい設定をしているか確認してください:
    -   [Node.js用のSitecore CA証明書を設定してください](https://doc.sitecore.com/xp/ja/developers/hd/19/sitecore-headless-development/walkthrough--configuring-sitecore-ca-certificates-for-node-js.html "Walkthrough: Configuring Sitecore CA certificates for Node.js")。
        
    -   または、config.jsファイル内でプロキシオプションでsecureをfalseに設定してSSL検証を完全に無効にしてください。例えば:
        
        proxyOptions: {
         secure: false
         }
        
        > !重要本番環境でSSL検証を無効にしないでください。これによりソリューションが安全でなくなります。