app开发-2

一.app登录注册实现

1.首先进行布局,mhead,mbody 在app index.html内创建一个 a链接通过mui.openWindow跳到登录页面

个人中心

openwindow:

mui.openWindow({url: "login.html",id: "login.html",styles: {top: "0px",bottom: "50px"}})

进入登录页面后,为了不让用户返回,使用mui.back()进行限制

mui.back = function(){    #或mui.back()mui.toast("当前页面不能返回");};

简单的进行输入用户名和密码,向后端信息交互,进行验证,当验证通过时,进入用户信息页面userinfo.html

#需要下载md5()加密,引入
document.getElementById('login_btn').addEventListener('tap',function () {mui.post(window.serv + '/login',{username:document.getElementById("username").value,password:hex_md5(document.getElementById("password").value) #为了信息安全前端将密码加密 hex_md5()},function(data){console.log(JSON.stringify(data));if(data.code==0){window.localStorage.setItem("user",data.data._id);#这里注意,使用的是window.localStorage.setItem(Key,value)#进行全局创建,将用户信息user表中的obj(_id)作为值传过去,对我们查找用户信息有很大帮助
//                          console.log(window.localStorage.getItem("user"));mui.openWindow({url:"userinfo.html",id:"userinfo.html",styles:{top:"0px",bottom:"50px"},extras:data.data,createNew:true  #这里是当访问发回后,刷新页面,为了信息实时沟通  createNew:true})}                  },'json');  })

关于注册

注册和以前一样,获取数据发送数据的过程,这次加入了单选 我是爸爸或我是妈妈

我是妈妈#checked 默认选择我是爸爸

在判断性别上,用到了判断获取value

function () {var gender_list = document.getElementsByName("gender");#在获取性别上,通过document.getElementsByName进行判断,因为当选择时,checked就#会在哪一个单选框var gender = null;for (var i = 0; i < gender_list.length; i++) {if(gender_list[i].checked){gender = gender_list[i].value;}}

进入userinfo 用户中心页面

var Sdata = null;mui.back = function() {};mui.plusReady(function () {Sdata = plus.webview.currentWebview();console.log(JSON.stringify(Sdata));var index = plus.webview.getWebviewById("HBuilder");#将login.html中用户的信息通过mui.fire传递到index.HTMLAllCollection#目的在用户已经登录的情况下,不在重复登录,直接进入到userinfo页面mui.fire(index,'new_ws');document.getElementById("avatar").src = "avatar/" + Sdata.avatar;#赋值document.getElementById("nickname").innerText = Sdata.nickname;document.getElementById("username").innerText = Sdata.username;});document.getElementById('logout_btn').addEventListener('tap', function() {window.localStorage.removeItem("user");#退出登录移除window.localStorage.removeItem("user")mui.openWindow({url: "login.html",id: "login.html",styles: {top: "0px",bottom: "50px"}}); })document.getElementById('scan').addEventListener('tap',function () {#进行调用扫码页面,进行扫描二维码mui.openWindow({url:"scanQR.html",id:"scanQR.html",})})

以上步骤简单的登录注册就差不多完成了,最后用户登录不在重复登录

index下验证window.localStorage.getItem("user") 做判断

document.getElementById('self').addEventListener('tap', function() {if(window.localStorage.getItem("user")) {  #哈哈,window.localStorage.getItem("user")终于用上了,当在用户登录后,会全局存在localStorage,这也是#进行判断的重点mui.post(window.serv + '/auto_login', {"_id": window.localStorage.getItem("user")}, function(data) {console.log(JSON.stringify(data));mui.openWindow({url: "userinfo.html",id: "userinfo.html",styles: {top: "0px",bottom: "50px"},extras: data.data#在检测到"user" 后,进行登录验证,若存在,则将全部数据返回,并传到userinfo,#在userinfo将标签一一赋值})}, 'json');} else {mui.openWindow({url: "login.html",id: "login.html",styles: {top: "0px",bottom: "50px"}})}});

关于登录websocket的app 名字

index.html

if(window.localStorage.getItem("user")) {#注意,也可以将localStorage作为appname 登录的ws = new WebSocket("ws://192.168.13.55:3721/app/" + window.localStorage.getItem("user"));};document.addEventListener("send_music", function(data) {var send_str = data.detail // {to_user:"toy123",music:Sdata.audio}ws.send(JSON.stringify(send_str));});document.addEventListener("new_ws",function(){ #这里监听的是userinfo传来的new_wsws = new WebSocket("ws://192.168.13.55:3721/app/" + window.localStorage.getItem("user"));})

调用联图接口生成二维码

import requests,os,time,hashlib
from uuid import uuid4
from setting import music_path,photo_path,MongoDB,LT_URL,QRCODE_PATH
# LT_URL="http://qr.liantu.com/api.php?text=%s"   调用联图接口生成二维码,值为qr_code
def create_QR(count):qr_list= []for i in range(count):qr_code = hashlib.md5(f"{uuid4()}{time.time()}{uuid4()}".encode("utf8")).hexdigest()res =requests.get(LT_URL%(qr_code))qr_path = os.path.join(QRCODE_PATH,f"{qr_code}.jpg")with open(qr_path,"wb") as f:f.write(res.content)qr_dict ={"device_key":qr_code}qr_list.append(qr_dict)time.sleep(0.5)MongoDB.user.insert_many(qr_list)create_QR(10)

转载于:https://www.cnblogs.com/qq849784670/p/10306354.html

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！