Spartacus のベース URL アクセス - CSR 側で変更する必要がある構成

Spartacus の URL の後にカスタム URL アクセスを追加したいとします。たとえば、前は経由でhttps://spartacus-demo.eastus.cloudapp.azure.com/electronics-spa/アクセスし、現在はhttps://spartacus-demo.eastus.cloudapp.azure.com/electronics-spa/jerry経由でアクセスします。

CSR、つまりクライアント側レンダリングモードで、app.module.ts に次のコードを追加します。

{
    
     provide: APP_BASE_HREF, useValue: /jerry/ }],

このコードは、Angular での dependency Injection のプロバイダー (Provider) を構成するために使用されます。

provide: APP_BASE_HREF:provideはプロバイダー構成内のキーワードであり、提供される依存関係を指定します。APP_BASE_HREFAngularが提供するトークン(トークン)で、アプリケーションのベースURLパスを表すために使用されます。

useValue: /jerry/:useValueはプロバイダー構成内のキーワードであり、提供する依存関係の特定の値を指定します。この場合、の具体的な値APP_BASE_HREFを指定します/jerry/。これは、アプリケーションのベース URL パスがであること/jerry/、つまりアプリケーションのルートパスがであることを意味します/jerry/。

このコードの構成を通じて、依存関係注入を使用して AngularAPP_BASE_HREFののため、この値を使用してアプリケーションで URL を構築できます。たとえば、ルーティング設定でを使用すると、ルーティングリンクを正しく生成するのに役立ちAPP_BASE_HREFます。

同時に、angular.json ファイルに次の構成を追加します。

"build": {
    
    
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
    
    
           "deployUrl": "/jerry/",

このコードはangular.json、buildファイルの構成セクションから取得されます。その機能は、構築プロセス中に Angular アプリケーションのオプションを指定することであり、具体的な説明は次のとおりです。

"builder": "@angular-devkit/build-angular:browser": ビルド時に使用されるビルダーです。@angular-devkit/build-angular:browserは、ブラウザ側アプリケーションを構築するために Angular によって提供されるデフォルトのビルダーです。
"options": これはビルドオプションの構成部分であり、一連の構成可能なオプションが含まれています。
- "deployUrl": "/jerry/":deployUrlは、デプロイ時にビルドされたアプリケーションのベース URL パスを指定するために使用されるオプションです。この例では、/jerry/アプリケーションのデプロイメントパスを指します/jerry/。これは、ビルドされたアプリケーションが/jerry/パスの。

を設定するとdeployUrl、構築されたアプリケーションがリソースファイル (CSS、JavaScript など) を正しくロードし、デプロイ時にルーティングやナビゲーションなどの操作を実行できるようになります。これは、アプリケーションを特定のサブパスにデプロイしたり、特定のサーバーでアプリケーションをホストしたりする場合に便利です。

Spartacus のベース URL アクセス - CSR 側で変更する必要がある構成

おすすめ