概要
VoltoというReactベースのPlone用(厳密には他でも使える)のSPA実装がある。
以下を参照
Volto というPloneのReactによるフロントエンド実装のインストール方法
手元で簡単に試すために、以下を準備した。
- VoltoのDockerイメージ
- docker-composeファイル
- 起動に必要なcfgファイル
準備した物
VoltoのDockerイメージ
docker hub に volto-demo
イメージをアップした
docker-composeファイル
- Ploneは公式に公開されているイメージを使う。
- Voltoは上記のイメージを使う
docker-compose.yml
plone:
image: plone/plone:5.2.2
volumes:
- ./plone-data/filestorage:/data/filestorage
- ./plone-data/blobstorage:/data/blobstorage
- ./plone-data/src/:/plone/instance/src/
- ./custom.cfg:/plone/instance/custom.cfg
ports:
- "8080:8080"
environment:
ZCML: /plone/instance/custom.cfg
volto:
image: terapyon/volto-demo
ports:
- "3000:3000"
- "3001:3001"
起動に必要なcfgファイル
custom.cfg
[buildout]
extends = buildout.cfg
develop +=
[instance]
eggs +=
Plone
Pillow
plone.restapi
zcml-additional =
<configure xmlns="http://namespaces.zope.org/zope"
xmlns:plone="http://namespaces.plone.org/plone">
<plone:CORSPolicy
allow_origin="http://localhost:3000,http://127.0.0.1:3000"
allow_methods="DELETE,GET,OPTIONS,PATCH,POST,PUT"
allow_credentials="true"
expose_headers="Content-Length,X-My-Header"
allow_headers="Accept,Authorization,Content-Type,X-Custom-Header"
max_age="3600"
/>
</configure>
起動方法
ファイルの設置
適当なフォルダに、上記に書いた2ファイルを置く
- docker-compose.yml
- custom.cfg
起動コマンド
$ docker-compose up
起動後の作業
重要 以下2つの作業
Ploneインスタンスを作る
ブラウザで、 http://localhost:8080
に行き、Ploneインスタンスを作る。
ユーザ名: admin / パスワード: admin
その際に必ず、 Plone
というIDで作る必要がある。
(Voltoが接続する先が、 http://localhost:8080/Plone
となっているため。(変更には、Voltoの起動コマンドを変更する必要がある。)
plone.restapiを有効化
Ploneの管理画面のアドオンで、 plone.restapi
を有効化
以下で動作確認可能
- Ploneへのアクセス: http://localhost:8080/Plone
- Voltoへのアクセス: http://localhost:3000
データファイル
カレントディレクトリの、 plone-data
以下にPloneのデータが保存される。
TODO
- このままだと、Voltoのカスタマイズができないので、カスタマイズ用のフォルダをボリュームとしてマウントするように変更する
更新情報
- Voltoのバージョンを 8.9.2 のDocker Imageをアップした (2020年11月11日 )
- Plone5.2.2 が使われるようにバージョンの書き換えを行った (2020年11月11日 )