最近流行りの技術で、ReactはLaravelでJQueryの代わりのように使うことができるかということで、気になる方がいると思います。

私もそう思い、簡単な導入ができるのかどうかを検討してみました。

やってみたこと

Laravelをインストールして、プロジェクトを作成

最初に表示されるwelcome.blade.phpのテンプレートを弄って、Reactのライブラリを読み込み、Reactの簡単なプログラムを作成してみる。

やってみた結果

駄目でした。

理由はというと、まず、Reactで、テンプレートに変数を埋め込むときに、以下のように書きます

{{ message }}

この表記が、Laravelの変数の表記と被ってしまうためです。

Reactで変数を受け渡そうと、上記の様な表記を書くと、Laravelのほうでエラーになってしまいます。

VueをLaravelにそのまま導入しようとする場合と同じですね。

しかし、これは特別な設定をしないままJQueryを使うようなイメージでReactを使う場合で、設定をきちんとすればLaravelでもReactを使用することは可能ですが、少々ややこしいです。

LaravelとかのPHPのフレームワークを使ってアプリケーションを開発しつつ、フロントエンドの部分はJQueryでなくVue.jsを使って開発したい・・・。

そういう事を考える人は多いと思います。

かなり基本的なことですが、それができるのかどうかを検証してみました。

やってみたこと

• Laravelをインストール
• 最初に表示されるwelcome.blade.phpのテンプレートを貪って、Vue.jsのファイルを読み込んで、実装できるかどうか検証する
• まずは、チュートリアルにあるようなHello、Vueのような表示させるだけの処理を、welcome.blade.php上に実装してみる。

結果

上記の手順をやってみると、駄目でした。

何故かというと・・・

Vueの記法と、Laravelの記法が衝突してしまう

ということです。

具体的にいうと、Vueの場合で変数を扱うのに、htmlの中に

{{ message }}

こういう表記を使うわけですね。

この表記なのですが、LaravelでViewに変数を渡す場合の表記と同じなのです。

つまり、そのままだと、Vueのhtmlの記法とLaravelの記法が衝突してしまい、うまく動作しないというわけです。

Vueの記法の変数の部分が、存在しないみたいなエラーが、Laravelのほうから吐かれてしまうわけです。

しかし、これは、あくまでLaravelのView側でJQueryを使うみたいに気軽に使えるかという点での話なので、Laravel自体はVueに対応しているので、それ用の設定をすれば使うことは可能です・・・が、少々ややこしいです。

AWSについて勉強をしていて、EFSとFSxの違いについてよくわからなかったので、メモです。

調べた結果としては、どちらもファイルシステムなので、共通ファイルサーバとかに使うイメージだと思いますが、わかりやすい違いとしては、EFSは、LinuxのNFSという技術を使っているので、つまりはLinuxやUnix系のサーバで使うということですね。

これに対してFSxは、Windowsから使用することができるので、サーバがWindows系の場合にはこちらを選ぶのかなというイメージです。

FSxには、Windows向けと、HPCというハイスペックのコンピュータ向けのファイルシステムの２種類が存在しているみたいです。

その他、FSxはフルマネージドなので管理がしやすいという特徴があるみたいです。

それ以外の違いについてはよく分かりませんでした。

cakephp3で、ファイルをサーバからダウンロード後に削除する方法についてのメモ書きです。

Cakephp3で、サーバ上からダウンロードするには

