Optimizely CMS アドオンの作成

標準のMVCコントローラーをCMSエディターガジェットにするには、 [IFrameComponent] 属性。属性の主なプロパティは次のとおりです。

• タイトル : ガジェット セレクターに表示されるガジェットの名前。
• 説明 : ガジェットの簡単な説明。ガジェット セレクターにも表示されます。1 文にまとめることをお勧めします。
• カテゴリー : ガジェットの適切なカテゴリ。コンテンツ固有のガジェットの場合は、「content」または「cms」に設定する必要があります。
• URL : コントローラーアクションに対応するルート。
• プラグインエリア : コンポーネントを利用可能にするシステム内の場所。
• コンテキスト変更時に再読み込み : CMS インターフェース内で異なるコンテンツ項目が選択されるたびに、UI がガジェットを再読み込みできるようにします。

Optimizelyはこれらのコントローラーを自動的に識別し、 [IFrameComponent] CMS エディター インターフェース内のガジェットの追加ウィンドウに入力する属性:

エディターインターフェースがガジェットを読み込むと、 id クエリ文字列パラメータには、文字列形式 (例: 123_456) でバージョン管理されたコンテンツ参照が含まれます。左側の数字はコンテンツの永続的な ID を表し、右側の数字はそのコンテンツ アイテムの特定のバージョンを示します。この情報を使用して、コンテンツ アイテムの特定のバージョンを読み込み、ガジェットのモデルに組み込むことができます。

以下は、コントローラーに必要な最小限の設定例です。 [Authorize] コントローラーの属性と [HttpGet] アクションに属性を追加します。これにより、ユーザーが認証され、予期しないHTTP動詞を使用してインターフェイスにアクセスできないことが保証されます。 id クエリ文字列パラメータは、ユーザーが CMS エディター インターフェイス内で選択したページの特定のバージョンをロードして、ユーザーにコンテキスト固有の情報を提供します。

[Authorize(Policy = OptimizelyAddOnConstants.AuthorizationPolicy)]
[IFrameComponent(
    Url = "/optimizely-addon/gadget/index/",
    Title = "Example Gadget",
    Description = "An example gadget for the CMS Editor Interface.",
    Categories = "content",
    PlugInAreas = "/episerver/cms/assets",
    MinHeight = 200,
    MaxHeight = 800,
    ReloadOnContextChange = true)]
public sealed class GadgetController : Controller
{
    private readonly IContentLoader _contentLoader;

    public GadgetController(IContentLoader contentLoader)
    {
        _contentLoader = contentLoader;
    }

    [HttpGet]
    [Route("~/optimizely-addon/gadget/index")]
    public IActionResult Index()
    {
        var model = new GadgetViewModel
        {
            Page = GetPageData(Request),
            ContentId = Request.Query["Id"].ToString()
        };

        return View("~/Views/OptimizelyAddOn/Gadget/Index.cshtml", model);
    }

    private PageData? GetPageData(HttpRequest request)
    {
        var contentReferenceValue = request.Query["Id"].ToString() ?? string.Empty;
        if (string.IsNullOrWhiteSpace(contentReferenceValue))
        {
            return null;
        }

        var contentReference = new ContentReference(contentReferenceValue);
        if (_contentLoader.TryGet(contentReference, out var pageData))
        {
            return pageData;
        }

        return null;
    }
}

エディターインターフェースがアドオンを認識できるようにするには、アセンブリを宣言する必要があります。 module.config 個人的には、すべての情報がファイルで提供されているので、これは必須ではないと思います。 [IFrameComponent] 属性ですが、アプリケーションの起動時の検証では、この構成ファイルが存在することが必須であるようです。これは、UI とのより深い統合に関連した要件であると思われます。たとえば、カスタム DOJO エディター コードなどです。

以下は、 module.config ファイル。モジュール ノードの属性として承認ポリシーが含まれていることに注意してください。これは、アドオンに必要なポリシーに対応している必要があります。また、ガジェットを含むアセンブリの完全な名前がアセンブリ ノード内にリストされていることを確認します。

• 追加する [IFrameComponent] 属性をコントローラーに追加して、CMS エディター インターフェースのガジェットを定義します。
• 追加する [Authorize] コントローラーに属性を追加してセキュリティを確保します。
• 次のようなHTTP動詞属性を追加します。 [HttpGet] 予期しないアクセス試行を防ぐために、コントローラーのアクションに追加します。
• 追加 module.config ファイルに [MyCmsWebsite]/modules/_protected/[MyAddOn]/module.config CMS がガジェット アセンブリを検証できるようにフォルダーを作成します。

2024年8月30日