こんちには、フリーのITエンジニアでWeb(PHP：Laravel)のバッグエンドをメインにフルリモートでお仕事させて頂きながら、個人開発でiOSアプリを作っているMoritaです。
CakePHPでajaxを使用して画面の再読み込みをさせずに、裏でデータ処理させる方法を紹介します。
環境
Mac
PHP 7.1.3
CakePHP 3.8
やり方
CakePHPでjQueryが使用できるようにヘッダー部分読み込みを記載します。
ajaxの書き方自体は公式リファレンスに記載されています。
https://api.jquery.com/jquery.ajax/
POSTができない問題
GETで呼び出すには問題ありませんが、POSTの場合CSRF機能でアクセスできません。これを許可するためにCakePHP3.8では、config>routs.phpの以下をコメントアウトします。(古いバージョンではApplication.phpに設定があったようです。)
// Register scoped middleware for in scopes.
/** この箇所をコメントアウト
$routes->registerMiddleware('csrf', new CsrfProtectionMiddleware([
'httpOnly' => true
]));
*/
/**
* Apply a middleware to the current route scope.
* Requires middleware to be registered via `Application::routes()` with `registerMiddleware()`
*/
// この箇所をコメントアウト
// $routes->applyMiddleware('csrf');これでPOSTでのアクセスは可能ですが、CSRF機能を無効にしているので別途対応が必要になると思います。
注意ポイント
ajaxの処理の流れとしては
①jQueryでajax処理を受け付ける⇒
②CakePHPの指定されたConrollerのActionを呼び出して任意の処理を実行⇒
③ajaxのdone(成功した場合)やfail(失敗した場合)の処理フローを実行
となります。
CakePHPのControllerのActionでは対応したviewの表示がないので、viewの読み込みがされないようにします。
$this->autoRender = false;また、ControllerのActionからajaxへ処理を返すしたりデータを返すにはechoを使用します。(returnではエラーとなってしましました。。なぜだろう)
その際のデータ型はajaxで指定しているものを使用します。
PHPのクラスオブジェクトで返そうとしたらだめでした。
まとめ
config>rout.php内のCSRF機能を無効化することでセキュリティレベルを下げてアクセスできるようにしているので必要におおじて別途対応が必要かなと思います。
あと、ajaxの記載方法もバージョンによって変わっているようなので、ネットで調べる際には注意が必要そうです。
コメント