Concrete CMS開発環境をローカルに作っていますⅣ

開発・テスト環境のバージョンアップをしたかったのですが、その前に見直しを行ないました。
  その上で、備忘録的に記載したいと思います。

それは、
｛CCM:BASE_URL}と、
Hostingのpublic_htmlは曲者？Local環境への移行時注意です。

  今回はLocal環境へ本環境データのデプロイ時の注意事項と、
今後のConcrete CMSへ望みたいことを書きます。

　まずは望みたいことを先に、それは｛CCM:BASE_URL}の拡大展開です。

　理由は、concrete5 v5.6.0.2の頃（実は v5.6.0.2のサイトも持っています。）既に、
<a href="｛CCM:BASE_URL}/で一部実装されているものの
v8.5.7時点でも、全部ではないし、
’<a href="’以外では適用されていない。

　適用されれば、httpから始まるドメインを記述しなくて済むだけではなく、ドメイン変更やサーバ移管等の事態が起きても、ソースコードの修正が必要無いので、非常に便利だからです。
　ほかにも有利な点がある。

　また、、Hostingのpublic_htmlは曲者？Local環境への移行時は要注意ということです。

　（備忘録に対象として欲しい範囲を詳細に記載しています。）

新しいConcrete CMSの開発環境をローカル環境に構築しています。Ⅰ

目次に進む

