html如何实现自动登录,Js实现下次自动登录功能

场景：

1、登录完成关闭标签页，打开新的标签页，免登录；

2、登录完成，关闭浏览器，再打开浏览器，免登录(下次自动登录)；

一般使用浏览器cookie作为保存数据的载体。

在登录成功时，保存相关数据：

1、页面登录HTML

UserName:

Password

2、Login登录按钮及注销相关JS处理

$("#login").on('click', login);

const LOGIN_TIME = 7*24*60*60*1000; // 1个星期

function login(){

var name = $("#userName").val();

var password = $("#password").val();

// 此处应校验

// 此处是下次自动登录的关键(增加expires)

var date = new Date();

// 可下次登录时间长度，单位毫米，此处为1个星期

date.setTime(date.getTime() + LOGIN_TIME);

// ajax请求成功，需要cookie存储,数据应加密

var sid = data.sessionId; // 这是登录成功返回的认证标志

document.cookie = "USERNAME=" + Base64.encode(name) + ";path=/;expires="+date.toGMTString();

document.cookie = "SID=" + Base64.encode(sid) + ";path=/;expires="+date.toGMTString();

// 跳到主页面

}

// 注销/退出登录状态，需要清除cookie

function logout(){

var date = new Date();

date.setTime(date.getTime() - 60*60*1000);

document.cookie = "USERNAME;path=/;expires="+date.toGMTString();

document.cookie = "SID=;path=/;expires="+date.toGMTString();

// 跳到登录页

}

3、校验是否是自动登录

function initData(){

if(!getCookie("USERNAME") || !getCookie("SID")){

// 跳到登录页

}else{

// 跳到主页面

}

function getCookie(cookieName){

cookieName += "=";

var cookieList = document.cookie.split(";");

for(var i= 0; i< cookieList.length; i++){

var cookieItem = cookieList[i].trim();

if(cookieItem.indexOf(cookieName) != -1){

return cookieItem.substring(cookieName.length, cookieItem.length);

}

return '';

}

initData();

html如何实现自动登录,Js实现下次自动登录功能相关推荐

html实现自动滚动,js实现滚动条自动滚动
本文实例为大家分享了js实现滚动条自动滚动的具体代码,供大家参考,具体内容如下效果类似于直播网站的评论,会一条接着一条向上 go out : js部分很简单:通过控制scrolltop的值来实现自动 ...
HTML列表内容自动排序,JS实现HTML表格排序功能
本文实例为大家分享了JavaScript实现HTML表格排序功能,供大家参考,具体内容如下 HTML代码: click me click me click me click me 15.43 700 ...
vue 记住密码下次自动登录
<span><input type="checkBox" name="adviceCheck" id="adviceCheck&qu ...
Cookie-网站登录-下次自动登录
做网站前端用户登录时需要有个下次自动登录的功能.看了看各大网站都有这种功能. 问题描述:用户登录网站时,一般有个checkbox让用户选择是否可以下次自动登录.选择后,即使用户关闭浏览器,下次再访问这 ...
php中实现记住密码下次自动登录的例子
做网站的时候经常会碰到要实现记住密码,下次自动登录,一周内免登陆,一个月内免登陆这种需求.这种功能一般都是通过cookie来实现的.本篇文章将简单说一下如何使用php实现该需求的.当然实现该需求的方法 ...
使用js cookie实现自动登录
getElementsByTagName() 方法可返回带有指定标签名的对象的集合 var myParagragh = document.getElementsByTagName("p&qu ...
使用Auto.js完成一键自动登录武汉理工大学鉴湖宿舍校园网（安卓手机端）
文章目录前言一.准备参考文章:[Auto.js实战](https://zhuanlan.zhihu.com/p/331532310) 下载Auto.js 关于表单的获取关于MAC地址的获取二 ...
html如何实现自动登录,JS实现两周内自动登录功能
本文实例为大家分享了Android九宫格图片展示的具体代码,供大家参考,具体内容如下两周内自动登录两周内自动登录 var oTxt1 = document.getElementsByName('u ...
Cookie实现用户登录记住密码,实现自动登录
什么是Cookie 在java是一个类,一对键和值组成,键值都是字符串类型,每个cookie只能保存一对键和值.每个cookie只能保存最大4K的数据案列应用保存用户名和密码在浏览器端,Cooki ...
html密码验证并跳转页面,vuejs 实现前后端分离登录验证和页面自动跳转
使用的技术点: vue-router axios vuex element-ui qs 项目介绍: 这个项目是一个类似google相册功能的项目,目前实现的是图片特征提取,可以以图搜图,最终打造成一个 ...

html如何实现自动登录,Js实现下次自动登录功能

html如何实现自动登录,Js实现下次自动登录功能相关推荐

最新文章

热门文章