JavaScript에서 쿠키 작업 개체의 적용을 구성합니다.
- WBOY앞으로
- 2022-08-05 11:35:331455검색
이 글은 쿠키 작업 객체의 적용과 관련된 문제를 주로 소개하는 javascript에 대한 관련 지식을 제공합니다. 쿠키는 웹 애플리케이션이 사용자 관련 정보를 저장하는 데 유용한 방법을 제공합니다. .
【관련 권장 사항: javascript 비디오 튜토리얼, web front-end】
Javascript에서 쿠키를 작동하는 방법
쿠키는 웹 애플리케이션이 사용자 관련 정보를 저장하는 유용한 방법을 제공합니다. 예를 들어, 사용자가 당사 사이트를 방문할 때 쿠키를 사용하여 사용자 기본 설정이나 기타 정보를 저장하면 다음 번에 사용자가 당사 사이트를 방문할 때 애플리케이션이 이전에 저장된 정보를 검색할 수 있습니다.
쿠키란 도대체 무엇인가요?
쿠키는 사용자 요청 및 페이지와 함께 웹 서버와 브라우저 간에 전달되는 작은 텍스트 정보입니다. 쿠키에 포함된 정보는 사용자가 사이트를 방문할 때마다 웹 애플리케이션에서 읽을 수 있습니다.
쿠키는 사용자의 정보를 저장하는 문제를 해결하기 위해 등장합니다. 예를 들어
사용자가 웹페이지를 방문할 때 사용자의 이름이 쿠키에 저장될 수 있습니다.
다음번에 사용자가 페이지를 방문할 때 쿠키는 사용자 이름을 기억합니다.
쿠키는 모든 웹페이지의 사용자 정보를 기억할 수 있습니다. 문자열 형식의 정보를 포함하며 키-값 쌍 형식, 즉 키=값 형식으로 저장됩니다. 각 쿠키는 일반적으로 ";"로 구분됩니다.
username = Daisy Green
쿠키 단점
쿠키가 비활성화될 수 있습니다. 사용자가 개인 정보 보호에 큰 관심을 기울이면 브라우저의 쿠키 기능이 비활성화될 가능성이 높습니다.
쿠키는 브라우저와 관련되어 있습니다. 즉, 동일한 페이지를 방문하더라도 서로 다른 브라우저에 저장된 쿠키는 서로 접근할 수 없습니다.
쿠키는 삭제될 수 있습니다. 각 쿠키는 하드 디스크에 있는 파일이기 때문에 사용자가 삭제할 가능성이 높습니다.
쿠키 보안이 충분히 높지 않습니다. 모든 쿠키는 일반 텍스트 형태로 파일에 기록되므로 사용자 이름, 비밀번호, 기타 정보를 저장하려면 미리 암호화하는 것이 가장 좋습니다.
Cooke 작동 방식
서버는 일부 데이터를 쿠키 형식으로 방문자의 브라우저에 보냅니다. 귀하의 브라우저가 쿠키 허용을 허용하는 경우. 이는 방문자의 하드 드라이브에 일반 텍스트 기록으로 저장됩니다.
방문자가 다른 페이지로 이동하면 브라우저는 검색을 위해 동일한 쿠키를 서버로 보냅니다. 일단 검색되면 서버는 이전에 저장된 내용을 알고 있거나 기억합니다.
Cookie의 구성
Cookie HTTP 헤더 정보 중 HTTP Set-Cookie의 헤더 형식은 다음과 같습니다.
Set-Cookie: name=value; [expires=date]; [path=path]; [domain=domainname]; [secure];
HTTP 코드의 구체적인 예:
<meta http-equiv="set-cookie" content=" cookieName = cookieValue; expires=01-Dec-2006 01:14:26 GMT; path=/" />
위 형식에서 알 수 있습니다. , 쿠키는 다음과 같은 부분으로 구성됩니다.
이름/값 쌍
이름/값은 세미콜론으로 구분됩니다. 쿠키에는 최대 20개의 쌍이 있습니다. 각 웹 페이지에는 최대 1개의 쿠키가 있습니다. 값 값의 경우 encodeURIComponent를 사용하여 인코딩하는 것이 가장 좋습니다.
Domain
도메인 도메인 이름도 쿠키의 일부입니다. 기본적으로 사용자가 방문한 웹페이지의 도메인 이름이 쿠키에 저장됩니다. 이 쿠키의 도메인 이름 값이 설정되면 귀하가 방문하는 서버뿐만 아니라 해당 도메인 이름의 모든 서버가 이 쿠키에 액세스할 수 있음을 의미합니다. 일반적으로 이렇게 하면 안 됩니다. 도메인 이름 설정 형식은 다음과 같습니다. domain=http://xyz.com
path
디렉토리의 어떤 디렉터리 웹 페이지가 특정 서버의 쿠키에 액세스할 수 있는지 설정합니다. 경로 설정 형식은 다음과 같습니다. : path = /movies
Expires
쿠키 생존 시간을 설정하세요. 기본적으로 쿠키는 사용자가 브라우저를 닫을 때 자동으로 삭제됩니다. 쿠키 만료 시간이 설정되어 있지 않으면 사용자가 브라우저를 닫을 때 쿠키가 사라집니다. 브라우저. 이 항목을 설정하시면 쿠키 수명을 연장하실 수 있습니다. Date 객체의 GMT 형식을 사용하여 js에서 시간을 설정합니다. 형식은 다음과 같습니다. 만료 = date.toGMTString()
Secure
true 또는 false 값을 사용합니다. true인 경우 쿠키는 https를 통해 전송되어야 합니다.
js Cookie
JS에서는 Document 개체의 cookie 속성을 사용하여 쿠키를 조작할 수 있습니다. JS는 현재 웹페이지의 쿠키를 읽고, 생성하고, 수정하고, 삭제할 수 있습니다. 구체적인 작업을 살펴보겠습니다.
쿠키 만들기
JS는 document.cookie 속성을 사용하여 쿠키를 만들 수 있습니다.
document.cookie = "username=Daisy Green";
유효한 날짜(UTC 시간)를 추가할 수도 있습니다. 기본적으로 쿠키는 브라우저가 닫힐 때 삭제됩니다.
document.cookie = "username=Daisy Green; expires=Mon, 26 Aug 2019 12:00:00 UTC";
path 매개변수를 사용하면 쿠키가 속한 경로를 브라우저에 알릴 수 있습니다. 기본적으로 쿠키는 현재 페이지에 속합니다.
document.cookie = "username=Daisy Green; expires=Mon, 26 Aug 2019 12:00:00 UTC"; path=/";
Read Cookie
JS를 통해 다음과 같은 쿠키를 읽을 수 있습니다.
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(';');
// Now take key value pair out of this array
for(var i=0; i<cookiearray.length; i++) {
name = cookiearray[i].split('=')[0];
value = cookiearray[i].split('=')[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前端】
위 내용은 JavaScript에서 쿠키 작업 개체의 적용을 구성합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!