新しいConcreteCMSの開発環境をローカル環境に構築しています。 本来なら「手動で管理画面からアップデートする」
手動で、次の手順で本環境をバージョンアップする方が簡単なのですが・・・・・
1. 最新バージョンをダウンロードページから入手します。
　 (concrete-cms-9.0.2.zip）
2. zipファイルを解凍します。 （concrete-cms-9.0.2）
アップデートに必要なのは、配下の concreteフォルダのみです。
３．・・・・・ a-itc.info

Concrete CMSの開発環境をローカル環境に構築しています。Ⅱ

目次に進む

ConcreteCMSの開発環境をローカル環境に構築2 今回もまた、前準備です。
前回、本環境でエクスポート（バックアップ）したものを
開発・テスト環境にインポート（リストア）しようとして
うまく行かなかったので、
今回は、本環境を
先にVersion８の最新（v8.5.7）にアップデートします。
　（現在の本環境は、v8.5.6です。）
その後、本環境のエクスポートデータを
開発・テスト環境のv8.5.7にインポート し… a-itc.info

Concrete CMSの開発環境をローカル環境に構築しています。Ⅲ

目次に進む

Concrete CMS開発環境をローカルに構築Ⅲ Concrete CMS開発環境をローカルにデプロイ
本環境をv8.5.7にバージョンアップ後、
本環境の構成・データを開発・テスト環境にデプロイするために、
　(データベース・テーブルや記事、画像などのファイルを配置）
開発・テスト環境は、
MAMP 4.2.0環境（PHP 7.4.1、MySQL 5.7.24）に
concrete5 v8.5.7を新規インストール… a-itc.info

バージョンアップ前に、開発・テスト環境の各ページをブラウズしているときに気付きました。

それは、「Concrete CMS開発環境をローカルに構築Ⅲ」のままだと、正常に表示されないものがあるということ

トップページのスライダに画像

下の画像は、（表示タイミングの違いで、本来のスライダ画像の上に表示させているText文が異なりますが）上段がスライダ画像未表示分、下段がスライダ画像表示分です。

上段：開発・テスト環境（途中）／　下段：本環境
（ブラウザを変えて、上下に並べてキャプチャしました。）

スライダ画像未表示分の左上、□で囲んだ部分を拡大して見ると、

slideの文字が見えます。これは画像に指定したalt="slide"の部分であることが分かりました。
　この状態で、開発ツールで確認すると、
GET http://localhost/application/files/1916/1121/2137/a010-1152-648-316-1960.png 404 (Not Found) localhost/:158
GET http://localhost/application/files/7616/1121/2141/a020-1152-648-304-1660.png 404 (Not Found) localhost/:170
GET http://localhost/application/files/1916/1121/2148/a031-1152-648-228-1060.png 404 (Not Found) localhost/:182
GET http://localhost/application/files/7916/1121/2159/a032-1152-648-212-1250.png 404 (Not Found) localhost/:194
GET http://localhost/application/files/2716/1121/2168/a040-1152-648-224-1070.png 404 (Not Found) localhost/:207
GET http://localhost/application/files/9816/1121/2177/a051-1152-648-212-1260.png 404 (Not Found) localhost/:220
GET http://localhost/application/files/7316/1121/2186/a052-1152-648-276-1500.png 404 (Not Found) localhost/:231
GET http://localhost/application/files/8116/1121/2193/a060-1152-648-252-1550.png 404 (Not Found) localhost/:244
GET http://localhost/application/files/8416/1121/2199/a070-1152-648-252-1330.png 404 (Not Found) localhost/:256
GET http://localhost/application/files/1216/1121/2206/a080-1152-648-224-1190..png 404 (Not Found) localhost/:269
GET http://localhost/application/files/8916/1121/2213/a090-1152-648-124-0620.png 404 (Not Found) localhost/:281
GET http://localhost/application/files/9516/1121/2224/a100-1152-648-148-0704.png 404 (Not Found) localhost/:293
GET http://localhost/application/files/7516/1121/2130/a110-1152-648-136-0980.png 404 (Not Found) base.js:6330
　と、404 (Not Found)画像が見つからないエラーが13件起きていました。

13件、これはTopページの画像スライダの背景画像の枚数です。

　そして、よく観察して見ると、画像格納先のパスがおかしい？（http://localhost/application/files/）

何故かと思い、本環境でエクスポートして、開発テスト環境にインポートする前にパスを置き換えたはず・・・だとaitc_cf840.sqlファイルを確認して見ると、

INSERT INTO `CollectionVersionBlocksOutputCache` (`cID`, `cvID`, `bID`, `arHandle`, `btCachedBlockOutput`, `btCachedBlockOutputExpires`) VALUES

(1, 291, 6098, 'Hero Area', '･･ 前略 ･･<img src="/application/files/1916/1121/2137/a010-1152-648-316-1960.png" alt="slide" width="1152" height="648"> ･･ 中略 ･･href="http://localhost/Concrete8.5.7/blog/google-190612" class="mega-link-overlay"></a>･･･････<img src="/application/files/7916/1121/2159/a032-1152-648-212-1250.png" alt="slide" width="1152" height="648">･･ 後略 ･････となっている。

上の画像は、置き換え前の本環境でエクスポートした状態のaitc_cf840.sqlの一部、画像のパスは、<source srcset=https://a-itc.info/application/files/8315/7171/8139/guideline-128-128-040.png” media=”･･･などのアンダーライン部分

Localの画像格納先は、C:\MAMP\htdocs\concrete8.5.7\application\filesなので、

置き換え前のaitc_cf840.sqlファイルを確認すると、

<img src="/application/files/1916/1121/2137/a010-1152-648-316-1960.png" alt="slide" width="1152" height="648">となっている為、/application の上位パスは存在しない。

HostingがXSERVERの場合の
CMS管理は・・・・・・・“a-itc.info>public_html>concrete>”、
パッケージ管理は、・・・“a-itc.info>public_html>pacckages>”、
アプリケーション管理は、“a-itc.info>public_html>application>”、
となっており、
　いずれもpublic_htmlを介してDomainとの接続が行われている様だ
　（それ故に、.sql上の接続も/application の上位パスは存在しなくても良い様だ。）。

　しかしながら、Localでは、ここでもその様なわけにも行かず不具合となってしまう。
ここの解消（原因究明と対処）にも手間取った後述^※注

（Hostingのpublic_htmlの件は、ConcreteCMSに限った訳でもなく、
WordPressのサイトでも同様に、
Domain>public_html>wp-admin、
Domain>public_html>wp-content、
Domain>public_html>wp-includes、となっています。）

ブログページのエラー

INSERT INTO `btImageSliderEntries` (`id`, `bID`, `cID`, `fID`, `linkURL`, `internalLinkCID`, `title`, `description`, `sortOrder`) VALUES (1909, 6020, 0, 2238, 'https://a-itc.info/blog/web20181207', 0, '',･･･後略

などは、エラーが判明した後から、

INSERT INTO `btImageSliderEntries` (`id`, `bID`, `cID`, `fID`, `linkURL`, `internalLinkCID`, `title`, `description`, `sortOrder`) VALUES(1909, 6020, 0, 2238, 'http://localhost/concrete8.5.7/blog/web20181207', 0, '',･･･後略

で置き換え、テーブルを空（TRUNCATE）にして改めてINSERT INTOし直しました。

⇑　上の画像は”btImageSliderEntries”のものではありません（キャプチャを忘れた為、代用です。）
そしてこれは、phpMyAdiminのデータベース>特定のテーブルを選んで「空にする」ボタンでのイメージです。

実際の操作は対象テーブルも１つだけでない上に、データの追加（Insert Into）も同じタイミングで行う為.sqlで、以下の様に実行します。

-- 挿入前にテーブルを空にする `btImageSliderEntries`
TRUNCATE TABLE `btImageSliderEntries`;

INSERT INTO `btImageSliderEntries` (`id`, `bID`, `cID`, `fID`, `linkURL`, `internalLinkCID`, `title`, `description`, `sortOrder`) VALUES　(・・・・・・・・・・・），

 

Contactページの404 NotFoundエラー

404 Errorの原因は、

INSERT INTO `btImageSliderEntries` (`id`, `bID`, `cID`, `fID`, `linkURL`, `internalLinkCID`, `title`, `description`, `sortOrder`) VALUES
（,,,,,'https://a-itc.info/contact'　の様な場合、
‘http://localhost/contactと置き換えてしまい。エラーが判明して初めて
‘http://localhost/concrete8.5.7/contactと修正してエラー回避ができたからです。

これらは、version8.3.2(2018/07)からサイト始めて、8.4.0、8.4.3、8.4.4･･･8.5.4（2020/06/11）8.5.5と順番にバージョンアップし、直近までv8.5.6でした。これをv8.5.7に今回バージョンアップしたものなので、記事が古いバージョンであった時のものかも知れません。

どこかの段階までURLのパスがデータベーステーブルに格納（一部が絶対パス）されていたり、Hostingサービスのpublic_htmlを介してDomainとの接続が行われていることによる影響なのか分かりませんが、
 単純に本環境でエクスポートしたデータを開発・テスト環境にインポート（aitc_cf840.sql）しただけでは、うまく行かないことが判明しました。

　これらは、エディタ（Sublime Text）で、一括置き換えしましたが、どの部分が対象となっているのかを見つけるためにエディタ（NoEditorのGrep等を利用して）時間を要しました。

　この部分は、備忘録^※注的に、残しておきたいため、文末（記事の最後）に記載しておきますので、ご興味がございましたら読んでいただければと思います。

また、FTP（WinSCP）で直接入手したフォルダ・ファイルについても
一部のファイル・一部の配下フォルダが正常に入手出来なかったものがありました。

Edgeのデバロッパー（開発者）ツールで確認したところ

Class
「Concrete\Pakages\EcRecaptcha\Src\Captcha\Recaptchaコントローラが存在しません」
というエラーになっていました。

\MAMP\htdocs\concrete8.5.7\pakages\ec_recatcha配下には✅部分のものがなく、ec_recaptchaフォルダとec_recaptcha.zipがあります。
 （✅部分は、他にインストールしたConcreteCMS環境の\MAMP\htdocs\concrete8.5.7\pakages\ec_recatchaから、コピーしたものです。）

どうやら、C:\MAMP\htdocs\concrete8.5.7\packages\ec_recaptcha\の下にさらにec_recaptchaが存在し、配下に該当のフォルダとファイルがありましたので、ec_recaptcha.zipの展開（解凍）先を誤ってしまったのか？今となっては不明ですが、）

多分、ec_recaptcha.zipの展開（解凍）先を誤ってしまったのだと思いたい。

C:\MAMP\htdocs\concrete8.5.7\packages\ec_recaptcha配下

C:\MAMP\htdocs\ConcreteCMS\packages\ec_recaptcha配下

C:\MAMP\htdocs\concrete8.5.7\packages\ec_recaptcha\の下にさらにec_recaptcha

※.見出しの、{は｛で全角、}も｝で全角で書いています。（ここ以外の本文中も！）
理由は、そのまま書くと次の様に➡　https://a-itc.info　?の様に、本物に置き換えられ表示されるからです。

　V9以降が全部相対パスであることを望むばかりです。

既に、本環境からエクスポートしたaitc_cf840.sqlの一部記述には、
＜a href="｛CCM:BASE_URL}/blog/ssl20181229" style="color:#0563c1; text-decoration:underline">ここをクリックしてBlogをご覧ください</a＞や
＜a href="｛CCM:BASE_URL}/contact" style="box-sizing:border-box; color:blue; text-decoration:underline"><span style="box-sizing:border-box">ここをクリックして、お問合せください</span></a＞
の様に実装されているものを見つけました。

この様な記述の実装が広がることを期待します。

なぜなら、｛CCM:BASE_URL}は、

先にあげた記載と同じように、＜a href="｛CCM:BASE_URL}">TopPage</a＞とすれば、

自動的にTopPageへのリンクになります。

httpsから始まるドメインを記述しなくて済むだけではなく、ドメイン変更やサーバ移管等の事態が起きても、ソースコードの修正が必要無いので、非常に便利です。

サーバ移転はよくある事でしょうし、ドメイン変更はあまり無いかも知れませんが、筆者の様にLocalに開発・テスト環境を作り、本環境のデータ（.sqlのテーブルのデータ）を利用したい目的には、であれば、内部データ（.sql）の変更の手間が大幅に軽減できるので、そのメリットは大きいのですから。（今回は、一部が既に＜a href="｛CCM:BASE_URL}/化されていたものの、全てではなかった為、内部データを大量に変更する必要がありました後述^※注）

　本環境でエクスポートしたデータを開発・テスト環境にインポート（aitc_cf840.sql）しただけでは、うまく行かない

　ここでは、特定のテーブル(Table)の特定の項目（Field）に、URLやファイルの格納先（パス）を持っている為、本環境の.sqlデータをテスト・開発環境で使用できる様にする必要があり、そのための対象Tableと特定のFieldの値の置き換え（書き換え・更新）について詳細に記載します。

※注．

btContent

btContentImage

次の記事

Concrete CMS開発環境をローカルに作っていますⅤ

concrete5 v8.5.7から
Concrete CMS v9.1.1へのバージョンアップが終わりました。


当初懸念していたテーマstuccoは、
大きな問題もなく投稿もできたので、今のところ問題なしと判断しています。

ただ、FontAwesome5への対応の為カスタマイズの必要があります。

（Concrete CMS 本体の方は、Font Awesome5への対応済

stuccoへ独自カスタマイズした部分（?）

ページのどこにいても、
どのページにいても、
?「タップで電話できます」も表示されました。 a-itc.info