PowerCMS X ブログ

2024-04-09

フォームの設問の入力(選択)状態に応じて別の設問を入力必須にする

例えば下記のキャプチャのように設問「問い合わせ種類」で「その他」を選択すると、設問「問い合わせ種類詳細」を入力必須にするケースです。これは「[フォームのバリデーション・プラグインの作成](https://powercmsx.jp/about/form_validation_plugin.html)」を参考にプラグインを実装することで実現できます。(入力必須にする、というよりは入力必須状態を作り出す、と言う方が正しいでしょうか。) 画面キャプチャ:サンプルのフォーム。設問「問い合わせ種類」で「その他」にし、設問「問い合わせ種類詳細」を空で送信したのでエラーになっている。 ## 設問の準備 以下のように設問を準備します。
設問 ベースネーム 設問タイプ その他設定
問い合わせ種類 contact_type ラジオボタン 必須にチェック
問い合わせ種類詳細 contact_type_etc_content テキスト なし
## プラグインの作成 設問「問い合わせ種類詳細」に対してカスタムバリデーションを作成します。まずconfig.jsonに定義を記述します。ここは概ねドキュメント通りで、プロジェクトに応じて適宜ラベル・メソッド名等変更してください。ポイントは`force: true`を指定することです。`force`の設定により、値がない場合でも強制的にバリデーションを実行することができます。(値がない場合、通常は必須チェック以外のバリデーションは実行の必要がないからだと思います。)
{
    "label": "ALFCustomValidation",
    "id": "alfcustomvalidation",
    "component": "ALFCustomValidation",
    "version": "1.0",
    "author": "Alfasado Inc.",
    "author_link": "https://alfasado.net/",
    "description": "Provide custom form validation.",
    "form_validations": {
        "custom_validation": {
            "component": "ALFCustomValidation",
            "label": "Sample Validation",
            "method": "contactTypeValidation",
            "force": true
        }
    }
}
プラグインのコードは特に難しくありません。2つの設問の入力値を取得し、「問い合わせ種類」が「その他」の場合かつ「問い合わせ種類詳細」が未入力の場合に`$error_msg`にメッセージをセットして`false`を返しています。
<?php

require_once LIB_DIR . 'Prototype' . DS . 'class.PTPlugin.php';
class ALFCustomValidation extends PTPlugin { public function __construct() { parent::__construct(); }
public function contactTypeValidation($app, $question, $value, &$error_msg): bool { // 設問「問い合わせ種類」の値を取得 $type = $app->param('question_contact_type');
// 入力値をチェック if ($type === 'その他') { if (!$value) { $error_msg = '問い合わせ種類詳細を入力してください'; return false; } }
return true; } }
プラグインの作成後、設問「問い合わせ種類詳細」のバリデーションをプラグインで実装したバリデーション(config.jsonの`label`に記述したラベルのもの。この例だとSample Validation)に変更してください。必須にはチェックを入れません。 画面キャプチャ:設問「問い合わせ種類詳細」の編集画面。バリデーションにSample Validationを選択している。 ## まとめ ここまでの内容でCMS(サーバーサイド)の実装は完了です。「その他」を選択した時だけ設問「問い合わせ種類詳細」を表示する・`required`属性を設定する等はJavaScriptでDOMを操作してください。バリデーションプラグインを上手く活用し、送信する人・受け取る人ともに不便を感じることのない分かりやすいフォームを作成して頂ければと思います。 ※初稿の時点では「エラーメッセージを表示する位置を変える」操作をご紹介しましたが、`force`指定により設問「問い合わせ種類詳細」に対してバリデーションが設定できるようになったため不要となりました。

カテゴリー:技術情報

投稿者:安倍

2024-04-05

Typoless (タイポレス) APIをPHPから利用する

Typoless (タイポレス) 別ウィンドウで開きますとは、朝日新聞社が提供する校正支援サービスです。新聞社のノウハウを最先端のAIで実現した新しい校正支援サービスとのことで、PowerCMS Xで校正支援機能を提供している 別ウィンドウで開きますこともあって、その存在には注目していました。

Typolessウェブサイトのスクリーンショット

今年から APIプランの提供が始まっていたこともあり、少し触ってみました。ユーザー登録画面 別ウィンドウで開きますから「API連携プランではじめる」を選択して登録すると、14日間無料(上限は20万文字)で試すことができます。API仕様書は以下にあります。校正 API、カスタム辞書編集 APIが利用できます。

校正 API ( proofread )

<?php
$endPoint = 'https://typoless.asahi.com/web-api/proofread';
$APIKey = 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'; // APIキー
$customDictId = 'ABCDEFGH-1234-5678-9IJK-LMNOPQRST'; // カスタム辞書ID
$text = 'Typoless APIのテストてす。満点の星空'; 
$requestBody = ['text' => $text, // 校正したいテキスト
                           'includeRevisedText' => true, // 校正済み文章の取得フラグ(初期値false)
                           'disableTye' => false, // TyE(AIによる校正)の無効化(初期値false)
                           'disableAsahiDict' => false, // 朝日辞書の無効化(初期値false)
                           'disableCustomDict' => false, // カスタム辞書の無効化(未指定の場合、isDefault=trueの辞書を使用する。)
                          ];
if ( $customDictId ) {
    $requestBody['customDictId'] = $customDictId; // カスタム辞書のID
}
$content = json_encode( $requestBody );
$headers = ["Content-type: application/json", "X-Api-Key: {$APIKey}"];
$curl = curl_init( $endPoint );
curl_setopt( $curl, CURLOPT_POST, true );
curl_setopt( $curl, CURLOPT_HTTPHEADER, $headers );
curl_setopt( $curl, CURLOPT_POSTFIELDS, $content );
curl_setopt( $curl, CURLOPT_RETURNTRANSFER, true );
$json = curl_exec( $curl );
var_dump( json_decode( $json, true ) );

取得結果は以下の通りです。scoreは範囲は0~1、値が大きいほど自信度が高い、checkTypeが"tye"の場合のみ付与されるとのこと。注意点としては、candidatesは配列になっています(複数の変換候補があるケースのため)。

array(3) {
  ["results"]=>
  array(3) {
    [0]=>
    array(3) {
      ["checkType"]=>
      string(3) "tye"
      ["correction"]=>
      array(4) {
        ["position"]=>
        array(2) {
          ["start"]=>
          int(16)
          ["end"]=>
          int(17)
        }
        ["originalText"]=>
        string(3) "て"
        ["candidates"]=>
        array(1) {
          [0]=>
          string(3) "で"
        }
        ["score"]=>
        float(0.7267)
      }
      ["comment"]=>
      string(10) "て => で"
    }
    [1]=>
    array(3) {
      ["checkType"]=>
      string(10) "asahi_dict"
      ["correction"]=>
      array(3) {
        ["position"]=>
        array(2) {
          ["start"]=>
          int(19)
          ["end"]=>
          int(24)
        }
        ["originalText"]=>
        string(15) "満点の星空"
        ["candidates"]=>
        array(1) {
          [0]=>
          string(12) "満天の星"
        }
      }
      ["comment"]=>
      string(129) "満点の星空 => 満天の星
[誤字・誤用]満点→満天
「満天の星空」は重言。「満天の星」が適切"
    }
    [2]=>
    array(3) {
      ["checkType"]=>
      string(3) "tye"
      ["correction"]=>
      array(4) {
        ["position"]=>
        array(2) {
          ["start"]=>
          int(23)
          ["end"]=>
          int(24)
        }
        ["originalText"]=>
        string(3) "空"
        ["candidates"]=>
        array(1) {
          [0]=>
          string(3) "。"
        }
        ["score"]=>
        float(0.9957)
      }
      ["comment"]=>
      string(10) "空 => 。"
    }
  }
  ["message"]=>
  string(7) "success"
  ["revisedText"]=>
  string(45) "Typoless APIのテストです。満天の星"
}

※ revisedTextに最後の「。」が無いのは不具合?

修正箇所の修正位置(開始・終了)が含まれているので、これを利用して修正を自動化することもできます。ただ、修正前のテキストと修正後のテキストの文字数が同じであるとは限らないため、少し面倒です。

以下は PowerCMS Xでの修正の適用コード。

<?php
require_once( 'class.Prototype.php' );
$app = new Prototype();
$text = $app->param( 'text' );
$corrections = $app->param( 'corrections' );
$pos = 0;
foreach ( $corrections as $idx => $correction ) {
    $correction = json_decode( $correction, true );
    $original = $correction['originalText'];
    $apply = $correction['candidates'][0];
    $correction['candidates'] = $apply;
    if ( $pos !== 0 ) {
        $position = $correction['position'];
        $position['start'] = $position['start'] + $pos;
        $position['end'] = $position['end'] + $pos;
        $correction['position'] = $position;
    }
    $corrections[ $idx ] = $correction;
    $calc = mb_strlen( $apply ) - mb_strlen( $original );
    $pos += $calc;
}
foreach ( $corrections as $correction ) {
    $position = $correction['position'];
    $apply = $correction['candidates'];
    $length = $position['end'] - $position['start'];
    $pre = mb_substr( $text, 0, $position['start'] );
    $after = mb_substr( $text, $position['end'] );
    $text = $pre . $apply . $after;
}
header( 'Content-type: application/json' );
echo json_encode( ['result' => $text ] );
exit();

そのほかに、カスタム辞書(ルール)を追加したり更新したりすることもできます。PowerCMS Xのユーザー辞書と連動するなどの開発もできるかもしれません。

こうなったらいいなのメモ

  • HTMLのタグ混じりの文章をそのまま渡すことができると嬉しい。
  • もうすこし長い範囲で修正前後を拾ってくれると楽かもしれない「て」=>「で」とかだと単純な置換では済まないので(「テストてす」=>「テストです」のように)。
  • 辞書のルール取得や更新のエンドポイントが「/dictionaries/${辞書ID}/rules/${ルールID}」(ルールIDは数字ではなくUUIDのような文字列)なのですが、patternで指定できるか、検索エンドポイントがあるとありがたい。
  • エクスポートした辞書のCSVにルールIDが含まれていると連携して使う場合に便利。
  • 辞書のルール取得APIで件数が増えた時、LIMIT/OFFSETが指定できると良いかもしれない。
  • 「アクセシビリティー」「セキュリティー」など、最後に「ー」が付く形で統一されているようですが、これは、どちらのルールかを選択できると良いように思いました。
  • 利用状況(辞書へのルール登録数、上限まであと何個登録できるか)、月間利用文字数などがわかると良い(※)。

※ APIプランの価格設定的に、ウェブサービスなどの事業者も想定ユーザーになると思うのですが、その場合は利用状況などのデータが取れるとサービスを企画しやすいかもしれません。一方、WEBアプリケーションプランは月額2,200円〜とお手軽価格で APIプランと同じく14日間無料で試せますので、興味のある方はぜひお試しください 別ウィンドウで開きます

カテゴリー:技術情報

投稿者:Junnama Noda

2024-04-02

サイトのドメインを変更する方法

既存サイトのリニューアルに合わせてCMSをリプレイスする際には、開発環境に新しいCMSの導入し、リニューアルするデザインやサイト構成に合わせてデータ移行をします。移行後のコンテンツ確認までは開発環境に付与したドメイン(URL)にアクセスして行うことが多いかと思いますが、リリースの前に本番のドメイン(URL)に変更する必要があります。

本記事では、PowerCMS X でのドメインの変更方法をまとめてみました。

PowerCMS X のドメイン管理

PowerCMS X では、記事や画像などのアセットなど、CMSで管理しているオブジェクトのURLは全てDBで管理しています。下記のスキーマがドメイン情報を持つ対象となり、それらのオブジェクトに含まれるURLを本番のドメインに変更することになります。

  • スペース設定:「サイトURL」と「リンクURL」カラムにドメイン情報が含まれます(CMS環境と公開環境のドメインが別の場合は、公開環境のURLを「リンクURL」指定します)
  • URL:「URL」と「ディレクトリ」カラムにドメイン情報が含まれます

ドメインの変更方法

tools ディレクトリ配下に用意されているスクリプトを実行することで、上記オブジェクトに含まれるドメインが一括で置換されます。以下にスクリプトの実行例を記載します。

sudo -u apache php ./tools/replaceURL.php --workspace_id 1 --old_url 'https://old.powercmsx.jp/' --site_url 'https://foo.powercmsx.jp/' --link_url 'https://bar.powercmsx.jp/' 

以下、引数の説明です。

  • workspace_id:ドメインを変更する対象のワークスペースIDを指定します
  • old_url:変更前の「サイトURL」を指定します
  • site_url:変更後の「サイトURL」を指定します
  • link_url:変更後の「リンクURL」を指定します

ドメイン変更後の確認

スペース設定の確認

対象のスペース設定画面に遷移し、「サイトURL」及び「リンクURL」が変更されていることを確認します。

スペース設定画面のキャプチャ

スペース設定画面のキャプチャ

URLオブジェクトの確認

対象スペースのURL一覧画面からURLオブジェクトを確認し、「URL」と「ディレクトリ」カラムのドメインが変更されていることを確認します。コンテンツを静的ファイルとして公開している場合は、再構築を行った後、ブラウザから本番のドメインにアクセスしコンテンツを確認します。

URL一覧画面のキャプチャ

最後に

本手順で利用しているスクリプトについては、ver.3.532以降で同梱されています。ご覧いただいたように一括でドメインの変更ができるようになっていますので、サイトリリースの際などにドメインの変更を予定されている方は、是非ご利用ください。

カテゴリー:技術情報

投稿者:miura

ブログ内検索

アーカイブ