---
title: "攻略:JSSモジュールの追加"
slug: "walkthrough--adding-the-jss-module"
abstract: "JSSモジュールを追加して、JSSアプリの扱いをしやすくしましょう。"
---
# 攻略:JSSモジュールの追加

[Sitecore JavaScript SDK](https://jss.sitecore.com/docs/introduction/why-jss) (JSS)は、最新のJavaScriptフレームワークを使ってSitecoreアプリを実装できるnpmパッケージのセットです。JSSモジュールを追加するには、特定のDockerイメージを作成し、Azureコンテナレジストリ(ACR)にプッシュし、その後アプリケーションリポジトリで変更してからMssqlコンテナを起動します。

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

-   Dockerイメージを準備してください
-   画像をACRにプッシュしてください
-   アプリケーションリポジトリ内のイメージを変更する
-   Mssql-init-jssコンテナを実行します:
    -   災害復旧なしで。
    -   災害復旧で。

## Dockerイメージを準備してください

カスタムJSSモジュールの作成方法については、「 [Add Sitecore modules](https://doc.sitecore.com/xp/en/developers/101/developer-tools/add-sitecore-modules.html) 」トピックを参照してください。

JSSアプリを操作するには、以下の画像を作成する必要があります:

-   cm-jss
-   cd-jss
-   mssql\_init\_jss

## イメージをAzureコンテナレジストリ(ACR)にプッシュしてください。

画像をACRにプッシュするには:

-   PowerShellで [docker pushコマンドを実行します](https://docs.docker.com/engine/reference/commandline/push/)。すべてのイメージを事前にプロビジョニングされたACRにプッシュしなければなりません: {infrastructure\_id}acr。

## アプリケーションリポジトリ内のイメージを変更する

これでJSS固有のネーミングイメージをアプリケーションリポジトリに追加できます。

アプリケーションリポジトリ内のイメージを変更するには:

-   アプリケーションリポジトリconfig/docker-imagesにアクセスし、次のようにdocker-images.jsonを編集してください:
    
    -   cm値をcm-jss画像参照URLに置き換えてください。
    -   cd値をcd-jss画像参照URLに置き換えてください。
    -   mssql\_init\_jssプロパティを加えます。
    
    例えば:
    
    {
     "sitecore":{
     "cm": "<newly built cm-jss image reference>",
     "cd": "<newly built cd-jss image reference>",
     "id": "scr.sitecore.com/sxp/sitecore-xml-id:10.1.0-ltsc2019",
     "mssql\_init\_jss": "<newly built mssql\_init\_jss image reference>",
     };
    ...

## イングレスコントローラのヘッダーにアンダースコアを付けるオプションを有効にしてください

Nginxのイングレスコントローラは、デフォルトでアンダースコアを含むリクエストヘッダーを落とします。

JSSモジュールはアンダースコアを含むヘッダーの一部を使用しています。この機能をサポートするためには、*ヘッダー内のアンダースコア* オプションを有効にする必要があります。

*ヘッダーにアンダースコア*を表示するオプションを有効にするには:

1.  roles/に移動し、以下のフォルダ構造を作成してください:roles/nginx-underscores/tasks。
    
2.  roles/nginx-underscores/tasksフォルダ内に、以下のコードを含むmain.yamlファイルを追加します。
    
    ---   
    - name: Customize
    nginx - enable underscores-in-headers
      k8s:
        definition:
          apiVersion: v1
          kind: ConfigMap
          metadata:
            name: ingress-nginx-controller
            namespace: nginx
          data:
            enable-underscores-in-headers: 'true'
        validate:
          fail\_on\_error: yes
    
3.  リポジトリのルートディレクトリでmain.yamlファイルを開いてください。
    
4.  新しいnginx-アンダースコアの役割を追加するには、以下のセクションの後に行います。
    
    include\_role:
            name: ingress-configuration
    
    以下のものを挿入してください:
    
    include\_role:
            name: nginx-underscores
    
5.  アプリケーションパイプラインを実行してください。
    

## Mssql-init-jssコンテナを災害復旧なしで実行してください

Mssql-init-jssコンテナを実行するには:

1.  roles\\sitecore-{topology}\\templates\\に移動し、mssql-init-spe-jssジョブファイルの名前で「mssql-init-jss.yaml」を追加してください。例えば:
    
    ---
    apiVersion: batch/v1
    kind: Job
    metadata:
     name: jss-mssql-init
    spec:
     template:
     spec:
     nodeSelector:
     kubernetes.io/os: windows
     imagePullSecrets:
     - name: sitecore-docker-registry
     containers:
     - name: mssql-init
     image: "{{ docker\_images.sitecore.mssql\_init\_jss }}"
     env:
     - name: sitecore\_admin\_password
     valueFrom:
     secretKeyRef:
     name: sitecore-admin
     key: sitecore-adminpassword.txt
     - name: SQL\_ADMIN\_PASSWORD
     valueFrom:
     secretKeyRef:
     name: sitecore-database
     key: sitecore-databasepassword.txt
     - name: SQL\_ADMIN\_LOGIN
     valueFrom:
     secretKeyRef:
     name: sitecore-database
     key: sitecore-databaseusername.txt
     - name: SQL\_SERVER
     valueFrom:
     secretKeyRef:
     name: sitecore-database
     key: sitecore-databaseservername.txt
     - name: SQL\_ELASTIC\_POOL\_NAME
     valueFrom:
     secretKeyRef:
     name: sitecore-database
     key: sitecore-database-elastic-pool-name.txt
     - name: DATABASES\_TO\_DEPLOY
     value: jss
     restartPolicy: Never
     backoffLimit: 5
    
2.  mssql-init-jssジョブを実行するAnsibleタスクを追加するには、\*roles\\sitecore-xm\\tasks\\init.yaml\*に移動し、ファイルの最後に以下のスクリプトを追加してください。
    
    - name: Execute jss mssql-init jobs
     k8s:
     apply: true
     namespace: "{{ solution\_id }}"
     state: present
     definition: "{{ lookup('template', 'mssql-init-jss.yaml') }}"
    
    - name: 'Wait - JSS Mssql-init job'
     k8s\_info:
     kind: Job
     name: jss-mssql-init
     namespace: "{{ solution\_id }}"
     register: jss\_mssql\_init\_result
     until: (jss\_mssql\_init\_result.resources0.status.conditions0.type | default('')) == 'Complete'
     retries: 60
     delay: 60
    
    - name: Get all JSS Mssql completed pods
     k8s\_info:
     kind: Pod
     namespace: "{{ solution\_id }}"
     label\_selectors:
     - job-name = jss-mssql-init
     no\_log: true
     register: jss\_mssql\_pod\_list
    
    - name: Remove JSS Mssql job's pods
     k8s:
     kind: Pod
     name: "{{ item.metadata.name }}"
     namespace: "{{ solution\_id }}"
     state: absent
     no\_log: true
     with\_items: "{{ jss\_mssql\_pod\_list.resources }}"
    
3.  アプリケーションパイプラインを実行してください。
    

## Mssql-init-jssコンテナを災害復旧で実行します

Mssql-init-jssコンテナを実行するには:

1.  roles\\sitecore-{topology}\\templates\\に移動し、mssql-init-spe-jssジョブファイルの名前で「mssql-init-jss.yaml」を追加してください。例えば:
    
    ---
    apiVersion: batch/v1
    kind: Job
    metadata:
     name: jss-mssql-init
    spec:
     template:
     spec:
     nodeSelector:
     kubernetes.io/os: windows
     imagePullSecrets:
     - name: sitecore-docker-registry
     containers:
     - name: mssql-init
     image: "{{ docker\_images.sitecore.mssql\_init\_jss }}"
     env:
     - name: sitecore\_admin\_password
     valueFrom:
     secretKeyRef:
     name: sitecore-admin
     key: sitecore-adminpassword.txt
     - name: SQL\_ADMIN\_PASSWORD
     valueFrom:
     secretKeyRef:
     name: sitecore-database
     key: sitecore-databasepassword.txt
     - name: SQL\_ADMIN\_LOGIN
     valueFrom:
     secretKeyRef:
     name: sitecore-database
     key: sitecore-databaseusername.txt
     - name: SQL\_SERVER
     valueFrom:
     secretKeyRef:
     name: sitecore-database
     key: sitecore-databaseservername.txt
     - name: SQL\_ELASTIC\_POOL\_NAME
     valueFrom:
     secretKeyRef:
     name: sitecore-database
     key: sitecore-database-elastic-pool-name.txt
     - name: DATABASES\_TO\_DEPLOY
     value: jss
     restartPolicy: Never
     backoffLimit: 5
    
2.  例えば、custom-init.yaml、のカスタムinit.yamlファイルを作成し、*それを /roles/sitecore-{topology}/tasks*フォルダに入れます。
    
3.  mssql-init-jssジョブをファイルに追加するには、以下のコードを追加してください:
    
    - name: Execute jss mssql-init jobs
     k8s:
     apply: true
     namespace: "{{ solution\_id }}"
     state: present
     definition: "{{ lookup('template', 'mssql-init-jss.yaml') }}"
    
    - name: 'Wait - JSS Mssql-init job'
     k8s\_info:
     kind: Job
     name: jss-mssql-init
     namespace: "{{ solution\_id }}"
     register: jss\_mssql\_init\_result
     until: (jss\_mssql\_init\_result.resources0.status.conditions0.type | default('')) == 'Complete'
     retries: 60
     delay: 60
    
    - name: Get all JSS Mssql completed pods
     k8s\_info:
     kind: Pod
     namespace: "{{ solution\_id }}"
     label\_selectors:
     - job-name = jss-mssql-init
     no\_log: true
     register: jss\_mssql\_pod\_list
    
    - name: Remove JSS Mssql job's pods
     k8s:
     kind: Pod
     name: "{{ item.metadata.name }}"
     namespace: "{{ solution\_id }}"
     state: absent
     no\_log: true
     with\_items: "{{ jss\_mssql\_pod\_list.resources }}"
    
4.  カスタムinit.yamlファイルを呼び出すには、*/roles/sitecore-{topology}/tasks/main.yaml*にアクセスし、ファイルの最後に以下のロールを追加してください:
    
    - name: Execute custom init jobs
     include\_tasks: custom-init.yaml
    
    ![In the mail.yaml file, call the init.yaml file.](https://doc.sitecore.com/api/markdown-image/xp/ja/developers/101/managed-cloud/images/main_yaml_mssql-init-jss.png)
    
5.  アプリケーションパイプラインを実行してください。
    
6.  カスタムジョブが正常に作成された場合は、Execute custom init jobs役にコメントを書き留めてください。