CakePHP3でAjaxを使った時にデータがjsonにならなくて困った時の対処法

CakePHP3でAjaxを使った時にデータがjsonにならなくて困った時の対処法

50 回閲覧されました

みなさんこんにちは、jonioです。

CakePHPでテンプレートでAjaxを使った時にコントローラーにデータが渡ってコントローラーからjsonデータをテンプレートに返しますがコントローラーから送るデータがなぜかjsonにならずに苦労して対応した話です。

CakePHPのバージョン

3.6です。

jsonデータにできなかった時の状況

コントローラーに下記の記述をしていました。

$data = $this->getRequest()->getData('user_id');

$user = $this->Users->get($data);

$this->set(compact('user'));
$this->set('_serialize', 'user');

コントローラーから返すデータは下記の形式になります。

$user = [ 
            'id' => 1, 
            'name' => 'John Doe'
];

そしてテンプレートに下記の記述をしました。


$.ajax({
    url: '/timerecorders/shared/attendance-logs',
    method: 'GET',
    data: { user_id: selectedUserId },
    dataType: 'json',
    success: function(response) {
        console.log(response);
        


responseはjsonデータになるので下記の形式にならないといけません。

{ "user": { "id": 1, "name": "John Doe" } }

しかし下記になりました。

(4) [{}, {}, {}, {}]

jsonデータではありませんでした。

原因

恐らく下記のコードです。

$this->set(compact('user'));
$this->set('_serialize', 'user');

これを使う時は「$this->response = $this->response->withType(‘application/json’);」の記述もしないといけないみたいですがうまくいきませんでした。

他にも記述しないといけない内容があるか記述自体が間違っているのかもしれません。

対応

コントローラーのコードを下記に変えました。

$data = $this->getRequest()->getData('user_id');

$user = $this->Users->get($data);

return $this->getResponse()->withType('application/json')->withStringBody(json_encode(['user' => $user]));

このコードだと5行目だけでデータをjsonにできます。

テンプレートで確認したら下記になっていました。

{user: {}}

期待していたjsonのデータです。