Home > スポンサー広告 > User JavaScriptの練習 - Cookieにデータを保存する

スポンサーサイト

スポンサー広告

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Comments:-

Comment Form

Trackback+Pingback:-

TrackBack URL for this entry
http://karafuto50.blog117.fc2.com/tb.php/152-0707542a
Listed below are links to weblogs that reference
スポンサーサイト from Karafuto Blog

Home > スポンサー広告 > User JavaScriptの練習 - Cookieにデータを保存する

Home > user javascript > User JavaScriptの練習 - Cookieにデータを保存する

User JavaScriptの練習 - Cookieにデータを保存する

user javascript

Opera User JavaScriptです。

Cookieは「document.cookie」でスクリプトから参照することができる。読み書きが可能。

Cookieに書き込む内容
名前 = 値
Cookieの名前と値。値にセミコロン、カンマ、空白、日本語などの2バイト文字を使うにはエンコード(URLエンコードなど)が必要になる。この属性のみ必須。
expires = 日付
有効期限。日付はGMT形式。過去の日付が書かれると削除される。有効期限(expires、max-age両方)を省略すると、セッションが終わる時 Cookieは削除される。
max-age = 秒数
有効期限。 expiresと違い秒数で指定する。 0が設定されると Cookieは削除される。省略すると、上のとおりセッションの後削除される。
domain = ドメイン名
ドメインを指定する。省略するとサーバのホスト名になる。
path = パス
URLのパスを指定する。省略すると documentのパスになる。
secure
セキュリティの設定。安全な接続時(HTTPSなど)のみ送信される。
Cookieの制限
Cookieのサイズは 4KBまで。サーバもしくはドメインにクッキーの数は20まで。
Operaで Cookieを有効にするには、
右クリックしてサイト設定>Cookie(または設定>詳細設定>Cookie)の「Cookieを許可する」か「アクセスしているサイトからの Cookie のみ許可する」をチェックする。
Operaで Cookieの情報を見るには、
右クリックしてサイト設定>Cookie(または設定>詳細設定>CookieのCookie 設定)から選択する。「名前 = 値」のセットを一つずつ見ることができる。
または、JavaScriptの「alert(document.cookie)」でも見れる。が、「名前 = 値」すべてのデータがごっちゃになっているから見づらい。

Cookieの読み取り、書き込みのテスト

userjs_setcookie_operacount.png

  1. ドメインが「opera.com」のページを開いたら、Cookieを読み取り、'historyCount'の名前が見つかればその値を取得する。
  2. 訪問回数を 1回足して、Cookieに書き込む。
  3. 訪問回数を左上に表示する。
  4. 左上(3.)をクリックすると、クッキーを削除する。
  5. 有効期限は 1週間。1週間サイトに訪れなければCookieは消去される。
// ==UserScript==
// @include http://*.opera.com/*
// ==/UserScript==

if (document.domain.indexOf('.opera.com') > -1){
    document.addEventListener('DOMContentLoaded', function (){

        function Cookie(name, value, domain, path, second){
            this.name = name;
            this.value = value;
            this.domain = domain;
            this.path = path;
            this.second = second;
        }

        // Cookieの情報を取得
        Cookie.prototype.get = function (){
            var c = document.cookie;
            var v = c.split(';');
            for (i = 0; i < v.length; i ++ ){
                if (v[i].indexOf(this.name + '=') != -1){
                    this.value = v[i].substring(v[i].indexOf('=', this.name.length) + 1);
                    break;
                }
            }
        }

        // Cookieを書き込む
        Cookie.prototype.set = function (){
            var v = this.name + '=' + this.value + '; domain=' + this.domain +
                    '; path=' + this.path + '; max-age=' + this.second;
            document.cookie = v;
        }

        // Cookieのデータを表示
        Cookie.prototype.display = function (){
            var element = document.createElement('div');
            this.element = element;
            element.style.cssText = 'position: absolute; top: 10px; left: 5px; color: black;' +
                                    'background-color: white; font-size: 14px; z-index: 5;' +
                                    'padding: 3px; border: solid 1px black;';
            element.innerHTML = this.value;
            document.body.appendChild(element);
        }


        var ck = new Cookie('historyCount', 0, '.opera.com', '/', 60 * 60 * 24 * 7);
        ck.get();
        ck.value ++ ;
        ck.set();
        ck.display();

        // クリックでクッキーを削除
        ck.element.addEventListener('click', function (){
            ck.second = 0;
            ck.set();
            this.style.display = 'none';
        }, false);

    }, false);
}

参考にしたページ

Comments:0

Comment Form

Trackback+Pingback:0

TrackBack URL for this entry
http://karafuto50.blog117.fc2.com/tb.php/152-0707542a
Listed below are links to weblogs that reference
User JavaScriptの練習 - Cookieにデータを保存する from Karafuto Blog

Home > user javascript > User JavaScriptの練習 - Cookieにデータを保存する

おまかせリンク(R)
全記事表示リンク
Search
Meta
Feeds

Page Top

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。