Tips

tips

自分が投稿したエントリーにだけ非公開コメントが表示されてしまう問題

このエントリーは「a-blog cms Advent Calendar 2024」の8日目の記事です。

はじめまして!香川県のWeb制作会社に勤務しております、柴田と申します。
弊社ではa-blog cmsを導入している案件が数多くあり、私自身は現在ディレクターですが制作上がりということもあり、軽微なカスタマイズや修正に関しては自身で対応しております。

そして弊社では社内報サイトの運用を多く抱えており、そのほとんどにa-blog cmsを採用しております。
通常のコーポレートサイト制作などでは普段目にしない、ユニークなa-blog cmsの利用やカスタマイズを行っており、楽しさ反面、対応も大変…といった日々を過ごしています。

この記事ではそのような日々の中で出会ったa-blog cmsのコメント機能について、事例を交えてご紹介したいと思います。
どなたかのご参考になれば、これ幸いです。

はじめに

例えばこのようなケース

Web社内報は主に社内の広報担当の方が運営することが多いです。
社員数の多い会社にもなると、個々人に好き勝手に記事を投稿されると、中には不適切な内容であったり、誤った情報を掲載してしまう場合があります。そのようなことから、一旦社員(投稿者)が書いたエントリーを広報担当(承認担当者)が精査したい、というニーズが生まれます。

承認フロー

  1. 投稿者がエントリーを新規作成
  2. 承認担当者に確認してもらうためのバージョンを作成
  3. 確認画面から承認担当者へ連絡(承認依頼)
  4. 承認担当者、管理ページ内「承認通知」から承認依頼を確認
  5. 問題がなければ確認バージョンを公開、または上位の承認担当者へ承認依頼。問題があれば確認画面から投稿者へ連絡(承認却下)
  6. 承認却下だった場合、投稿者は修正を行い、再度承認担当者に確認してもらうためのバージョンを作成
  7. 以下3〜5の繰り返し

詳しくは公式ホームページのこちらをご覧ください。

ほんだい

さて、本題です。
承認機能はエントリーだけではなく、コメント機能にも存在していることはご存知ですか?

コメント機能は社員同士のコミュニケーションを図る社内報サイトには、ぜひ導入したい機能。
一方で先述した、不適切な内容や同一内容の多重送信といった問題を抱えてもいます。そこで承認機能です。

a-blog cmsではコメント受信時の初期状態を「承認待ち」「公開」「非公開」のどの状態になるかを選択可能です。
つまり初期状態を「承認待ち」にしておき、承認担当者の裁量で「公開」「非公開」を判断可能になり、健全な社内報運営が可能になります。

またブラックリスト機能も存在し、あらかじめコメント機能に対するNGワードを設定しておき、この機能で登録した語句を含む内容はコメントとして投稿できないようになります。

問題発生

しかし、ここで一つ問題が発生しました。
下記は実際の実装コードなのですが、どのような問題が発生したか予想がつく方はいますか…?

