質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

90.34%

  • jQuery

    7101questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • Ruby on Rails 4

    2464questions

    Ruby on Rails4はRubyによって書かれたオープンソースのウェブフレームワークです。 Ruby on Railsは「設定より規約」の原則に従っており、効率的に作業を行うために再開発を行う必要をなくしてくれます。

  • Cookie

    197questions

    HTTPにおけるCookieとは、クライアントのウェブブラウザ上に保存された一時的なデータを指します。クライアント側のJavaScriptでも、サーバー側のHTTPヘッダーでもクッキーの読み書き・修正・削除が可能です。

cookieに値を保存できません。

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 1,881

s.k

score 249

前提・実現したいこと

サイトで閲覧履歴を実装したいと考えております。
つい先日まで閲覧した投稿のidをcookieに保存して配列で取り出すことができていたのですが、何かをきっかけにすっかり保存できなくなってしまいました。

思い当たるのは、rake db:migrateやrake db:migrate:resetをしたことくらいです。

発生している問題・エラーメッセージ

cookieに投稿の値を保存することができません。

該当のソースコード

[microposts/show.html.erbのページソース]

<script>
$(function(){
  var micropost = "7"; //投稿idを取得
  var cookie_name = 'recently_viewed_microposts'; //cookieの保存名を取得
  var viewed_microposts = []; //配列を生成
  var delete_micropost = false;
  $.cookie.defaults.path = "/";

  // 既にクッキーが存在している場合は、ストリングを配列にする
  if($.cookie(cookie_name)){
    viewed_microposts = $.cookie(cookie_name).split(",");
  }


  // 重複していなければ、itemを配列に追加
  if($.inArray(micropost, viewed_microposts)<0){
    viewed_microposts.push(micropost);
  }

  // 5個以上ならば1つ削除
  if (viewed_microposts.length >= 6){
    viewed_microposts.shift();
  }

  // 配列をクッキ―に保存
  $.cookie(cookie_name, viewed_microposts);

});

[index.html.erb]

<% histories = [] %>
<% histories = cookies[:recently_viewed_microposts].split(",") ★unless★ cookies[:recently_viewed_microposts].nil? %>

★unless以下を削除すると以下のエラーがでます★