$this->response->withFile(

メソッドが便利ですが、実行した時点でファイルが出力されてしまうので、その後サーバ上のファイルを削除しようとした場合、その後にファイル削除しようとした場合にうまく行かずに困っていました。

Laravelだと、

response()->download($pathToFile, $name)->deleteFileAfterSend(true)

みたいな方法でダウンロード後削除することができるのですが、cakephpではなく、どうしたものかと…。

それで色々調べたところ、cakephpの上記のメソッドを使わずに、PHPに直接記述したダウンロードする方法を取ることで解決しました。

phpに直接書く場合は、

//ファイルダウンロード
header (“Content-disposition: attachment; filename=wa3_db.sql”);
header (“Content-type: application/octet-stream; name=wa3_db.sql”);

 readfile($fileName);

 //ファイル削除
 unlink($fileName);

みたいなかんじで、readfile後に、unlinkすることで対処できました。

phpを使って開発をしていると、最近で必ず出てくるのがComposerです。

初学者の人には、そもそもComposerってなんぞ？っていうかんじでとっつきにくいのではないでしょうか。

自分の中で、最近腑に落ちた理解の仕方があったので書いておきます。

まず、そもそも一般的なComposerの説明とは

Composerについてよく知らない人が調べると出てくる説明は「PHPのパッケージ管理用のソフト」ということなのですが、これだけ聞いても正直良くわかりません。

PHPのパッケージ管理用のソフト？は？

と自分も思っていましたが、最近貪っていて、意味がわかってきました。

それは・・・・

特定のディレクトリ以下に、そのプロジェクトで使う必要なライブラリや設定を閉じ込める仕組み（を提供するソフト）

ということです。

まず、Composerを使わないと、例えば特定のプロジェクトでPHPのライブラリをインストールするときに、あるプロジェクトで使ったライブラリのバージョンと、他のプロジェクトで使うライブラリのバージョンが違うとすると、困ったことになりますね。

Composerの場合、まずそのプロジェクトのディレクトリ以下に、そのプロジェクトに必要なライブラリを、PHP自体とは切り離して必要なライブラリ(PHPのコアな部分を除く)をインストールしてしまうわけです。(インストールするというか、ファイル群を設置するという方が適切かもしれません）

Composerを使ってプロジェクトを作成すると、そのプロジェクトフォルダのvendorというフォルダ以下に、プロジェクトでは直接触らないようなライブラリやファイルが大量に入っていると思いますが、この部分がComposerを使って導入されたライブラリのまとめの部分です。

そして、package.jsonに設定を書いておくことで、設定を変えたい場合はComposerでアップデートをかけることで、該当のプロジェクトフォルダ以下のphpのライブラリだけが更新されます。

サーバごとではなく、プロジェクトのフォルダごとに必要なPHPのライブラリ一式をまとめることができるようになるわけです。

つまり、１つのサーバに１つのシステムしか入っていない場合はComposerのようなソフトは必要ないわけですが、一つのサーバに複数のサイトやシステムを管理するようなシステムの場合、このようなシステムは重要になりますね。

以下の問題を解決するのに苦労したので、備忘録として書いておきます。

発生した問題

phpでそのままCSVを生成して出力した場合は問題なく出力できる

ajaxを使って、生成したCSVをダウンロードすると、エクセルで開いた場合に文字化け

出力されたCSVファイルを、テキストエディタで開くと、ファイルの文字コードがUTF-8になっている？（普通にPHPで出力した場合はsjis)

前提の環境

サーバ側で出力しているCSVはPHPで生成し、文字コードはsjis

ブラウザはIE11

今回やろうとしていたのは、PHPでそのまま出力するのではなく、ajaxでダウンロードするパターンだったので、文字化けの対処法を探すのに苦労しました。

以下の記事のおかげで解決できました。

JavaScript 文字化けしないファイルの出力法 | グルーヴであなたのビジネスは加速する

サンプルコード(上記のサイトからそのまま抜粋)

ar csv = 'ここにCSVのデータを入れる';

var link = document.createElement('a');
var bom = new Uint8Array([0xEF, 0xBB, 0xBF]);
var blob;

if (window.navigator.msSaveOrOpenBlob) {
  // for ie
  blob = new Blob([bom, csv], {type: 'text/csv'});
  window.navigator.msSaveOrOpenBlob(blob, csvName);
} else if (window.webkitURL && window.webkitURL.createObjectURL) {
  // for chrome (and safari)
  blob = new Blob([bom, csv], {type: 'text/csv'});
  link.setAttribute('download', csvName);
  link.setAttribute('href', window.webkitURL.createObjectURL(blob));
  link.click();
} else if (window.URL && window.URL.createObjectURL) {
  // for firefox
  blob = new Blob([bom, csv], {type: 'text/csv'});
  link.setAttribute('download', csvName);
  link.setAttribute('href', window.URL.createObjectURL(blob));
  link.click();
}

やっていたこととしては上記と同じで、ajaxで取得したCSVデータをwindow.navigator.msSaveOrOpenBlobで開くというものだったのですが、new Blobで開くblobデータを作成する場合に、テキストの先頭にBOMをつければよいというものでした。

自分の場合は、この方法で解決することができました。

PHPやサーバサイドのプログラミングをしていると、セッションという概念がよく出てきますが、分かるようで分からないような概念だなと思っていました。

サーバ側でセッションを保持するとか、それってつまりどういうこと？

という風に思っていたのですが、要はセッションというのは、特定のユーザに紐づく一定時間の間保持する情報をデータとして保持する仕組みということです。

その仕組みは、phpのセッションを使うのであれば、PHPのミドルウェアの中にプログラムで作られていますし、フレームワークのセッションの仕組みであれば、フレームワークのライブラリの中でプログラムで実装されています。

セッションがサーバ側でデータを保持する仕組みというのは、要はデータであれば何でもいいので、特定のフォルダ以下にファイル形式で書き出してある場合もあれば、データベースで保持する場合もあります。

PHPはデフォルトでは、ファイル形式で特定のフォルダ以下に書き出す形式なので、ファイルで書き出す形式が多いようです。

PHPのフレームワークのCakephpの場合、デフォルトの設定ではファイル形式で書き出しますが、設定を変更することでデータベース側でセッションを持つような仕組みにすることも可能です。

まとめ

セッションというのは、一定の時間の間だけサーバ側で特定のデータを保持する仕組みのこと。

そのデータを保持する形式は、ファイル形式の場合もあればデータベース形式の場合もある。

今や様々なところで使われているNode.js。

そもそもこれが何なのか、今ひとつ理解できていない（使ってはいるものの、イメージが沸かない）状態だったのですが、ようやく理解が進みました。

それはどういうことかといいますと、「特定のディレクトリ以下に閉じ込めたJavascript実行環境」です。

どういうことかと、Javascriptのライブラリなどを一式準備するとき、必要となるライブラリなどが一式ありますが、それが、サーバ全体で共有するようなイメージだと、プロジェクトによって、必要なライブラリやバージョンが異なったりするため、競合が起こり、管理が大変になります。

それが、特定のディレクトリ以下に一式をすべてまとめられて単位で区切られていれば、プロジェクトごとにバージョンが異なっていても競合を起こすことはありません。

それを管理するのが「npm(node package manager)」です。

phpでいうcomposerみたいなかんじですね。

linuxの場合、yumでパッケージ管理をしていると、サーバ全体のライブラリが更新されたりしますが、npmの場合、特定のディレクトリ(npmを実行した環境)以下に全てまとめられ、それは主にプロジェクトごとに作成されます。

このことが当たり前っちゃ当たり前ですが、npmを実行してもバックグラウンドで何が実行されているかが分かりにくいため、ようやく理解することができました…。

使っているサーバがkusanagiなのですが、nginxを起動時にエラーではないのですが、謎のwarningが出たのですが、原因について調査したのでメモです。

実行しようとしたコマンド

kusangi nginx

※ kusanagiでの、nginxの再起動コマンドです。

表示されたワーニング

kusanagi nginx
Nginxを使用します。
nginx: [warn] conflicting server name "default_server" on 0.0.0.0:80, ignored
nginx: [warn] conflicting server name "default_server" on 0.0.0.0:443, ignored
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
完了しました。

nginxの再起動自体は完了していますが、ワーニングが発生しています。

問題の場所がどこかが分からないんですよね…

解決した方法

cd /etc/nginx/conf.d

使っているサーバで、nginxの設定ファイルがあるディレクトリまで移動します。

_httpd.conf

というファイルがあり、中身を見ると

 ## default HTTP
  2 server {
  3     listen       80;
  4     server_name  default_server;

となっています。

_ssl.conf

というファイルがあり、中身を見ると

## default SSL
  2 server {
  3     listen       443 ssl;
  4     server_name  default_server;

となっています。

このdefault_serverというのが、ワーニングが出ている原因になっているようです。

考えたところ、この_httpd.confと、_ssl.confという設定ファイルは、読み込まれているものの無視されているようなので、ファイルをバックアップだけ取って、削除しました。

その後、nginxを再度再起動したところ

[[email protected] conf.d]# kusanagi nginx
Nginxを使用します。
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful
完了しました。

今度はOKでした。

サーバ上のサイトも問題なく見れました。

何かの際に、不要な上のファイルが生成されて残っていたようで、削除することでワーニングが出なくなりました。

※　同じ現象で対応される場合は、バックアップだけはきちんと取っておくことを推奨します。

MAMP環境で、Laravelでphp artisan migrateを実行したところ、以下のエラーが出ました

No such file or directory (SQL: select * from information_schema.tables where table_schema = ○○○ and table_name = migrations and table_type = ‘BASE TABLE’)

データベースの接続を.envファイルには設定できています。

調べてみると、/config/database.phpにsocketの追加が必要なようです。

MAMPでは、ソケットが以下の設定になっていました。

Socket	/Applications/MAMP/tmp/mysql/mysql.sock

これを、/config/database.phpに追記します。

'mysql' => [
            〜省略〜
            'unix_socket' => env('DB_SOCKET', '/Applications/MAMP/tmp/mysql/mysql.sock'),
　　　　　　　〜省略〜
]

上記に修正後、再度 migrationを実行すると、今度は問題なく実行することができました！

Vue3で、単一ファイルコンポーネントにpropsで値を受け渡す方法についてのメモです。

親コンポーネント側の記述

下記では、Controllerから埋め込んだidという変数を、子コンポーネントのTestComponentに渡しています。

<div id="app">
    <test id="{{ $id }}"></test>
</div>

子Component側の記述

子Component側が、受け渡された値を使用するには、propsで名前を指定する必要があります。

<template>
    <div>親コンポーネントから渡された値：{{ id }}</div>
</template>

<script>
    module.exports = {
        props: ['id'],
        data() {
            return {
                ''
            }
        },
    }
</script>

作っていたサイトのLaravelと使っていたVueのバージョンが2系だったのから3系にバージョンアップしました。

以下、手順についてのメモです。

Vueのバージョンの確認方法

プロジェクトフォルダで

npm list vue

[email protected]

２系な模様。これを３系に上げたい

package.jsonの編集

プロジェクトフォルダのpackage.jsonを編集します。

まずは編集前に、package.jsonをバックアップ後、以下の記述を削除

"vue": "^2.6.12",
"vue-loader": "^15.9.6",
"vue-template-compiler": "^2.6.12"

Vue3のインストールを実行

Vue3のインストールをnpmで実行します。

npm install -save-dev [email protected]

その後、再び vue のバージョンを確認

npm list vue

[email protected]

Vue3系に上がってる！

num run dev を実行。

変なエラーが出る。丁寧に以下のコマンドを実行しろということ。

npm install @vue/compiler-sfc [email protected]^16.1.0 –save-dev –legacy-peer-deps

上記を実行後、npm run devを実行。

問題なく実行できました。

そして、あとはアプリ側のVueのソースを、Vue3のプログラムに書き直します。

これは、ここのサイトを参考にさせていただきました。

Vue 3 を Laravel 8で使う方法（npm） | console dot log

これで、うまく行った・・・かと思いきや、ローカルではうまく動いたのに、本番環境ではテストプログラムが動作しません。

散々調べた挙げく、原因が分かりました。

CDNのキャッシュ

Laravel + Vueでは、npm run devで、app.jsをビルドするのですが、

これが、古いファイルがCDNにキャッシュされてエラーになっていたのが原因でした。

CDNのキャッシュをクリアすることで、無事に表示されることになりました。

と、ここまででようやくLaravel8 + Vue3で基本的なプログラムが表示できたのですが、スタート地点に立つだけでも大変ですね・・・。

Laravel8+Vueでサイトを構築中、VueのComponentのファイルを更新しても、何故か画面に反映されなくて困りました。

具体的にいうと、デフォルトでLaravelでVueを有効にすると入ってくるExample Componentがあります。

ファイルの場所は、Laravelのルートディレクトリ以下の

/resources/js/components/ExampleComponent.js

があります。

このファイル内容をテストで更新してみたのですが、画面に反映されないのです。

謎…。

で、調べてみたところ、ルートディレクトリで

npm rum dev

をしないと更新されないということ。

なんだそれ、分かりにく・・・

しかし試しに実行で、エラー

Error: Cannot find module ‘../package.json’

で、調べてみると、node_modueを再インストールしてみたらいいということです。

rm -rf ./npm_modules

npm install

で、node_moduleを再インストールで、

npm rum dev　を実行

今度はエラーがでず・・・

で、サイトを見に行くと、、、、

更新されていない orz

で、ブラウザのキャッシュを削除すると・・・・

更新されました！！

というわけで、分かりにくかったですが、何とかComponentを更新するところまではたどり着きました。

ただこれだけのことで、最初は大変・・・

使っているサーバで、Laravelでサイトを構築しようと思ったら、migrationでエラー。

原因としては、mysqlのバージョンが最新でないことが原因だそうです。

使っていたのがMariaDB10.1で、MySQL5.6相当

MariaDBを最新の10.3に上げることができれば、MySQLの5.7に相当するようです。

アップした方法

以下のサイトに解説がありました。

KUSANAGI バージョンアップ情報 8.5.0-1 | KUSANAGI

yum update -y
kusanagi upgrade mariadb 10.3

上記を実行する前に事前にバックアップは取っておいてねということなので、取っておきました。

参考にしたサイトは以下です。

MariaDBを10.3にアップグレードする際の手順と注意事項 | 己で解決！泣かぬなら己で鳴こうホトトギス

mkdir /tmpMDB10.1
mkdir /tmpMDB10.1/my.cnf.d
mkdir /tmpMDB10.1/postfix
mysqldump -u root -p --all-databases > /tmpMDB10.1/all_db_backup.sql
cp -r -a /etc/my.cnf /tmpMDB10.1/my.cnf
cp -r -a /etc/my.cnf.d/* /tmpMDB10.1/my.cnf.d/
cp -r -a /etc/postfix/* /tmpMDB10.1/postfix/

上記の方法でバックアップを行った後、バージョンアップを実行しました。

バージョンアップは数分時間がかかったものの問題なく終了し、各種サイト（WordPress、Laravel)はいずれも問題なく動いていることを確認しました。

また、目的であったLaravelのmigrationも問題なくできるようになりました。

cakephp3で、データベースから取得した日時などのオブジェクトのデータを画面に出力する場合に、YMD形式のフォーマットに変換するケースがありますが、yは大文字か小文字か、など微妙なところでよく分からなかったのでメモです。

例えば、以下のように使います。

$now = Time::parse('2014-10-31');
// '2014-10-31 00:00:00' と出力します。
$now->i18nFormat('yyyy-MM-dd HH:mm:ss');

cakephpで使われているYMDフォーマットについては、以下のページに詳しく解説がありました。

Formatting Dates and Times | ICU Documentation

上記のページから抜粋します。

Symbol	Meaning	Pattern	Example Output
G	era designator	G, GG, or GGG GGGG GGGGG	AD Anno Domini A
y	year	yy y or yyyy	96 1996
Y	year of “Week of Year”	Y	1997
u	extended year	u	4601
U	cyclic year name, as in Chinese lunar calendar	U	甲子
r	related Gregorian year	r	1996
Q	quarter	Q QQ QQQ QQQQ QQQQQ	2 02 Q2 2nd quarter 2
q	stand-alone quarter	q qq qqq qqqq qqqqq	2 02 Q2 2nd quarter 2
M	month in year	M MM MMM MMMM MMMMM	9 09 Sep September S
L	stand-alone month in year	L LL LLL LLLL LLLLL	9 09 Sep September S
w	week of year	w ww	27 27
W	week of month	W	2
d	day in month	d dd	2 02
D	day of year	D	189
F	day of week in month	F	2 (2nd Wed in July)
g	modified julian day	g	2451334
E	day of week	E, EE, or EEE EEEE EEEEE EEEEEE	Tue Tuesday T Tu
e	local day of week example: if Monday is 1st day, Tuesday is 2nd )	e or ee eee eeee eeeee eeeeee	2 Tue Tuesday T Tu
c	stand-alone local day of week	c or cc ccc cccc ccccc cccccc	2 Tue Tuesday T Tu
a	am/pm marker	a	pm
h	hour in am/pm (1~12)	h hh	7 07
H	hour in day (0~23)	H HH	0 00
k	hour in day (1~24)	k kk	24 24
K	hour in am/pm (0~11)	K KK	0 00
m	minute in hour	m mm	4 04
s	second in minute	s ss	5 05
S	fractional second – truncates (like other time fields) to the count of letters when formatting. Appends zeros if more than 3 letters specified. Truncates at three significant digits when parsing.	S SS SSS SSSS	2 23 235 2350
A	milliseconds in day	A	61201235
z	Time Zone: specific non-location	z, zz, or zzz zzzz	PDT Pacific Daylight Time
Z	Time Zone: ISO8601 basic hms? / RFC 822 Time Zone: long localized GMT (=OOOO) TIme Zone: ISO8601 extended hms? (=XXXXX)	Z, ZZ, or ZZZ ZZZZ ZZZZZ	-0800 GMT-08:00 -08:00, -07:52:58, Z
O	Time Zone: short localized GMT Time Zone: long localized GMT (=ZZZZ)	O OOOO	GMT-8 GMT-08:00
v	Time Zone: generic non-location (falls back first to VVVV)	v vvvv	PT Pacific Time or Los Angeles Time
V	Time Zone: short time zone ID Time Zone: long time zone ID Time Zone: time zone exemplar city Time Zone: generic location (falls back to OOOO)	V VV VVV VVVV	uslax America/Los_Angeles Los Angeles Los Angeles Time
X	Time Zone: ISO8601 basic hm?, with Z for 0 Time Zone: ISO8601 basic hm, with Z Time Zone: ISO8601 extended hm, with Z Time Zone: ISO8601 basic hms?, with Z Time Zone: ISO8601 extended hms?, with Z	X XX XXX XXXX XXXXX	-08, +0530, Z -0800, Z -08:00, Z -0800, -075258, Z -08:00, -07:52:58, Z
x	Time Zone: ISO8601 basic hm?, without Z for 0 Time Zone: ISO8601 basic hm, without Z Time Zone: ISO8601 extended hm, without Z Time Zone: ISO8601 basic hms?, without Z Time Zone: ISO8601 extended hms?, without Z	x xx xxx xxxx xxxxx	-08, +0530 -0800 -08:00 -0800, -075258 -08:00, -07:52:58
'	escape for text	'	(nothing)
' '	two single quotes produce one	' '	’

cakephp3で、order by 句にcase文を使用したいケースがあったので、メモです。

今回実装したかったのは以下の内容です。

特定のテーブルから、

(1) あるカラムがAまたはBのグループを先頭に持ってきて

(2) その後に(1)でないグループを表示

(3) (1)(2)が同じ条件場合は、別のカラムの値降順で表示

以下のような実装で実現できました。

// モデルでの実装の例
$query = $this->find();

// CASE WHEN ((カラム名 = A) or (カラム名 = B)) THEN 1 ELSE 2 END
$case = $query->newExpr()
                ->addCase(
                    $query->newExpr()->add([
                        'OR' => [
                            'カラム名' => A,
                            'カラム名' => B
                        ]
                    ]),
                    [1, 2],
                    ['integer', 'integer']
                );

$query->order([
    $case,
    カラム名 => 'DESC'
]);

/* これで、
select * from table order by (CASE when (カラム名 = A or カラム名 = B) THEN 1 ELSE 2 END), カラム名 DESC
と同じものが実行できました
*/

CakePHP3では、デバッグでログ出力するのに

use Cake\Log\Log;

LOG::debug(“出力したい内容”);

を使うことで、デバッグログファイルにログを出力することができます。

しかし、これを自分の開発環境で使ってみたところ、ログが出力されない現象が発生することがあり、困っていました。

調べたところ、出力できるようになったのですが、原因としては、

/config/app.php　内の

'debug' => [
            'className' => 'Cake\Log\Engine\FileLog',
            'path' => LOGS,
            'file' => date("Ymd").'_debug',
            'url' => env('LOG_DEBUG_URL', null),
            'scopes' => false,
            'levels' => ['notice', 'info', 'debug'],
        ],

で、scopes = true　になっていたのが原因でした。

これを scopes = false にすることで、ログが出力されるようになりました。

ぱっと見では、trueにすることで出力されるんではないかと思いますが、trueだと逆に出力されないということですね。

Laravel7をインストールするのに、エラーが出たりして微妙に苦労したのでメモ。

環境

CentOS

php7

以前別のプロジェクトで同じサーバにLaravelを入れていた(5系)

まずは、手順に従って、Laravelをインストールしようとした

composer global require laravel/installer

するとエラーが

SHA384 is not supported by your openssl extension, could not verify the phar file integrity

調べてみると、composerのバージョンが古いためにLaravel7系の場合は合わないらしい。

composerの最新のバージョンは1系、Laravelは7系。

これが駄目ってことか。

というわけで、composerのバージョンを最新版の2系にバージョンアップ。

この記事を参考にcomposerの再インストールを実施しました。

composerのダウンロードとインストールは、公式の記事を参考にしたらいいと思います。

結果、composerのバージョンは最新の2系になりました。

composer -V

Composer version 2.0.9

そして、再度Laravelのインストールコマンドを実行

すると、今度はまた別のエラーが

Installation failed, reverting ./composer.json and ./composer.lock to their original content.

エラーの内容は、最初見てよくわからなかったのですが、最終的に分かったこととしては、今回実行しようとしている

composer global require laravel/installer

というコマンドは、Laravelのインストーラーを作成するコマンドであって、それが同じサーバにすでに作成していたLaravelのプロジェクト（5系）の作成時にすでに設置していたLaravelのインストーラーがあり、その設定ファイルのcomposer.jsonとcomposer.lockと内容が競合しているというような意味だったみたいです。

上記の過去プロジェクトはもうすでに更新してないサイトだったのもあり、過去に作成したインストーラーを、一旦リネーム(削除するのは何か怖かったのでリネーム）することで、上手く設置することができました。

Laravelのインストーラーは、サーバの設定により異なりますが、自分の環境の場合は

/home/.config/

以下がそうだった（それ以下にLaravelのインストーラーが入っていた）ので、上記フォルダをリネーム後にサイド実行することで、上記ディレクトリが新しく作成され、そこにLarvel7に必要だったcomposer.json、composer.lockも新しく作られました。

そして、Laravelのインストールを実行

laravel new プロジェクト名

しかし、以下のエラーが・・・

bash: laravel: コマンドが見つかりません

調べてみると、Laravelのインストーラーへのパスが通ってないみたいで、ホームディレクトリの.bash_profileにパスを設定しないといけないらしい。

しかし、確認するとすでにパスの記述がある・・・。だとするとなぜ？

source .bash_profile

をすることで読み込まれたみたいで、無事Laravelのプロジェクトを作成することができました。

Laravelのドキュメントルートにアクセスするとエラーが

The stream or file “/storage/logs/laravel.log” could not be opened in append mode: failed to open stream: Permission denied

調べるとアクセス権がないとかうことみたいで、

chmod -R 777 storage

で解決。755でいけるとか書いてたけどどうにもならず、777にしたらいけました。

Cakephp3のValidationとBuildRulesについての記事です。

Cakephp3ではフォームのバリデーション（エラーチェック）はモデルで行われますが、エラーチェックの方法に、validationと、BuildRulesの２パターンがあります。

この違いについて解説したいと思います。

まずvalidationについてですが、基本的にmodelのvalidationDefaultメソッドの定義していきます。一般的なエラーチェックはこちらに定義していくパターンが多いと思います。

BuildRulesは、validationメソッドとは別に定義していきます。

通常のvalidationとは記述方法が微妙に違うので、そこは公式サイトを見て確認してください。

それで、この２つの何が違うのかについてですが、バリデーションが実行されるタイミングです。

通常のvalidationは、Controller側でnewEntityやpatchEntityを実行するタイミングで行われます。

これに対して、BuildRulesは、モデルからsaveメソッドを実行するタイミングで行われます。

この２つのどう使い分けるかというと微妙なところがあって私も完全には理解してないのですが、例えば日付を比較するようなエラーチェックを入れる場合、Build Rulesのほうに追加すると便利です。

なぜなら、日付を比較するようなエラーチェックの場合、そもそも入力値が日付でなかったりする場合、エラーチェックの処理の途中で日付でないのでエラーになってしまったりして、データが「日付である」という前提を担保することが難しいわけです。

これを、Validationのほうに日付のエラーチェックを定義しておいて、日付データの比較はBuiled Rulesのほうに定義しておけば、日付でない場合はpatchEntityのタイミングでエラーになってsave時のBuild Rulesまで処理が進まないので、内部的な処理で日付がどうこうみたいな処理を書く必要がなくなります。

他にもあるかもしれませんが、私の理解ではそんなところです。

関わっていた案件で、PostgresSQLのTriggerを使って、Insertする特定のカラム値を、TriggerのInsert Beforeを使って計算して挿入するというケースがありました。

Qiitaの以下の記事がわかりやすかったです。

PostgreSQLでトリガを作成し、同一テーブル内に値を追加する

https://qiita.com/grassfield/items/60fad9c1d4a8d205bff3

CREATE OR REPLACE FUNCTION culc_totalworktime() RETURNS trigger AS $BODY$
BEGIN
  NEW.勤務時間 := NEW.終了時刻-NEW.開始時刻-NEW.休憩時間; -- 解説
  RETURN NEW;
END;
$BODY$ LANGUAGE plpgsql VOLATILE COST 100;
ALTER FUNCTION culc_totalworktime() OWNER TO postgres;

上記のようなかんじで値を返すトリガを作成して

CREATE TRIGGER totalworktime_trg
BEFORE INSERT OR UPDATE ON 勤務実績
FOR EACH ROW EXECUTE PROCEDURE culc_totalworktime();

上記のようにINSERT BEFOREでトリガを呼び出してやれば、カラムに計算された値が挿入されました。

kusanagiのWordPress実行環境で、all-in-one wp migrationを使ってサイトのインポートをしていたところ、100%まで進んだところで止まってしまい、それ以上進まなくなるという状況になってしまいました。

原因について調べてみたのですが、まずはサーバのエラーログを見てみたところ、以下のようなエラーが出ていました

client intended to send too large body: 65213411 bytes, client

これは、postしたデータサイズが設定を超えていたのではじかれているという内容みたいです。

サーバはnginxを使っていたので、以下のように設定を変更しました

該当のサーバのnginxの設定ファイル〇〇.confを編集します

client_max_body_size 16M;

調べたところ、デフォルトでは自分が使っているサーバでは上記の設定だったので、ひっかかってエラーになっていたみたいです。

client_max_body_size 100M;

上記のように上限を変更し、nginxを再起動することで無事インポートできるようになりました。

CakePHPのFlashComponentについての解説です。

公式サイトでは以下のページに解説があります。

フラッシュ

公式サイトの解説が分かりにくいので、自分流の解釈ですが、FlashComponentは、特定のメッセージをサイトで表示するのに使います。

Sessionに表示するデータを保存して、画面遷移後に表示することが可能です。

普通にエラーメッセージを表示する場合と比較すると、表示するメッセージを保存して、画面遷移後の表示に使う事ができる特徴があります。

使い方

Controllerで以下の定義

public function initialize() {

parent::initialize();
$this->loadComponent(‘Flash’); // Include the FlashComponent

}

表示したいデータを以下のように使う。

//成功した場合出力。リダイレクト後のページで表示される

successやerrorなどのテンプレートは、/sec/Template/Element/Flash以下にあるので追加や編集も可能。

$this->Flash->success(__(‘Your article has been saved.’));

$this->Flash->error(__(‘Unable to add your article.’));

テンプレートの以下の記述の場所にFlashメッセージが表示される

<?= $this->Flash->render() ?>

CakePHPのLoadComponentについての解説です。

LoadComponentメソッドは、Controller内で実行することができ、あらかじめCakePHPの準備されているComponentを呼び出すことができます。

Componentとは、機能のようなもので、メソッドのかたまりのようなものです。

一般的なプログラムでのライブラリ読み込みのようなものと考えればよいでしょう。

Componentをコントローラで使用する場合は、initializeメソッドの中でLoadComponentを使って該当のComponentを呼び出します。

読み込むことができるComponentには以下の種類があるので、詳細は以下のそれぞれの記事を参照とのことです。

• AuthComponent (4.0.0で撤廃。プラグインに置き換えられる。)
• クッキー (3.5.0で撤廃。ServerRequestで利用できる)
• クロスサイトリクエストフォージェリ (3.5.0で撤廃。ミドルウェアに置き換えられる)
• フラッシュ
• セキュリティ (FormHelperを使う必要あり)
• ページネーション
• リクエストハンドリング

CakePHPのaddBehaviorメソッドについての解説です。

CakePHPのチュートリアルを進めていると、Tableクラスで以下のような記述があります。

class ArticlesTable extends Table
{
    public function initialize(array $config)
    {
        $this->addBehavior('Timestamp');
    }
}

上記の意味がわからなかったのですが、調べてみると以下のような記述がありました。

デフォルトの設定は以下のようになっています:

• 新しく Entity を保存するとき、 created と modified に現在の日時を設定します。
• Entity を更新したとき、 modified に現在の日時を設定します。

上記のように宣言することで、対象のテーブルの項目「created」と「modified」が、データが作成されたときにタイムスタンプが更新されるようになる他、データが更新されたときにmodifiedの項目が自動で更新されるようになるということです。

AWSの試用期間中で無料期間中にいろいろと試しているのですが、インスタンスを使用後に削除したのに、請求で料金がチャージされているのが謎でした。

ダッシュボードで利用状況を確認しても、利用しているEC2インスタンスは存在していないのに、EC2インスタンスに対して料金がチャージされていっているのです。

原因について調べていたところ、原因が判明しました。

AWSのダッシュボードの右上で、AWSのロケーション(米国東部とかいろいろある)を変更できますが、現在のロケーションでなく、別のロケーションに存在していました。

そのため、現在のダッシュボードに利用しているリソースが存在していないけど料金がチャージされているという場合、ロケーションを１つずつ変更しつつチェックして確認することで見つかる場合もあると思います。

Vue.jsで、Vueオブジェクトのデータをループさせるときに、v-forディレクティブを使用します。

<li :v-for=”変数 in Vueオブジェクトのデータ名”>{{ 変数.データ名 }}</li>

上記のような感じで使いますが、いろいろなサイトでコードのサンプルを見ていて、上記のような書き方だけのときもあれば

<li :v-for=”変数 in Vueオブジェクトのデータ名” :key=”変数.id”>{{ 変数.データ名 }}</li>

のように、:keyがついている場合とついていない場合があります。

何のために :key がついているのか調べてみたのですが、Vueの機能でDOMを書き換えた時に、keyを指定していないと、順番が変わってしまうことがあるそうで、つけておくことで並び順を保持できるそうです。

ajaxについての勉強メモです。

ajaxとは

ajaxとは、javascritを使って、ページを非同期に更新する仕組みのことです。

とはいえ、ajaxという言葉を使わなくても、javascriptは、普通にスクリプトを実行することで、イベント発生時（マウスオーバーやクリック時など）、ページの内容を書き換えることは可能です。

では、ajaxとはその通常のjavascriptの仕組みと何が違うのでしょうか。

それは、ウェブページから、動的に現在のページでない他のページからのリソースを要求し、その結果をページに反映できるという点です。

たとえば特定の要素をマウスでクリックしたときに、ajaxの仕組みを使って、phpファイルを実行し、その帰ってきた結果を解析してページ内に反映させることができます。

この仕組みを実現するためにjavascirptに実装されているAPIの機能がajaxです。

そのことを、例えばフォームをサブミットしたりページをリロードしたりせずに実行できる仕組みと考えればよいでしょう。

javascriptのソースコードを見ていると、よく以下のような記述があります。

$(function(){})

これを、javascript初心者の人が見ると

???

となりますが、この意味について解説したいと思います。

まず、javascriptでは、関数をオブジェクトとして定義することができ、そのまま関数名を定義せずに変数に代入してオブジェクトにすることができる。

この事は知っている人が多いと思います。

また、javascriptは、即時関数という機能があって、定義した関数をその場ですぐに実行することができます。

これは、

(function() { 実行内容 } ())

このような書き方をします。

上記のような書き方をすることで、実行内容をその場で実行することができるわけです。

しかし、 タイトルにある

$(function(){ 実行内容 })

は、上記の記述とも微妙に違います。

これは、jQueryを使用している場合の記述です。

ページのDOMツリーの読み込みが完了した後に、実行内容を実行するということで、javascirptの通常の即時関数と似ていますが、JQuery使用時固有のものです。

Laravelで、フォームを作る時に、例えば選択ボックスがあって、そこから値を取り出したい場合があります。

例えば、性別[男、女]とか、都道府県[北海道〜沖縄]とか、カテゴリ[〜、〜]とか色々と考えられます。

それらのデータは、しょっちゅう変更があるもので、複雑なものであればデータベースにテーブルを作ってそこから引っ張ってくる方法もあるのですが、例えば男、女のような小さいデータセットであれば、わざわざそれをするほどでもないというか、いちいちテーブルを追加してデータをセットするというのが、Laravelの場合マイグレーションを通さないといけなかったりと色々と面倒です。

その場合に便利なやり方ですが、configに追加するのが楽です。

以下のページにやり方が書いてありました。

Laravelで都道府県のプルダウンメニューを作ってみる

一応手順についてメモしておきます

１．config以下に好きなファイル名で作成

都道府県であれば、per.phpのようなファイル名をconfig以下に作成して保存します。

return array(
  '1' => '北海道', 
  '2' => '青森県', 
省略
  '46' => '鹿児島県', 
  '47' => '沖縄県'
);

ちなみに、configのキャッシュが残っていると反映されないので、ファイルアップ後は以下のコマンドが実行必要です。

php artisan config:cache

上記の例では、pref.phpには一つしか配列が定義されていないですが、
複数定義したい場合は以下のように多次元配列でも設定が可能です。

return [
    "sex" => [
        "1" => "男",
        "2" => "女",
    ]
];

上記のように設定しても、後で問題なくアクセスできます。

コントローラーで取得→テンプレートに表示、または直接bladeに表示

作成したファイルは、config(ファイル名)で、いつでも参照して取得可能です。

コントローラーで取得してからテンプレートに表示する方法

public function sample() {
  $prefs = config('pref');
  return view('sample')->with(['prefs' => $prefs]);
}
  @foreach($prefs as $index => $name)
$name
  @endforeach

直接テンプレートに記述する

以下のように直接取得することも可能です。

<select name="_pref">
  @foreach(config('pref') as $index => $name)
    <option value="{{ $index }}" @if(old('_pref') == $index) selected @endif>$name</option>
  @endforeach
</select>

多次元配列の場合は以下のようなかんじです。

例えば、config/common.phpに

return [
    "sex" => [
        "1" => "男",
        "2" => "女",
    ]
];

上記のような定義を例えばcommon.phpにした場合、以下のように記述できます。

<select name="sex">
    @foreach(config('common.sex') as $index => $value)
        <option value='{{ $index }}' @if(old('sex') == $index) selected @endif >{{ $value }}</option>
    @endforeach
</select>

 

Javascriptのクロージャについての解説です。

Javascirptのクロージャとは何か

Javascriptのクロージャとは何か。

私の理解では

関数の中で関数を定義したもの

という理解です。
(あくまで私の理解です)

まず、基本的なところで

・　関数を定義すると、関数内で定義した変数は関数外部から参照できない

という性質があります。
これはほとんどの人が知っていると思います。

例えば

function func() {
  var value = 1;
  console.log(value);
}
func(); // 1
console.log(value); // undefined

上記のようなプログラムの場合、関数を実行した場合、実行結果は
1になりますが、関数内の変数を出力した場合、
参照できていません。

function func() {
  var value = 1;

  function innerFunc() {
    value++;
  }
  innerFunc();
  console.log(value); // 2
}
func();

上記のようなプログラムの場合、関数の内部でinnerFuncという関数を定義して関数内で実行しています。
このinnerFUncをクロージャといいます。

innerFunc内では、外側の関数（エンクロージャ）で定義している
変数valueを呼び出していますが、その値を参照できているだけでなく、
更新することができます。

つまり、javascriptでは、関数の中で定義された関数の仕様は通常の
関数と、その外側の領域と違い、その関数内部で変数を参照したり、更新
したりできるのです。

このような仕組みを利用して、関数を定義する際に使用することがありますので、
性質として覚えておくと良いでしょう。

どのようなときに使うのか？

上記のクロージャの仕組みを使うと、関数内の変数の値を維持したまま、
その関数内の値を更新するプログラムをかけたりします。

例えば、関数内で定義した変数を、その関数内の関数を定義して返すような
関数にすることで、関数の外で変数を定義して更新したりしなくても、
関数を実行する度に関数を実行できたりするわけです。

書き方によってはクロージャを使わなくても実装できる場合もありますが、
コードがよりシンプルになったり、便利なケースがあるようです。
（未だにそういう場面に遭遇したことがないので分からない・・・）