読者です 読者をやめる 読者になる 読者になる

フツーって言うなぁ!

フツーなサラリーマンのフツーな嘆き.

Ruby on Rails4.0+jQuery+Ajaxで,JSON(ファイル)を扱う

Rails

検索システムの実装途中に,RailsJSONを扱うこと必要がありました.

無駄に詰まってしまったのと,あまり記事がなかったので,対処法をメモしておきます.

OSはMac OS X 10.9で,
Railsのバージョンは4.0.0.

やりたかったこと

外部スクリプト*1によって取得したJSONJavaScriptに渡したいです.

対処法

config/routes.rb

app/controllers/static_pages_controller.rb

app/assets/javascripts/main.js

JSONを取得するアクションにおいて,クラス変数に送りたいJSONを格納し,別のアクションからrender :jsonを使って返すようにしてます.
でもこれだと別のコントローラからだと受け渡しができないよな…

注意点として,app/views/static_pagesにget_citationに対応するテンプレートファイルget_citation.html.erbが必要であるということ.
これがないと,アクションget_citationを叩く際にテンプレートがないと怒られます.
中身は空でも良いです.

あと,これを実装する前に,外部スクリプトによってJSONファイルを生成し,そこからJavaScriptを使ってJSONを読み出すことを考えていました.*2

そこで,下のように,直接$.getJSONにJSONファイルの相対パス(この例だとJSファイルの1つ上のディレクトリのdata.json)を渡そうとしたのですが,Routing Errorが出て悩みました.

var data = $.getJSON('../data.json',function(data){
    sys.graft({nodes:data.nodes, edges:data.edges})
});
sys.graft(data);

$.getJSONで叩かれるURLを調べると,本来のdata.jsonのパスではなく, 'http://localhost:3000/static_pages/../data.json'
のようになっていて,JavaScript中でもRailsのルーティングが採用されるのだと理解しました.

そこで,上と同様に,JSONファイルからデータを取得するアクションの記述と,それに対するルーティングの設定を行うことで解決しました.

JavaScriptから直接ファイルを読み込むことはできないのかな…
少し不便に感じました.

参考

jQuery内からRailsのActionを叩く - Qiita

JSON/XML形式で出力する - Ruby on Rails入門

*1:おそらくWeb APIなどでも可

*2:ファイルI/Oの遅さを考えて見送ったけど,拡張のしやすさ考えるとこっちの方がいいかも