집 >웹 프론트엔드 >JS 튜토리얼 >AngularJs 운영 쿠키 예제 공유

AngularJs 운영 쿠키 예제 공유

小云云원래의: 2018-03-08 15:26:121751검색

쿠키는 클라이언트측 기술이라고 할 수 있습니다. 이 프로그램은 사용자의 정보 중 일부를 쿠키 형태로 사용자의 해당 브라우저에 기록합니다. 직설적으로 말하면, 사용자의 신원을 확인하기 위해 웹사이트가 사용자의 컴퓨터에 저장하는 데이터입니다. 많은 쇼핑 웹사이트의 장바구니 기능과 포럼 자동 로그인 기능은 쿠키로 구현됩니다.

쿠키에 대한 작업에는 저장, 검색 및 삭제가 포함됩니다.

Angular는 사용자의 편의와 쿠키 운영의 단순성을 위해 ngCookies 모듈을 제공합니다. 이 모듈에는 2가지 서비스가 제공됩니다. 즉:

$cookieStore 서비스
$cookies 서비스

먼저 $cookies에 대해 이야기해 보겠습니다.

$cookies는 jQuery.cookie.js와 유사하며 다음을 제공합니다. Angular 작업 쿠키 메서드 일반적인 상황에서 JavaScript는 쿠키에 개체를 쓸 수 없지만 Angular는 쿠키에 개체를 쓰는 메서드를 제공합니다. $cookies는 다음과 같은 방법을 제공합니다:

get(key) 返回一个指定key的cookie值
getObject(key) 返回一个指定key的反序列化cookie值
getAll() 以key-value对象形式返回所有的cookie
put(key,value,[options]) 写入一个key-value的cookie
putObject(key,value,[options])序列化设置一个key-value的Cookie
remove(key,[options]) 移除对应key的cookie
demo:比如用户登录，记住密码的cookie有效期是7天。
  var cookieInfo= {};
  cookieInfo.username = $scope.username;
  cookieInfo.password = $scope.password;
  var expireDate = new Date();
  expireDate.setDate(expireDate.getDate() + 7);//设置cookie保存7天
  $cookies.putObject("user", cookieDate, {&#39;expires&#39;: expireDate});
获取也很方便：
$scope.ID = $cookies.getObject("user").username;
$scope.sid = $cookies.getObject("user").password;
简单的只有一个key-value的话用put()比较简单，但是是过期时间是session，关闭浏览器就没有了。
$cookies.put(&#39;myFavorite&#39;, &#39;oatmeal&#39;);
再说说$cookieStore ，$cookieStore服务是基于后端的Session Cookies，所以写入的时候不能使用options属性，
而且它的过期时间就是session。关闭浏览器了，cookie就失效了。
$cookieStore不可以通过设置default里面的expires来设置过期时间，$cookieStore操作Cookie都是基于Session过期的。
所以上面的例子你如果使用$cookieStore来实现记住用户名和密码的话，关闭浏览器cookies就失效了，无法达到记住n天的这个功能。
$cookieStore.put("user", {
                username:aaa,
                password:123
               expires: new Date(new Date().getDate() + 5000)
            });

이렇게 하면 만료 시간이 무효화됩니다! ! ! !

요약:

ngCookies 모듈에서 제공하는 $cookies 서비스는 개발자가 쿠키를 읽고 쓸 수 있는 뛰어난 편의성을 제공하며, 개체 쓰기 및 읽기도 지원하므로 더욱 편리하고 사용하기 쉽습니다. 그 당시 개발 과정에서 우리는 여전히 쿠키에 너무 많은 데이터를 쓸 수 없었습니다. 첫째, 쿠키의 크기는 제한되어 있었습니다. 반면에 쿠키에 민감한 데이터를 쓰는 것은 보안 측면에서 위험했습니다. 비밀번호는 암호화 방식으로 백엔드와 합의해야 하며 일반 텍스트로 직접 저장할 수 없으므로 매우 안전하지 않습니다. 쿠키를 사용할 때는 주의가 필요하며, 경로와 도메인의 함정에 더 주의를 기울이면 문제가 발생하지 않습니다.

마지막으로: Angular 공식 웹사이트에서는 $cookieStore가 더 이상 사용되지 않으며 $cookies 서비스 사용을 권장한다는 점을 상기시켰습니다.

AngularJs 운영 쿠키 예제 공유

관련 기사