將ContextHub新增至頁面並存取儲存

將ContextHub新增至您的頁面以啟用ContextHub功能並連結至ContextHub Javascript資料庫。

ContextHub Javascript API可讓您存取ContextHub管理的內容資料。 本頁簡要說明API存取及控制內容資料的主要功能。 請依照API參考檔案的連結,查看詳細資訊和程式碼範例。

將ContextHub新增至頁面元件

若要啟用ContextHub功能並連結至ContextHub Javascript程式庫,請在頁面的head區段中加入contexthub元件。 您頁面元件的HTL程式碼應類似下列範例:

<sly data-sly-resource="${'contexthub' @ resourceType='granite/contexthub/components/contexthub'}"/>

請注意,您也需要設定ContextHub工具列是否顯示在「預覽」模式中。 請參閱顯示和隱藏ContextHub UI

關於ContextHub儲存

使用ContextHub存放區來保留內容資料。 ContextHub提供下列儲存類型,這些儲存類型構成所有儲存類型的基礎:

所有儲存類型都是ContextHub.Store.Core類的副檔名。 有關建立新商店類型的資訊,請參閱建立自定義商店。 如需範例存放區類型的相關資訊,請參閱範例ContextHub存放區候選項

持久性模式

Context Hub存放區使用下列其中一種持續性模式:

  • 本機: 使用HTML5 localStorage來保存資料。本機儲存會跨工作階段保存在瀏覽器上。
  • 工作階段: 使用HTML5 sessionStorage來保存資料。工作階段儲存在瀏覽器工作階段期間持續存在,且可供所有瀏覽器視窗使用。
  • Cookie: 使用瀏覽器對資料儲存Cookie的原生支援。Cookie資料會在HTTP要求中傳送至伺服器,或從伺服器傳送。
  • Window.name: 使用window.name屬性來保存資料。
  • 記憶體: 使用Javascript物件來保存資料。

預設情況下,Context Hub使用本地持久性模式。 如果瀏覽器不支援或允許HTML5 localStorage,則會使用工作階段持續性。 如果瀏覽器不支援或允許HTML5 sessionStorage,則會使用Window.name持續性。

存放資料

在內部,將資料儲存為樹結構,以便將值添加為主要類型或複雜對象。 添加要儲存的複雜對象時,對象屬性在資料樹中形成分支。 例如,下列複雜物件會新增至名為位置的空白存放區:

Object {
   number: 321,
   data: {
      city: "Basel",
      country: "Switzerland",
      details: {
         population: 173330,
         elevation: 260
      }
   }
}

儲存資料的樹狀結構可概念化如下:

/
|- number
|- data
      |- city
      |- country
      |- details
            |- population
            |- elevation

樹結構將儲存中的資料項目定義為索引鍵/值組。 在上例中,鍵/number與值321對應,鍵/data/country與值Switzerland對應。

操作對象

ContextHub提供ContextHub.Utils.JSON.tree類別,用於操作Javascript對象。 在將Javascript對象添加到儲存區之前,或在從儲存區獲取Javascript對象之後,使用此類的函式。

此外,ContextHub.Utils.JSON類還提供了將對象序列化為字串,並將字串反序列化為對象的函式。 使用此類別處理JSON資料,以支援原生不包含JSON.parseJSON.stringify函式的瀏覽器。

與ContextHub商店互動

使用ContextHub Javascript物件來取得儲存作為Javascript物件。 取得儲存物件後,您就可以控制其包含的資料。 使用getAllStoresgetStore函式來取得存放區。

訪問儲存資料

ContexHub.Store.Core Javascript類定義了與儲存資料交互的多個函式。 以下函式儲存和檢索對象中包含的多個資料項:

個別資料項目會儲存為一組索引鍵/值組。 要儲存和檢索值,請指定相應的鍵:

請注意,自訂存放區候選項可定義其他功能,以提供存取儲存資料的權限。

注意

ContextHub預設不會知道目前在發佈伺服器上使用的登入,且ContextHub會將這類使用者視為「匿名」。

您可以載入設定檔存放區,讓ContextHub得知已登入的使用者。 請在此處🔗參閱GitHub上的范常式式碼。

ContextHub事件

ContextHub包含事件架構,可讓您自動回應以儲存事件。 每個儲存對象都包含一個ContextHub.Utils.Eventing對象,該對象可用作儲存的eventing屬性。 使用ononce函式將Javascript函式系結至儲存事件。

使用內容中樞來操控Cookie

Context Hub Javascript API提供跨瀏覽器支援,可處理瀏覽器Cookie。 ContextHub.Utils.Cookie命名空間定義了用於建立、操作和刪除Cookie的多個函式。

確定解析的ContextHub區段

ContextHub區段引擎可讓您判斷目前內容中要解析的已註冊區段。 使用ContextHub.SegmentEngine.SegmentManager類的getResolvedSegments函式來檢索已解析的段。 然後,使用ContextHub.SegmentEngine.Segment類的getNamegetPath函式來測試段。

ContextHub 區段

ContextHub區段會安裝在/conf/<site>/settings/wcm/segments節點下。

下列區段隨WKND教學課程網站一起安裝。

  • 夏季
  • 冬季

用以解決這些區段的規則摘要如下:

  • 首先,使用geolocation商店來判斷使用者的緯度。
  • 然後,surferinfo商店的月份資料項決定該緯度的季數。
警告

安裝的區段會作為參考設定提供,協助您為專案建立專屬的設定,因此不應直接使用。

調試ContextHub

有許多選項可用來偵錯ContextHub,包括產生記錄檔。 如需詳細資訊,請參閱設定ContextHub 。

請參閱ContextHub架構概述

ContextHub提供診斷頁面 ,您可在其中看到ContextHub架構的概觀。

本頁內容