CakePHPとAngularJSでWebアプリを作る。その4

サーバー側の修正

JSONPってなんだっけ

その3からの続きです。
原因不明で途方に暮れるましたが、ふとAngularJSの

 $http.jsonp(url).success(function(data,status) {

って部分に注目。「JSON」じゃなくて「JSONP」ってなんだっけ？と思いググる。
はてなキーワード:JSONPを読む。フムフム。以下一部を引用。

…JSONP用のAPIでは、関数名＋取得データをjson形式で表記して引数とした形式(例.callbackFunc({id:1000,name:aaa}))のレスポンスが一般的で、…

ん？

例.callbackFunc

！！！ああ、そうでした。以前業務の案件の最中にピュアPHPで「$_GET['callback']」とか、そんな感じのヤツを先頭につけた記憶が蘇って来ました。

リクエストを調べる

こんな時のためにCakePHP側でログを書き出しておきました。

// リクエストをデバッグログに書き出し
  $this->ApiTool->logingRequest($this->request);

/app/controller/HogeUsersController.phpの上記の部分です。
サーバー側でリクエストを受け付けた時に、何かしら値を受け取ってるかもと思い、以下のログファイルを開く。
/app/tmp/logs/debug.log

2013-03-22 13:51:06 Debug: Array
(
    [callback] => angular.callbacks._0
)

ありましたねぇ。この時テンションMAX↑↑↑。

JsonView.phpの修正して確認

JsonView.phpの括弧をつけた部分を以下のように修正します。

 $content = '('.json_encode($data).')';
 if (!empty($this->request->query['callback'])){
  $content = $this->request->query['callback'] . $content;
 }

ブラウザのコンソールを確認してみる。

ちゃんと取得出来てるようです。良かった良かった。

とりあえず今回はここまでです。ではでは。

環境とか

項目	内容
PHPフレームワーク	Cakephp 2.2.5
CSSフレームワーク	Twitter bootstrap 2.2.2
IDE	Eclipse 3.6
開発環境?	MAMP
PC	iMac
OS	Mac OS Lion