Atur aplikasi objek operasi kuki dalam JavaScript

Artikel ini membawa anda pengetahuan yang berkaitan tentang javascript, yang terutamanya memperkenalkan isu yang berkaitan dengan aplikasi objek operasi kuki menyediakan cara yang berguna untuk aplikasi web untuk menyimpan maklumat yang berkaitan dengan pengguna pada kaedah di bawah, saya harap ia akan membantu semua orang.

[Cadangan berkaitan: tutorial video javascript, bahagian hadapan web]

Cara mengendalikan kuki dalam Javascript

Kuki menyediakan cara yang berguna untuk aplikasi web menyimpan maklumat tentang pengguna. Sebagai contoh, apabila pengguna melawat tapak kami, kuki boleh digunakan untuk menyimpan pilihan pengguna atau maklumat lain supaya pada kali berikutnya pengguna melawat tapak kami, aplikasi boleh mendapatkan semula maklumat yang disimpan sebelum ini.

Apa sebenarnya kuki

Kuki ialah sekeping kecil maklumat teks yang dihantar antara pelayan web dan penyemak imbas bersama-sama dengan permintaan dan halaman pengguna. Maklumat yang terkandung dalam kuki boleh dibaca oleh aplikasi web setiap kali pengguna melawat tapak.

Kuki muncul untuk menyelesaikan masalah menyimpan maklumat pengguna. Contohnya

• Apabila pengguna melawat halaman web, nama pengguna boleh disimpan dalam kuki.

• Pada kali seterusnya pengguna melawat halaman, kuki akan mengingati nama pengguna.

Kuki boleh mengingati maklumat pengguna merentas semua halaman web. Ia mengandungi maklumat dalam bentuk rentetan dan disimpan dalam bentuk pasangan kunci-nilai, iaitu, dalam format kunci=nilai. Setiap kuki biasanya dipisahkan dengan ";".

username = Daisy Green

Kelemahan Kuki

Kuki mungkin dilumpuhkan. Apabila pengguna memberi perhatian yang tinggi kepada perlindungan privasi peribadi, dia mungkin akan melumpuhkan fungsi kuki penyemak imbas

Kuki berkaitan dengan penyemak imbas. Ini bermakna walaupun anda melawat halaman yang sama, kuki yang disimpan oleh penyemak imbas berbeza tidak boleh diakses oleh satu sama lain; Oleh kerana setiap kuki ialah fail pada cakera keras, ia berkemungkinan akan dipadamkan oleh pengguna; Semua kuki direkodkan dalam fail dalam bentuk teks biasa, jadi jika anda ingin menyimpan nama pengguna, kata laluan dan maklumat lain, sebaiknya menyulitkannya terlebih dahulu.

Cara Cooke berfungsi

Pelayan menghantar beberapa data ke penyemak imbas pelawat dalam bentuk kuki. Jika penyemak imbas anda membenarkan kuki diterima. Ia disimpan pada pemacu keras pelawat sebagai rekod teks biasa. Apabila pelawat melompat ke halaman lain, penyemak imbas menghantar kuki yang sama ke pelayan untuk mendapatkan semula. Sebaik sahaja ia diperoleh semula, pelayan anda mengetahui atau mengingati perkara yang disimpan sebelum ini.

Komposisi Kuki

Kuki Dalam maklumat pengepala HTTP, format pengepala HTTP Set-Cookie adalah seperti berikut:

Dalam Contoh khusus dalam kod HTTP:

Set-Cookie: name=value; [expires=date]; [path=path];
[domain=domainname]; [secure];

Seperti yang dapat dilihat daripada format di atas, Kuki terdiri daripada bahagian berikut.

<meta http-equiv="set-cookie" content=" cookieName = cookieValue;
expires=01-Dec-2006 01:14:26 GMT; path=/" />

Pasangan nama/Nilai

Nama/Nilai dipisahkan dengan koma bertitik Satu kuki boleh mempunyai sehingga 20 pasangan panjang Nilai tidak boleh melebihi 4K. Untuk nilai Nilai, sebaiknya mengekodkannya dengan encodeURIComponent.

Domain

Nama domain domain juga merupakan sebahagian daripada kuki Secara lalai, nama domain halaman web yang dilawati oleh pengguna akan disimpan dalam kuki. Jika nilai nama domain kuki ini ditetapkan, ini bermakna semua pelayan pada nama domain, bukan hanya pelayan yang anda lawati, boleh mengakses kuki ini Secara amnya, anda tidak sepatutnya melakukan ini. Format penetapan nama domain adalah seperti berikut: domain=http://xyz.com

laluan

Tetapkan direktori mana untuk pelayan tertentu untuk mengakses kuki halaman web. Format menetapkan laluan ialah: path = /movies

