Kentico Xperienceでメディアライブラリの保存先ストレージにAmazonS3を使う

いわさ

2021.07.19

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

いわさです。

先日エンタープライズ向けCMSのKenticoをAWSで動かすことが出来ますというご紹介をしました。

Kenticoは、どうにかAWSで動かせますよというわけではなく、AWSの機能との統合もしっかりされています。
CMSでは画像などをメディア系の機能を使って管理することが多いと思いますが、Kenticoでも"メディアライブラリ"という機能があります。
本日はメディアライブラリでAmazonS3を使う方法をご紹介します。

通常設定のメディアライブラリ

まずは、AmazonS3との連携を設定しない状態の挙動を解説します。
メディアライブラリを開き、画像ファイルをアップロードします。

アップロード後、Direct Pathが表示されますね。
このパスがCMSでページを動的生成した際に、静的コンテンツのパスとして使用されます。

何も設定しない普通の状態だと、ローカルファイルへ保存されます。
IIS配下のローカルファイルストレージとして格納されたコンテンツが、リクエストに応じてアクセスされる形です。

物理パスとしてもIIS Webサイトのコンテンツディレクトリに格納されています。
なお、アップロード時のメタデータ等はデータベースへ格納されています。

S3に保存先を変更

まずはAmazonS3バケットを作成します。

web.configに、CMSAmazonAccessKeyID・CMSAmazonAccessKey・CMSAmazonBucketNameの設定を追加します。
CMSAmazonAccessKeyID・CMSAmazonAccessKeyはS3へのアクセスを許可するIAMユーザーのアクセスキーとシークレットを設定します。
CMSAmazonBucketNameにはバケット名を設定します。

web.config

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <configSections>
    <!-- Content staging BEGIN -->
    <section name="microsoft.web.services3" type="Microsoft.Web.Services3.Configuration.WebServicesConfiguration, Microsoft.Web.Services3, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
    <!-- Content staging END -->
    <!-- AjaxControlToolkit BEGIN -->
    <section name="ajaxControlToolkit" type="AjaxControlToolkit.AjaxControlToolkitConfigSection, AjaxControlToolkit" requirePermission="false" />
    <!-- AjaxControlToolkit END -->
  </configSections>
  <appSettings>
    <add key="CMSProgrammingLanguage" value="C#" />
    <add key="WS.webservice" value="http://localhost/WebService/webservice.asmx" />
    <add key="CMSTrialKey" value="CX13-HOGE-HOGE" />
    <add key="ChartImageHandler" value="storage=session;timeout=20;" />
    <add key="PageInspector:ServerCodeMappingSupport" value="Disabled" />
    <add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />
    <add key="CMSApplicationGuid" value="917846d2-c191-4b29-8b7c-286ca1306c2f" />
    <add key="CMSApplicationName" value="Default Web Site/Kentico13_1" />
    <!-- Note: Changing the 'CMSHashStringSalt' value may prevent macros from resolving correctly, and break dialog links and images on your website. 
    To fix these issues, you need to globally re-sign macros in 'System -> Macros -> Signatures' or manually re-save the affected content. -->
    <add key="CMSHashStringSalt" value="bb7dee22-95a0-4e37-aa23-129884f8dd79" />
    <add key="CMSAmazonAccessKeyID" value="AAAAAAAAAAAAAAAAAAAA" />
    <add key="CMSAmazonAccessKey" value="aaaaaaaaaabbbbbbbbbbccccccccccdddddddddd" />
    <add key="CMSAmazonBucketName" value="iwasa-kentico-202107" />
  </appSettings>

先程と同じようにアップロードしてみましょう。
Direct Pathが変わったと思います。

ホストドメインは変わらないですが、パスが変わりましたね。

AWSマネジメントコンソール上で、S3バケットを確認すると、静的コンテンツが保存されています。
ストレージクラスはスタンダードでした。

これは、AmazonS3へ直接ユーザーがリクエストを送信しているわけではなく、Kentico(ASP.NET)が一度中継している形です。
リクエストを受信したKenticoはAmazonS3コンテンツを取得し、それを使ってレスポンスをしています。