<!-- BEGIN_MODULE hogeCommentBody -->
<!-- BEGIN list:veil -->
<div class="comment-list">
<!-- BEGIN comment:loop -->
<!-- BEGIN comment:veil -->
<!-- BEGIN body:veil -->
  <div class="comment-item {status}" id="comment-{cmid}">
    <div class="avatar">
      <!-- BEGIN_IF [{posterIcon}/nem] -->
      <img src="%{ARCHIVES_DIR}{posterIcon}" alt="" width="60" height="60">
      <!-- ELSE -->
      <img src="/images/comment_avatar.png" alt="" width="60" height="60">
      <!-- END_IF -->
    </div>
    <div class="body">
      <div class="meta">
        <time datetime="{date#Y}-{date#m}-{date#d}" pubdate>{date#Y}年{date#m}月{date#d}日 {date#H}:{date#i}</time>
        <span class="poster">{posterName}さん</span>
      </div>
      <div class="content">{body}[nl2br|url2link]<!-- BEGIN awaiting#body -->このコメントは掲載待ちです。<!-- END awaiting#body --></div>
      <!-- BEGIN_MODULE Touch_SessionWithAdministration -->
      <!-- BEGIN adminCommentAction:veil -->
      <div class="edit">
        <form action="{target}" method="post" class="acms-admin-form">
          <input type="submit" name="ACMS_POST_Comment_Edit" value="編集する" class="acms-admin-btn-flat" />
          <!-- BEGIN status#open --><input type="submit" name="ACMS_POST_Comment_Status_Open" value="<!--T-->公開する<!--/T-->" class="acms-admin-btn-flat" /><!-- END status#open --><!-- BEGIN status#close -->
          <input type="submit" name="ACMS_POST_Comment_Status_Close" value="<!--T-->非公開にする<!--/T-->" class="acms-admin-btn-flat" /><!-- END status#close --><!-- BEGIN status#awaiting -->
          <input type="submit" name="ACMS_POST_Comment_Status_Awaiting" value="<!--T-->掲載待ちにする<!--/T-->" class="acms-admin-btn-flat" /><!-- END status#awaiting -->
        </form>
      </div>
      <!-- END adminCommentAction:veil -->
      <!-- END_MODULE Touch_SessionWithAdministration -->
    </div>
  </div>
<!-- END body:veil -->
<!-- END comment:veil -->
<!-- END comment:loop -->
</div>
<!-- END list:veil -->
<!-- END_MODULE hogeCommentBody -->

問題の詳細

管理者権限のない一般ユーザーに非公開コメントが表示される現象が発生。
しかし、非公開のコメントが見えるのは自分が投稿したエントリーのみで、他人が投稿したエントリーの非公開のコメントは見えない

という問題が発生したのです…。
他人が投稿したエントリーの非公開のコメントは見えず、自分が投稿したエントリーのみ非公開のコメントが見えてしまう、という現象です。自分で投稿したエントリーでのみ発生する現象なので、なかなか問題の発生に気づきづらいケースでした。

コメントの構造

まずは状況を整理するために、改めてコメントの構造についておさらいしましょう。

<div class="comment-item {status}" id="comment-{cmid}">
  • {status}:コメントの状態(open, awaiting, close など)。見た目や動作を状態ごとに制御可能。
  • {cmid}:コメントID。

アバター表示

<img src="%{ARCHIVES_DIR}{posterIcon}" alt="" width="60" height="60">
  • 投稿者がアイコンを設定している場合はその画像を表示({posterIcon})。
  • アイコンが未設定の場合、デフォルトの画像 /images/comment_avatar.png を表示。

メタ情報

<time datetime="{date#Y}-{date#m}-{date#d}" pubdate>{date#Y}年{date#m}月{date#d}日 {date#H}:{date#i}</time>
<span class="poster">{posterName}さん</span>
  • コメントの投稿日時と投稿者の名前を表示。

コメント内容

<div class="content">{body}[nl2br|url2link]</div>

{body}:コメント本文が表示される。
[nl2br|url2link]:改行を <br> に変換し、URL を自動的にリンクに変換する処理。

コメントが「掲載待ち」の場合

<!-- BEGIN awaiting#body -->このコメントは掲載待ちです。<!-- END awaiting#body -->
  • 状態が awaiting(承認待ち)の場合、このメッセージを表示。

管理者向けのアクション

<!-- BEGIN_MODULE Touch_SessionWithAdministration -->
<!-- BEGIN adminCommentAction:veil -->

ログイン中の管理者には、以下のボタンが表示されます。

  • 編集する:コメントを編集する。
  • 公開する:コメントの状態を open に変更。
  • 非公開にする:コメントの状態を close に変更。
  • 掲載待ちにする:コメントの状態を awaiting に変更。

さて、どこを改善すればよいのでしょうか?🤔

問題解決

結論から言うと、下記のようにコードを改善しました。

<!-- BEGIN_MODULE hogeCommentBody -->
<!-- BEGIN list:veil -->
<div class="comment-list">
<!-- BEGIN comment:loop -->
<!-- BEGIN comment:veil -->
<!-- BEGIN_IF [{status}/neq/close/_or_/%{SESSION_USER_AUTH}/eq/administrator] -->
<!-- BEGIN body:veil -->
  <div class="comment-item {status}" id="comment-{cmid}">
    <div class="avatar">
      <!-- BEGIN_IF [{posterIcon}/nem] -->
      <img src="%{ARCHIVES_DIR}{posterIcon}" alt="" width="60" height="60">
      <!-- ELSE -->
      <img src="/images/comment_avatar.png" alt="" width="60" height="60">
      <!-- END_IF -->
    </div>
    <div class="body">
      <div class="meta">
        <time datetime="{date#Y}-{date#m}-{date#d}" pubdate>{date#Y}年{date#m}月{date#d}日 {date#H}:{date#i}</time>
        <span class="poster">{posterName}さん</span>
      </div>
      <div class="content">{body}[nl2br|url2link]<!-- BEGIN awaiting#body -->このコメントは掲載待ちです。<!-- END awaiting#body --></div>
      <!-- BEGIN_MODULE Touch_SessionWithAdministration -->
      <!-- BEGIN adminCommentAction:veil -->
      <div class="edit">
        <form action="{target}" method="post" class="acms-admin-form">
          <input type="submit" name="ACMS_POST_Comment_Edit" value="編集する" class="acms-admin-btn-flat" />
          <!-- BEGIN status#open --><input type="submit" name="ACMS_POST_Comment_Status_Open" value="<!--T-->公開する<!--/T-->" class="acms-admin-btn-flat" /><!-- END status#open --><!-- BEGIN status#close -->
          <input type="submit" name="ACMS_POST_Comment_Status_Close" value="<!--T-->非公開にする<!--/T-->" class="acms-admin-btn-flat" /><!-- END status#close --><!-- BEGIN status#awaiting -->
          <input type="submit" name="ACMS_POST_Comment_Status_Awaiting" value="<!--T-->掲載待ちにする<!--/T-->" class="acms-admin-btn-flat" /><!-- END status#awaiting -->
        </form>
      </div>
      <!-- END adminCommentAction:veil -->
      <!-- END_MODULE Touch_SessionWithAdministration -->
    </div>
  </div>
<!-- END body:veil -->
<!-- END_IF -->
<!-- END comment:veil -->
<!-- END comment:loop -->
</div>
<!-- END list:veil -->
<!-- END_MODULE hogeCommentBody -->

具体的には6行目と37行目にそれぞれ下記コードを追加しました。

<!-- BEGIN_IF [{status}/neq/close/_or_/%{SESSION_USER_AUTH}/eq/administrator] -->
<!-- END_IF -->

{status}open(公開)、close(非公開)、awaiting(未承認)
{SESSION_USER_AUTH}ログイン中のユーザーの権限を示す文字列(administrator(管理者), editor(編集者), contributor(投稿者), subscriber(読者))を出力する

解説

[{status}/neq/close]
  • {status} が close(非公開)でない場合に、この条件は真になります。
%{SESSION_USER_AUTH}/eq/administrator
  • 現在のセッションユーザーの権限(%{SESSION_USER_AUTH})が administrator(管理者)である場合に、この条件は真になります。
  • 管理者であれば、コメントの状態が close でも表示可能です。

つまりコメントが非公開の場合は表示しないが、管理者としてログインしている場合、管理者に対してだけは非公開コメントを表示するという記述になります。ロジックを見ると構築時に必ず必要な記述に思えますが、問題の発生に気づくケースが中々レアなケースなので盲点でした。

おわりに

答えが分かってしまえば盲点というか、そういえばそうだよな!設定必要だよな~😂
と思ったりもして、a-blog cmsは奥が深いです。

また今回は自分が投稿したエントリーについた非公開コメントを表示しない対応に留まりましたが、例えば管理者にのみコメントの状態(ステータス)をラベルで表示したりなどのカスタマイズもできるので、a-blog cmsは本当に工夫次第で色々なことが実現可能だな~と改めて感じた機会でもありました。

初心者向けの内容で大変恐縮ですが、「a-blog cms Advent Calendar 2024」の8日目の記事でした!
a-blog cms用にブログサイトを立ち上げたので、四方山話的に普段の業務で遭遇した事例など、色々更新していきたいと思います。

参考ページ

スペシャルサンクス

間違った情報があればご指摘いただければと思います。
またこの件はアップルップルの山本一道さんにご助力いただきました!
その説はありがとうございました。m(_ _)m