Tamat tempoh

Tetapkan masa kelangsungan kuki Secara lalai, kuki dipadamkan secara automatik apabila pengguna menutup pelayar. Jika tidak Tetapkan masa tamat tempoh kuki supaya kuki hilang apabila pengguna menutup pelayar. Jika anda menetapkan item ini, anda boleh memanjangkan hayat kuki. Tetapkan masa dalam js menggunakan bentuk GMT bagi objek Tarikh Formatnya adalah seperti berikut: tamat tempoh = date.toGMTString()

Secure

mengambil benar atau palsu. nilai. Jika benar, kuki mesti dihantar melalui https. js Cookie

Dalam JS, anda boleh menggunakan atribut kuki objek Dokumen untuk memanipulasi kuki. JS boleh membaca, mencipta, mengubah suai dan memadam kuki halaman web semasa Mari kita lihat operasi khusus.

Buat Kuki

JS boleh mencipta kuki menggunakan atribut document.cookie boleh dibuat dengan cara berikut:

Anda juga boleh menambah Tarikh yang sah (waktu UTC). Secara lalai, kuki dipadamkan apabila penyemak imbas ditutup:

document.cookie = "username=Daisy Green";

Dengan parameter laluan, anda boleh memberitahu penyemak imbas laluan kepunyaan kuki itu. Secara lalai, kuki kepunyaan halaman semasa.

document.cookie = "username=Daisy Green; expires=Mon, 26 Aug 2019 12:00:00 UTC";

Baca Kuki

document.cookie = "username=Daisy Green; expires=Mon, 26 Aug 2019 12:00:00 UTC"; path=/";

Melalui JS, anda boleh membaca kuki seperti ini:

var x = document.cookie;

document.cookie 会在一条字符串中返回所有 cookie，比如：cookie1=value; cookie2

事例：

<html>
   <head>   
      <script type = "text/JavaScript">
         <!--
            function ReadCookie() {
               var allcookies = document.cookie;
               document.write ("All Cookies : " + allcookies );
                
               // Get all the cookies pairs in an array
               cookiearray = allcookies.split(&#39;;&#39;);
                
               // Now take key value pair out of this array
               for(var i=0; i<cookiearray.length; i++) {
                  name = cookiearray[i].split(&#39;=&#39;)[0];
                  value = cookiearray[i].split(&#39;=&#39;)[1];
                  document.write ("Key is : " + name + " and Value is : " + value);
               }
            }
         //-->
      </script>      
   </head>
    
   <body>     
      <form name = "myform" action = "">
         <p> click the Button to View Result:</p>
         <input type = "button" value = "Get Cookie" onclick = "ReadCookie()"/>
      </form>      
   </body>
</html>

改变 cookie

通过使用 JS，咱们可以像创建 cookie 一样改变它：

document.cookie = "username=Steve Jobs; expires=Sun, 31 Dec 2017 12:00:00 UTC; path=/";

这样旧 cookie 会被覆盖。

事例：

<html>
   <head>   
      <script type = "text/JavaScript">
         <!--
            function WriteCookie() {
               var now = new Date();
               now.setMonth( now.getMonth() + 1 );
               cookievalue = escape(document.myform.customer.value) + ";"
                
               document.cookie = "name=" + cookievalue;
               document.cookie = "expires=" + now.toUTCString() + ";"
               document.write ("Setting Cookies : " + "name=" + cookievalue );
            }
         //-->
      </script>      
   </head>
    
   <body>
      <form name = "myform" action = "">
         Enter name: <input type = "text" name = "customer"/>
         <input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
      </form>      
   </body>
</html>

删除 cookie

删除 cookie 非常简单，不必指定 cookie 值：直接把 expires 参数设置为过去的日期即可：

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

应该定义 cookie 路径以确保删除正确的 cookie。如果不指定路径，有些浏览器不会让咱们删除 cookie。

事例：

<html>
   <head>   
      <script type = "text/javascript">
         <!--
            function WriteCookie() {
               var now = new Date();
               now.setMonth( now.getMonth() - 1 );
               cookievalue = escape(document.myform.customer.value) + ";"
                
               document.cookie = "name=" + cookievalue;
               document.cookie = "expires=" + now.toUTCString() + ";"
               document.write("Setting Cookies : " + "name=" + cookievalue );
            }
          //-->
      </script>      
   </head>
    
   <body>
      <form name = "myform" action = "">
         Enter name: <input type = "text" name = "customer"/>
         <input type = "button" value = "Set Cookie" onclick = "WriteCookie()"/>
      </form>      
   </body>
</html>

【相关推荐：javascript视频教程、web前端】

Atas ialah kandungan terperinci Atur aplikasi objek operasi kuki dalam JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!