接続元IPアドレスが正しく取得できない・ログイン制限が正常に動作しない

接続元IPアドレスのグローバル変数が正しく取得できなかったり、ログの接続元IPアドレスやログイン制限が正しく動作しない場合がございます。

これはリバースプロキシやCDN、ロードバランサーなどが入っている場合に、正しい接続元IPアドレスが取得できないためになります。

対策方法

リバースプロキシなどが入っている環境でも正しく接続元IPアドレスを取得するには「config.server.php」の「TRUSTED_PROXY_LIST」に信頼できるプロキシのIPアドレスを設定ください。

複数ある場合はカンマで区切って指定します。

define('TRUSTED_PROXY_LIST', 'xxx.xxx.xxx.xxx,yyy.yyy.yyy.yyy');

これは「X-Forwarded-For」HTTPヘッダーから接続元IPアドレスを取得するときに、偽装された接続元IPアドレスを取得しないようにするための対策となっております。 (「X-Forwarded-For」は簡単に偽装できるため)

ログアウトまたは読者権限のユーザーでログインすると、組み込みJSが動作しない

ログアウトまたは読者権限のユーザーでログイン時に組み込みJSが動作しない場合は、組み込みJS自体が読み込まれていない可能性があります。

公式で配布している「develop」テーマでは投稿者以上でログインしている時のみ組み込みJSを読み込むようになっており、developテーマを元にテーマ開発を行うとログアウトまたは読者権限のユーザーでログインしている状態では組み込みJSが動作しません。

組み込みJSでは、さまざまなJSが含まれており使わない機能も多いので、パフォーマンスを考慮してログアウトまたは読者権限のユーザーでログイン時は組み込みJSを読み込まないようになっております。

修正方法

以下のように変更することで、ユーザーの権限やログイン状態に関わらず、組み込みJSを読み込むことができます。

修正ファイル: themes/ご利用テーマ/include/head/js.html

修正前

<!-- 投稿者以上以上の場合だけ組み込みJSを読み込むようにする -->
<!-- BEGIN_MODULE Touch_SessionWithContribution -->
<script src="%{JS_LIB_JQUERY_DIR}jquery-%{JS_LIB_JQUERY_DIR_VERSION}.min.js" charset="UTF-8"></script><!-- BEGIN_MODULE Js -->
<script src="/acms.js{arguments}" charset="UTF-8" id="acms-js"></script><!-- END_MODULE Js -->
<!-- END_MODULE Touch_SessionWithContribution -->

修正後

<script src="%{JS_LIB_JQUERY_DIR}jquery-%{JS_LIB_JQUERY_DIR_VERSION}.min.js" charset="UTF-8"></script><!-- BEGIN_MODULE Js -->
<script src="/acms.js{arguments}" charset="UTF-8" id="acms-js"></script><!-- END_MODULE Js -->

アップデートしたら管理画面にスタイルが当たらなくなった

アップデートしたら管理画面にスタイルが当たらなくなってしまった場合、以下の原因が考えられます。

  • 管理画面のCSSが適用されていない
  • バージョンが古いテンプレートを使用している

詳しく説明していきます。

管理画面のCSSが適用されていない

a-blog cms の管理画面のCSSは、/themes/system/css/ディレクトリに設置されています。
以下のCSSがなかった場合、正常にページが表示されない可能性があります。

  • normalize.min.css
  • acms-system.min.css
  • acms-admin.min.css

アップデート時にうまくアップロードされていなかった場合、再度アップロードし直すことで解決できます。

CSSがうまくアップロードできていなかった場合は、以下のような特徴があります。

  • 一切管理画面のスタイルが適用されておらず、HTMLのデフォルトのスタイルが適用されている
  • サイドナビゲーション項目がページの上部に表示される


バージョンが古いテンプレートを使用している

古いテンプレートを使用している場合に、正しくスタイルが適用されない可能性があります。

よくあるパターンとしましては、/admin/blog/edit.htmlなどの一部分のファイルを使用しているテーマに設置しており、一部分だけスタイルが適用されていないケースです。
Ver.1系から使用されているサイトでとくにみられるケースです。たとえばブログ管理のページで、Ver.1系の/admin/blog/edit.htmlを適用していると以下の図のような状態になります。



Ver.1系の/admin/blog/edit.htmlを適用している場合は、以下のような特徴があります。

  • ツールチップが四角の画像になっている
  • 保存、戻るボタンがページ内の下部に設置されている
  • 「基本設定」「カスタム設定」「エクスポート・インポート」などのタブがない
  • サイドナビゲーションや、トピックパスにはスタイルが適用されている

