バックボタン（Chrome）Play FrameworkでHTMLの代わりにJsonを取得

Question

フォーク、 同じリソースのJSONとHTML表現に同じルートを再利用したWebアプリケーションがあります。 foo/details for now。このページはリンクされていますので、/ bar/detailsと呼ぶことにしましょう。 （だから、/ bar/detailsには - >/foo/detailsへのリンクがあります）。

最初のページから2番目のページに行くと、すべて正常に動作します。 Chromeで戻るボタンをクリックすると、元のページがHTMLではなくJSONとしてレンダリングされます。ブラウザでリフレッシュすると、JSONではなくHTML表現が得られます。ここで

は、私はHTML対JSONを検出するために使用しているコードです：

res.result.map { group => 
    render { 
    case Accepts.Html() => Ok(views.html.groups.details(group)) 
    case Accepts.Json() => Ok(Json.toJson(group)) 
    } 
}.getOrElse(NotFound) 

これは、このパターンの標準的な実装であり、それはどこでも動作しますが、私は特定のではChromeで[戻る]ボタンを使用し除く状況。

私はクリアしていない、またはJsonでレンダリングするためにPlayを混乱させるAjaxを使ってページが行っていることがありますか？あるいは、Chromeがページをキャッシュしていますが間違った受け入れヘッダーをキャッシュしますか？

私はJsonとHtmlの2つの異なるルートを使ってこの問題を回避することができますが、私はあきらめているように感じます。

誰でも、このボタンの動作に何が起こっているかについては何か考えていますか？

Answer 1

Chromeのブラウザキャッシュは間違いありませんでした。これは、 "Accept" - > "application/json"と通常のHTML受け入れヘッダーを持つ/ foo/barに対する要求とは区別されません。その結果、HTMLページが読み込まれ、そのページのJavaScriptが生のJSONデータの同じURLに当てられ、次回に戻ったときにChromeはキャッシュされたHTMLの代わりにキャッシュされたJSONを提供します。

その結果、Chrome（およびSafari）がJSONをキャッシュしないように、JSON/REST APIがすべて異なるURLを経由するようにルートを変更する必要がありました。

Answer 2

ケビンあなたは正しいです。しかし、もう一つの解決策があります。

レスポンスヘッダーに "Vary：Accept"を追加すると、chromeやその他のブラウザでこの問題が発生します（Firefox v21など）。jsonとhtmlキャッシュが区別されます。注：私がテストした限り、Vary：Accept-Encodingヘッダーは機能しません。あなたはnginxのを使用している場合

、あなたはこれを設定することができます。http://wiki.nginx.org/HttpProxyModule#proxy_set_header

proxy_set_header Vary Accept;

はしかし、インクルードは、時々キャッシュとは何かを送信されませんヘッダーを受け入れる異なりnginxのに問題があります。 http://wiki.nginx.org/HttpProxyModule#proxy_set_headerを参照してください。これを処理するには、nginxのgzip_varyをオンにすることができますが、これはVary：Accept-Encodingヘッダーを送信します。このヘッダーは問題を解決しません。

私はレールを使用し、私は私が他のサーバ/フレームワークでこれを行うには、他の方法があると確信しているresponse.headers["Vary"]= "Accept"

を修正before_filterを使用。

詳細情報：https://web.archive.org/web/20130114082345/http://blog.sdqali.in/blog/2012/11/27/on-rest-content-type-google-chrome-and-caching/