この方法だとWebサーバー上でのトラフィックは発生しますが、非公開のバケットでもKenticoによって制御された上でアクセスすることが可能になります。

なお、この設定を有効化した後に追加されたファイルがAmazonS3で管理されるようになるため、すでにローカルファイルストレージへ保存されたファイルはこの設定を追加しても依然ローカルストレージのままで扱われます。
AmazonS3で管理したい場合はファイルの登録し直しが必要となります。

S3に直接アクセス

さらに、トラフィック自体もオフロードさせることが可能です。
この時、バケットは外部からアクセス出来る状態にしておく必要があります。

以下のような形で、メタデータは引き続きKenticoデータベースで管理されますが、コンテンツへのリクエストはKenticoは処理しません。AmazonS3が処理します。

パブリック公開可能なコンテンツであれば、Webサーバーの負荷を軽減出来る効果もあります。

またまたweb.configですが、CMSAmazonPublicAccessの設定を１行追加するだけで良いです。

web.config

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <configSections>
    <!-- Content staging BEGIN -->
    <section name="microsoft.web.services3" type="Microsoft.Web.Services3.Configuration.WebServicesConfiguration, Microsoft.Web.Services3, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
    <!-- Content staging END -->
    <!-- AjaxControlToolkit BEGIN -->
    <section name="ajaxControlToolkit" type="AjaxControlToolkit.AjaxControlToolkitConfigSection, AjaxControlToolkit" requirePermission="false" />
    <!-- AjaxControlToolkit END -->
  </configSections>
  <appSettings>
    <add key="CMSProgrammingLanguage" value="C#" />
    <add key="WS.webservice" value="http://localhost/WebService/webservice.asmx" />
    <add key="CMSTrialKey" value="CX13-HOGE-HOGE" />
    <add key="ChartImageHandler" value="storage=session;timeout=20;" />
    <add key="PageInspector:ServerCodeMappingSupport" value="Disabled" />
    <add key="ValidationSettings:UnobtrusiveValidationMode" value="None" />
    <add key="CMSApplicationGuid" value="917846d2-c191-4b29-8b7c-286ca1306c2f" />
    <add key="CMSApplicationName" value="Default Web Site/Kentico13_1" />
    <!-- Note: Changing the 'CMSHashStringSalt' value may prevent macros from resolving correctly, and break dialog links and images on your website. 
    To fix these issues, you need to globally re-sign macros in 'System -> Macros -> Signatures' or manually re-save the affected content. -->
    <add key="CMSHashStringSalt" value="bb7dee22-95a0-4e37-aa23-129884f8dd79" />
    <add key="CMSAmazonAccessKeyID" value="AAAAAAAAAAAAAAAAAAAA" />
    <add key="CMSAmazonAccessKey" value="aaaaaaaaaabbbbbbbbbbccccccccccdddddddddd" />
    <add key="CMSAmazonBucketName" value="iwasa-kentico-202107" />
    <add key="CMSAmazonPublicAccess" value="true"/>
  </appSettings>

先程、登録したファイルを確認してみましょう。

Direct Pathが変わりました。
AmazonS3を直接参照するようになっています。

また、この設定値を追加する前にAmazonS3へ登録されたファイルも、ダイレクトアクセスするパスを取得することが出来るようになります。
ですので、コンテンツの再登録は不要です。
ただし、ページに既にパスを埋め込んでいる場合はASP.NET経由での取得パスのままになっていると思いますので、ページの修正は必要になります。

注意点ですが、AmazonS3はファイル名の大文字・小文字を区別して管理しますが、Windowsはしません。
その関係で、S3連携時は全てのファイル名が登録時に小文字に置換されます。

まとめ

  • プラグインなしでweb.configに数行加えるだけですぐにAmazonS3をKenticoで使い始めることが可能。
  • 設定変更前に登録したファイルはコンテンツやページの再登録が必要な場合がある。

参考

customer-story-analytics