この場合の解決策としては、原因となっているテンプレートをリネームまたは削除することで解決できます。
もし何らかの理由でアップロードしている場合は、/themes/system/から新しいテンプレートを複製し、カスタマイズし直してください。

エントリー保存や特定ページで403エラーが出て保存・表示ができない

特定ページ(パスワード変更画面など)や特定の操作(エントリー保存など)で、 403エラー が出て、保存や表示ができない場合、 WAF(Web Application Firewall) が反応している可能性があります。

この場合、一度サーバーのコントロールパネルなどから、WAFを無効にして問題を切り分けてから、WAFの設定を調整していただくか、サーバー管理者にお問合せください。

WAFとは

WAFとはセキュリティ対策の一種で、Web Application Firewall(ウェブ・アプリケーション・ファイアウォール)の略です。 サイトなどのWebアプリケーションの保護に対応します。

今すぐ購入フォームを作成する

このエントリーでは、Shopping Cart 拡張アプリを使用して、今すぐ購入フォームを作成する手順を説明します。

今すぐ購入フォームとは

今すぐ購入フォームとは、カートを経由することなく商品(エントリー)を購入することができるフォームです。商品詳細ページのフォームから必要な情報を入力し、フォームを送信することで特定の商品のみを購入できます。

今すぐ購入フォームは GETモジュールである ShoppingForm_Now モジュールと、POST モジュールである ShoppingForm_ConfirmNow, ShoppingForm_SubmitNow モジュールを使用することで実装できます。

基本的には、購入フォームを作成する で作成したフォームのShoppingForm モジュールを ShoppingForm_Now モジュールへ、POSTモジュールをShoppingForm_ConfirmNow, ShoppingForm_SubmitNow モジュールに置き換えるだけで動作します。

<!-- BEGIN_MODULE ShoppingForm_Now -->
<form action="" method="post" class="js-unload_alert" enctype="multipart/form-data">
  <div class="form-btn-wrap">
    <input
      type="submit"
      name="ACMS_POST_ShoppingForm_ConfirmNow"
      value="入力内容の確認へ"
    />
  </div>
  <input type="hidden" name="quantity" value="1" />
  <input type="hidden" name="field[]" value="quantity" />
  <input type="hidden" name="takeover" value="{takeover}" />
  <input type="hidden" name="step" value="confirm" />
  <input type="hidden" name="error" value="reapply" />
  <input type="hidden" name="id" value="shoppingNowForm" />
</form>
<!-- END_MODULE ShoppingForm_Now -->
<!-- BEGIN_MODULE ShoppingForm_Now -->
<form action="" method="post" class="js-unload_alert" enctype="multipart/form-data">
  <div class="form-btn-wrap">
    <input
      type="submit"
      name="ACMS_POST_ShoppingForm_SubmitNow"
      value="注文を確定する"
    />
  </div>
  <input type="hidden" name="quantity" value="1" />
  <input type="hidden" name="field[]" value="quantity" />
  <input type="hidden" name="takeover" value="{takeover}" />
  <input type="hidden" name="step" value="confirm" />
  <input type="hidden" name="error" value="reapply" />
  <input type="hidden" name="id" value="shoppingNowForm" />
</form>
<!-- END_MODULE ShoppingForm_Now -->

今すぐ購入フォームの仕様

今すぐ購入フォームは商品(エントリー)詳細ページでのみ動作します。というのも、商品(エントリー)詳細ページのエントリーIDから注文情報を作成しているためです。購入させたい商品(エントリー)の詳細ページでないページからの購入は出来ませんのでご注意ください。

また、今すぐ購入フォームでは、購入する商品の数量を選択するフォームを作成できます。入力フィールドに name属性が quantity のフィールドをカスタムフィールドの形式で設置することで数量を選択できます。フォームに数量のフィールドを送信しなかった場合、数量はデフォルト値として0となります。

例えば、以下はセレクトタグで実装した例になります。

<select name="quantity">
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
  <option value="7">7</option>
  <option value="8">8</option>
  <option value="9">9</option>
  <option value="10">10</option>
</select>
<input type="hidden" name="field[]" value="quantity" />

今すぐ購入フォームの注文内容の金額情報を表示する

カートから購入する場合、Order_Summary モジュールを利用することで注文内容の金額情報を表示できました。今すぐ購入フォームにおいても、Order_Sumamry モジュールを利用することでその詳細ページのみの注文内容を表示できます。詳しい利用方法については、リファレンスやスニペットを参照してください。

まとめ

ShoppingCart 拡張アプリではカートを経由しない決済フォームも作成できます。カートを経由しないことで必要なステップを減らすことや、他の商品とは一緒に購入されたくないといったことを実現することが出来ます。