AppCan用cookie实现记住密码功能 [APP]

今天想做个在应用上记住密码的功能。想了一下，先用COOKIE来测试。COOKIE保存在客户端。

关于COOKIE在手机上安不安全的问题，以后再讨论。

其实想过在手机上创建文件保存密码，但是，没有时间，没有COOKIE来得容易。

下面正题：

先做出要测试的界面，如下示：

界面源码如下：

</div>

</body>

好了，一般当别人选择了记住密码，第二次开启软件的时候，都会看到用户名，密码都填好的了。就是写个onload()事件而已。

<body class="ui-mobile-viewport" οnlοad="useCookie()">触发的useCookie() 的js代码如下：

function useCookie()

{

var username=getCookie("username");

//alert(username);

var password=getCookie("password");

//alert(password);

if(username!=null && password!=null){

document.getElementById("username").value =username;

document.getElementById("password").value =password;

document.getElementById("checkbox-1").checked=true;

}else{

document.getElementById("username").value =null;

document.getElementById("password").value =null;

//alert("no data");

}

会调用到的方法已用红色标明，js代码如下：

function getCookie(NameOfCookie)

{

if (document.cookie.length > 0){

begin = document.cookie.indexOf(NameOfCookie+"=");

if (begin != -1){

begin += NameOfCookie.length+1;

end = document.cookie.indexOf(";", begin);

if (end == -1) end = document.cookie.length;

return unescape(document.cookie.substring(begin, end));

}

return null;// cookie不存在返回null

}

这样在开启软件的时候，就去读存不存在的COOKIE，读到了，就赋值给输入框。

接下来，考虑输入用户名密码后，设置COOKIE，代码如下：

function checksave()

{

var name=document.getElementById('username').value;

var pass=document.getElementById('password').value;

if(name && pass){

setCookie("password",pass);

setCookie("username",name);

alert('success!');

location.reload();

}

else

alert("no input all!");

}

function setCookie(NameOfCookie, value, expiredays)

{ //var psw=document.getElementById('password').value;

var ExpireDate = new Date ();

ExpireDate.setTime(ExpireDate.getTime() + (expiredays * 24 * 3600 * 1000));

document.cookie = NameOfCookie + "=" + escape(value) +

((expiredays == null) ? "" : "; expires=" + ExpireDate.toGMTString());

alert("u+p="+unescape(document.cookie));

}

输入数据，点击界面的设置按钮后:

此时会刷新界面，但是已经记住了密码，结果如下：

删除按钮的代码：

function delusr()

{

delCookie("username");

delCookie("password");

location.reload();

}

function delCookie (NameOfCookie)

{

if (getCookie(NameOfCookie)) {

var date=new Date();

date.setTime(date.getTime()-10000);

document.cookie = NameOfCookie + "=" + "; expires="+date.toGMTString();

}

更新按钮的代码：

function reload ()

{

location.reload();

}

这个功能就到这里。“记住密码”这个checkbox的代码我写在其它文件里，这里没有，判断它的真假就可以做出功能。

在做这个功能时，我一开始是利用SAE做服务器端，来做记住密码功能的。在手机上测试，学校的信号非常不给力，所以开启软件后完全获取不到信息。所以网络信号在做应用时也应该要考虑。

然后，假如真的是密码功能用COOKIE来做，密码的加密是必要的，可以选择异步通讯到远程加密后返回密码保存，甚至写个自己的加密函数等等，可以做足多方面的安全保护。

做个“下次自动登录”功能，其实也很简单。

当你想要做某功能时，先想想它的逻辑是什么，它需要哪些介质来做功能支持，然后它可能可以用什么技术实现。这些东西想多了，做多了，你就进步了。写代码写的就是写个逻辑。后期你得不停地为你的代码做优化，不停地想它究竟安不安全。

有什么问题留言讨论吧。

转载于:https://blog.51cto.com/1030967291/1603777

AppCan用cookie实现记住密码功能 [APP]相关推荐

java记住密码 cookie_Java Web网站怎么利用Cookie实现记住密码功能
在做java web网站开发时,为了避免每次登录都需要输入用户名和密码,我们会使用Cookie技术来实现记住密码功能,在这里小编使用简单的项目案例来教大家具体的实现过程. 前期准备 1.下载好jque ...
Cookie实现记住密码、自动登录
前端代码 <form id="form" action="xxx" method="post"><div><i ...
vue 登录页面记住密码功能
vue+iview/element 一般用来快速搭建后台管理系统,登录页的记住密码功能也是必不可少的. 记住密码快速登录功能(iview ui): 思路:首次登录,记住密码,将密码存储到cookie中 ...
LayUI记住密码功能(已实现)
文章目录前言一.效果与逻辑二.使用步骤 1.html 2.js 三.总结四.补充前言为了提高客户用户体验,每一个管理系统都有自己的记住密码功能.让客户减少账号与密码的输入,从而提高客户的体 ...
PHP会员登录实现记住密码功能 thinkPHP5
会员登录实现记住密码功能需要用到cookie 和session,首先我们来简单了解一下cookie 和session 的区别 Cookie Cookie是完全保存在客户端.当客户端禁止cookie时将 ...
vue考试系统后台管理项目-登录、记住密码功能
考试系统后台管理项目介绍: 技术选型:Vue2.0+Elemenu-ui 项目功能介绍: 账户信息模块:菜单权限.角色权限设置.角色权限分配.账号设置.公司分组考试管理模块:新增/编辑/删除考试试题 ...
PyQt5实现登录界面，包含用户注册，记住密码功能
本文主要基于PyQt5用的是qt designer,连接MySQL实现登录界面,包含注册功能,记住密码功能,说明这一切都是基于在pycharm上配置好了pyuic和qt designer 目录 1.实 ...
【html实现记住账号、记住密码功能】
html实现记住账号.记住密码功能效果图: 1.页面添加记住账号.记住密码多选框 <div class="remember" style="text-align: ...
php记住密码怎么写,PHP记住密码功能实现例子
记住密码功能我们在许多网站登录时都会看到有这个功能了,下面我们来看一篇基于php的记住密码功能的实现方法,具体的例子如下所示. 提供两个内置的方法,可以在项目中直接使用,很方便/** * 记住密码/清 ...

AppCan用cookie实现记住密码功能 [APP]

AppCan用cookie实现记住密码功能 [APP]相关推荐

最新文章

热门文章