undefined method `split' for nil:NilClass

試したこと

・変数名の値を変えてみましたがだめでした。
・いったん、cookieをすべて削除して再度試しましたがだめでした。

補足情報(言語/FW/ツール等のバージョンなど)

Rails で jquery.cookie.js を使って閲覧履歴を表示してみた

追加情報

ブラウザに cookie は保持されているか調べたでしょうか。
デベロッパーツールより。

_workspace_session    LzR4R1pvZDJvN2ZUc05KcEJQZG1LaCt2K3llSGlqYmU5azJpaFFURGVDcGRYZkt1NG5YbFFEUWo4bHgzMGNabE9aMzYrS3NRdEp5VXE0dDJ1cVN1OFNmTnVDV3lLclEwWkRKVlNrVWNLL3RFc0wzR0JQTzFlaTBCWk91OVIrYmxQa1dpUVZRaU1SOGZSQzhhRnA4dnVlckhKdnphZVZXWS85NHpOb3ZQLyt6TVhIV2ZmTVhJdml3aExFR2pwdWVkYzFseU96VndSSC9ZYmZZNmJlcTRoai9hc3E4eE1LV2dQdlNqd0FFSW5LVT0tLUt4YkQ3eS9Cdml4WHVZSUx4TjdwSWc9PQ%3D%3D--e9b8d4f644d6af663f98fc5403a5d0e5ea8e16ba    third-app-sagae.c9users.io    /    Session    416    ✓            
c9.live.user.jwt    eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6IjE0MTU4NzQiLCJuYW1lIjoic2FnYWUiLCJjb2RlIjoiOWMzYzE2RUVkUWlnSzNNZlFOUkIiLCJpYXQiOjE0ODM2OTk4ODEsImV4cCI6MTQ4Mzc4NjI4MX0.5tuj6tolKN4LZ4__5HGFD3DSF1qA3s6jQioDNXBteGw    .c9users.io    /    2017-01-07T10:51:22.099Z    224    ✓    ✓        
c9.live.user.sso    eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpZCI6IjE0MTU4NzQiLCJuYW1lIjoic2FnYWUiLCJpYXQiOjE0ODM2OTk4ODEsImV4cCI6MTQ4Mzc4NjI4MX0.GmlT30wb6tv9hgpXNFmAQDEhUwYkN9JVFyHDwofr484    .c9users.io    /    2017-01-07T10:51:22.099Z    184    ✓            
remember_shop_token    W1sxXSwiJDJhJDExJGJZeFlMMzJQcURuSFBua2lRZ2htdmUiLCIxNDgzNzQ5NjU2LjUyNDc5NTMiXQ%3D%3D--9ac866d419e3b5f1aa687e31ca24b120a6830e3e    third-app-sagae.c9users.io    /    2017-01-21T00:40:57.391Z    145

【リクエスト内容】

This request did not send any cookie data.

【レスポンス内容】

This response did not set any cookies.
This response did not contain a P3P Header.
  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • s.k

    2017/01/07 12:26

    クライアント/サーバー間もありませんでした!

    キャンセル

  • SurferOnWww

    2017/01/07 14:11

    > これは保持されていない!ということでいいんですよね?  <== そこは質問者さんの方で確実にしてもらわないと・・・ 何を・どのタイミングで・どういうツールを・どのように使って調べた結果なのかが分からない第三者としては何とも言えません。 「保持されていない」というのが確実であれば、クッキーを設定しようとしているクライアントスクリプトに問題がありそうだということで、次にステップとしてそこを重点的に調べるということになると思いますが。

    キャンセル

  • s.k

    2017/01/07 15:20

    ありがとうございます!指定したセッション名がデベロッパーツールに存在していなかったこととクライアントとサーバー間にクッキーが存在していなかったことから「保持されていない」と判断しました。もう一度、コードを見返してみます。

    キャンセル

回答 1

checkベストアンサー

+1

クッキーを設定するスクリプトには間違いはないとして(ちょっと怪しい気がしますが)、パスの問題で、クッキーを設定したページのあるディレクトリ以外にあるページを要求した場合は、クッキーが送信されないということはないですか?

jQuery プラグインの cookie は使ったことがないので分かりませんが、JavaScript の document.cookie と同様だとすると、path の設定を省略した場合、クッキーがブラウザに保存される時そのページのディレクトリがパスに設定されます。例えば、surferonwww.info/test/abc.aspx というページでクッキーを設定するとパスは /test/ になります。

その場合は、surferonwww.info/xyz.aspx というページを要求しても、surferonwww.info/test/abc.aspx で設定したクッキーは送信されません(要求ヘッダに含まれません)。

surferonwww.info/test/abc.aspx で設定したクッキーが、surferonwww.info ドメイン下の全てのディレクトリ&全てのページで送信されるようにするには document.cookie の場合は path='/' というオプションを設定する必要があります。

jQuery プラグインの cookie も同じではないですか? ちょっとググって調べた限りですが path: "/" というオプションが設定できるようですし、それがないと現在の文書のパスがデフォルトとして設定されるという記事も見かけました。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2017/01/07 18:37

    間違っていたらすみません。
    スクリプトコードを書いているファイル内でクッキーを取り出して表示されるか確認をしてみろ、ということでしょうか?それで、試したところ、何も表示されませんでした。。。
    $.cookie.defaults.path = "/";これでは全ディレクトリを対象に設定されていないということでしょうか?

    キャンセル

  • 2017/01/07 19:26

    > スクリプトコードを書いているファイル内でクッキーを取り出して表示されるか確認をしてみろ、ということでしょうか?

    スクリプトを実行後、そのドメインのクッキーを全部表示してみてはいかがですか? 質問者さんの使っているツールが何だか分かりませんので可能かどうか不明ですが、IE の開発者ツールなら先のコメントで書いた手順で可能です。

    > $.cookie.defaults.path = "/";

    それでデフォルトでパスが "/" になるのですね? 知りませんでした。そうするとパスの問題はなさそうですね。

    別途、jQuery プラグインの cookie を入手して、質問者さんのコードを試してみます。

    ところで、その行の下のスクリプト $.cookie('cookie_name', value, { expires: 365 }); の value が何だか不明ですが、そのスクリプトで cookie_name という名前のクッキーは設定されてないのでしょうか?

    キャンセル

  • 2017/01/07 19:45

    わかりました!
    僕はchromeを使っています。cookieを表示してみます。

    お手数おかけします(´;ω;`)
    休日にすみません。。。

    $.cookie('cookie_name', value, { expires: 365 });は間違えて質問に載せてしまいました。
    このコードは質問をする前に試してみようと、とりあえず置いたものです。
    このコードを削除しても表示に変化はありませんでした。
    質問も編集しておきます!

    キャンセル

  • 2017/01/07 19:51

    cookieを表示してみたのですが、僕が設定した名前と値のクッキーはありませんでした…

    キャンセル

  • 2017/01/07 20:46

    jQuery のバージョンは 1.8.3、jQuery プラグイン cookie は以下のページから入手した Ver.1.4.1、設定するスクリプトは質問者さんの最初の質問にあるコード(修正後のもの)をそのままコピペして試して見ました。ブラウザは Chrome 49.0.2623.112 m です。

    https://plugins.jquery.com/cookie/

    実行すると、以下の画像の通り期待通りクッキーが設定されます。

    http://surferonwww.info/BlogEngine//image.axd?picture=2017%2f1%2fjQueryCookieChrome.jpg

    そして、その状態で別のページを要求してみると、以下の画像(Fiddler でのキャプチャ画面)のとおり、要求ヘッダに設定したクッキーが含まれてサーバーに送信されます。

    http://surferonwww.info/BlogEngine//image.axd?picture=2017%2f1%2fjQueryCookieFiddler.jpg

    というわけで、ちゃんと期待通りの動きをしてます。質問者さんの方でも同様な結果が得られるはずなのですが・・・

    キャンセル

  • 2017/01/07 20:52

    そうなんですか…
    ということはやはりプラグインの設定をいつの間にかいじってしまったのでしょうか…
    gemでcookie-jQuery-railsというものを入れたので、その環境設定をもう一度洗い直してみます(´;ω;`)

    キャンセル

  • 2017/01/08 00:04

    今、もういちどみたら正常に機能してました…
    原因がわかりませんが、、、

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 90.34%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

同じタグがついた質問を見る

  • jQuery

    7101questions

    jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

  • Ruby on Rails 4

    2464questions

    Ruby on Rails4はRubyによって書かれたオープンソースのウェブフレームワークです。 Ruby on Railsは「設定より規約」の原則に従っており、効率的に作業を行うために再開発を行う必要をなくしてくれます。

  • Cookie

    197questions

    HTTPにおけるCookieとは、クライアントのウェブブラウザ上に保存された一時的なデータを指します。クライアント側のJavaScriptでも、サーバー側のHTTPヘッダーでもクッキーの読み書き・修正・削除が可能です。