無料でページに高速でプライバシーを重視したコメントを設置できる「Commento++」

既存のホームページにコメント機能を追加したい時に、タグを埋め込むだけで導入でき、Markdown対応・匿名コメント・OAuthログインなど多彩な機能を備え、広告やトラッキングのないオープンソースのコメントエンジン「Commento++」が公開されています。

souramoo/commentoplusplus: Commento with out of the box patches and updates to add useful features and fixes. Also with one-click deploy to Heroku so you can get up and running fast.
https://github.com/souramoo/commentoplusplus

Commento++は、「無料でページにコメント機能を追加するオープンソースWebコメントエンジン『Comentario』、Dockerでセルフホスト可能」と同じく、オープンソースのコメントエンジン「Commento」のフォークプロジェクトで、便利な機能や修正パッチが適用されたものです。

◆元になったCommentoの基本機能
・Markdown形式に対応
見出しや強調表示、コードブロックなどの形式に対応し、リンクの埋め込みも可能。

・投票
プラスとマイナスの投票機能があり、合計得点がpointとして表示されます。

・ロールの管理
モデレーターを追加することで全体のコメントの削除権限を与えられます。

・広告なし、トラッキングなし
プライバシーを重視し個人情報を保護する設計。

◆Commento++で追加された機能
・認証方式を追加
匿名での投稿、Single Sign-Onによるカスタム認証、メールアドレスとパスワードでのユーザー登録に加え、OAuthによるソーシャルアカウント連携が追加されました。

・スパム検知の強化
Akismet・APILayer SpamCheckerのみだったスパム検知に、Perspective APIが追加され、コメントの内容に応じて行われるスパム判定が強化されました。

・コメントの自動更新
WebSocketを利用し、ページをリロードすることなく新しいコメントが表示されます。

・コメントのタイムアウトとシャドウバン
特定の投稿者の投稿を一定期間禁止したり、投稿者には見えるが他のユーザーには見えない状態にする機能が追加されました。

他、Commentoでは提供されていなかった機能の追加や細かな修正が行われています。

◆構築方法
今回はWindows 11にDocker DesktopとPythonを用意した上で、Git Bashのプロンプトを用いて構築します。Commento++用の作業フォルダを作成し移動。

mkdir commentoplusplus && cd commentoplusplus

docker-compose.ymlを作成し、以下の内容を記述します。

services:
  commento:
    image: caroga/commentoplusplus:v1.8.7
    environment:
      COMMENTO_ORIGIN: 'http://127.0.0.1:8080'
      COMMENTO_PORT: '8080'
      COMMENTO_POSTGRES: 'postgres://username:password@db:5432/commento?sslmode=disable'
      #COMMENTO_FORBID_NEW_OWNERS: 'true' # enable this after your own registration
      COMMENTO_GZIP_STATIC: 'true'
    depends_on:
      - db
    ports:
      - "8080:8080"

  db:
    image: postgres:12.5-alpine
    environment:
      POSTGRES_DB: 'commento'
      POSTGRES_USER: 'username'
      POSTGRES_PASSWORD: 'password'

コンテナが起動したら、ブラウザで「http://127.0.0.1:8080」にアクセスし、管理者アカウントを作成するため「Don't have an account yet? Sign up.」をクリック。

アカウントの作成フォームが表示されるので、「EMAIL ADDRESS」にメールアドレス、「FULL NAME」に名前、「PASSWORD」と「CONFIRM PASSWORD」にパスワードを入力し、「Sign up」をクリック。

アカウントが作成されると、ログイン画面が表示されるので、先ほど作成したメールアドレスとパスワードを入力して「Login」をクリック。

ダッシュボードが表示されます。

◆コメント欄を追加する方法
テストサイトのドメイン登録が必要なので「New Domain」をクリックし、「WEBSITE NAME」にサイトの名前、「WEBSITE DOMAIN」にサイトのドメインを入力し、「ADD DOMAIN」をクリック。

登録が完了すると、コメント欄を埋め込むためのコードが表示されるので、コピーしておきます。

次にテスト用のHTMLファイルを作成し、コメント欄を挿入したい場所に、コピーしておいたコードを挿入して保存。

<script defer src="http://127.0.0.1:8080/js/commento.js"></script>
<div id="commento"></div>

HTMLファイルを作成したフォルダでローカルサーバーを起動します。

python -m http.server 8000

ブラウザでテストページのURLにアクセスすると、Commento++で追加されたコメント欄が表示されました。

なお、公式サイトにはワンクリックでHerokuおよびRailwayにデプロイできる機能も用意されているので、サーバーを用意するのが面倒な人はそちらを利用することでさらに簡単に導入できます。