# 有狀態的 URL

Spartacus 為店面的每一部分提供了一個帶有狀態地址的 URL。這使使用者可以更輕鬆地瀏覽店面，還允許網路爬蟲對每個頁面進行索引。因此，可以透過社交媒體、機器人和搜尋索引共享更多頁面。

一個例子：

![](https://img-blog.csdnimg.cn/img_convert/8c6b0acd1e98ea258de50c27c2950447.png)

為了為所有內容提供有狀態的 URL，Spartacus 允許深層連結來定址任何頁面。URL 路由配置還可以考慮多站點上下文，以便可以啟動和快取店面特殊變體的有狀態 URL。

# 可配置的 URL

您可以使用 pageLabel 欄位(位於 CMS 後端中）的配置內容頁面的 URL 。這些頁面標籤無法本地化。

您可以在 Spartacus 中為非 content page 配置 URL。這些主要與產品和類別頁面(catagory page)有關。您可以將產品名稱等屬性配置為 URL 的一部分。例如，產品頁面的預設配置是storefront.com/product/1234，但您可以配置 URL 以包含與產品相關的資料，例如產品或類別標題。

可配置的 URL 通常有助於改進 SEO，但也可用於幫助將現有解決方案遷移到 Spartacus：客戶可以保留其現有 URL，並在 Spartacus 中配置等效 URL。

注：產品程式碼用於從後端解析產品資料。URL 的其餘部分可以配置用於 SEO 目的。

注意：有些客戶的產品標題帶有無法使用的特殊字元（例如，程式碼或標題中有斜線）。這可能需要在 URL 中使用屬性之前或之後對其進行特殊處理。請注意，Spartacus 不包括處理特殊字元的功能。

# 可索引頁面

伺服器端渲染 (SSR) 是一種在伺服器端渲染 JavaScript 邏輯，然後在響應中提供豐富內容的技術。SSR 響應包含網路爬蟲從響應中索引或檢索資料所需的完整 HTML。

SSR 由 Spartacus 提供，並計劃成為 Commerce Cloud 中的預設部署選項。

# 結構化資料 (schema.org)

結構化資料是一種描述網站頁面內容的標準化方式，使網路爬蟲和搜尋引擎更容易理解。Spartacus 原生支援各種模式。

# HTML 標籤

搜尋引擎、社交平臺和爬蟲使用 HTML 標籤，尤其是元標籤，將頁面後設資料索引到他們的平臺中。Spartacus 提供了多種解析元標記的方法。

HTML title 的賦值程式碼位置：

![](https://img-blog.csdnimg.cn/img_convert/2a65feceee4870bfa25cbd4b51ae0ada.png)

執行時的除錯：
![](https://img-blog.csdnimg.cn/img_convert/1041d24720e311a4952da3dee875ab7b.png)

再研究 27 行的 pageMetaService 的 getMeta 方法呼叫。

![](https://img-blog.csdnimg.cn/img_convert/a864630ccf9a4192cd50589659577e00.png)

當 meta$ 被 subscribe 後，依次執行下列邏輯：

* this.cms.getCurrentPage();
* this.getMetaResolver
* this.resolve

每一步驟的輸出都是下一步驟的輸入。

讀取當前頁面的方法：從 ngrx store 裡讀取：

![](https://img-blog.csdnimg.cn/img_convert/836d789fc22300648aec6cec29a1b550.png)

![](https://img-blog.csdnimg.cn/img_convert/ede2fac860b87a5d13d8933ef610e0db.png)

讀取回來的 page 資料：
![](https://img-blog.csdnimg.cn/img_convert/13e3e41f4e753771657df9fbbca3efe4.png)

每種不同的頁面，都有對應型別的 resolver：
![](https://img-blog.csdnimg.cn/img_convert/11ad6558e385b8422b3308116b3aaebb.png)

![](https://img-blog.csdnimg.cn/img_convert/bc3ab348db529b41edc97ea4f3280e69.png)

因為我當前開啟的是 product page，所以返回的是 product page meta resolver：

![](https://img-blog.csdnimg.cn/img_convert/47d83769636c8d3baecb27c6a9462ad1.png)

動態呼叫 resolveTitle 方法：
![](https://img-blog.csdnimg.cn/img_convert/29980100aa5211ff9e082199feaee074.png)

從程式碼能看到業務邏輯：

![](https://img-blog.csdnimg.cn/img_convert/ad7b2bd6a16426692dda59d41e02c896.png)

產品頁面的 title 屬性，值來自產品名稱，產品種類和產品製造商三者的連線。

SAP 電商雲 Spartacus UI 有狀態的 url 和 title 屬性的賦值程式碼

相關文章

SAP 電商雲 Spartacus UI 有狀態 的 url 和 title 屬性的賦值程式碼

相關文章

SAP 電商雲 Spartacus UI 有狀態的 url 和 title 屬性的賦值程式碼