web入門
すばらしきwebの世界

Laravel5.2 jquery ajax通信でjsonを受け取る

2016.10.10jquery, Laravel, php, フロントエンド


LaravelのJSONレスポンスについて通常のリクエスト、レスポンスの場合とAjaxリクエスト、レスポンスで受け取るのでは挙動が違うみたいだったので備忘録として残します。


通常のリクエストレスポンス

laravelではコレクションや配列をそのまま返却するとjsonで返してくれます。

以下はコレクションを返却しています。

これを通常のHTTPリクエストでアクセスするとwebブラウザに以下のように表示されjsonレスポンスが返されることを確認できます。

{“price”:100}


ajaxのリクエストレスポンス

jsonで返却されることが確認出来たので、ajax通信をしてjsonレスポンスを受け取ります。


サーバ側でJSONへ変換しない

上記で確認したようにコレクションを返却してもjsonが返ってくるので、何も考えずajax通信してjsonを受け取ります。

以下、クライアント側のajaxです。

ところが、これで返ってくる値には中身が何も入っていないので、jsonパースでエラーとなります。


サーバ側でJSONへ変換する

ajax通信ではjsonレスポンスにならない原因はさて置いて、サーバ側でjsonに変換してクライアントへレスポンスを返すようにしました。

jsonで受け取れました。


最後に

ajax通信時にレスポンスのデータタイプにJSONを指定すること。