热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

uniapp结合PHP实现单用户登陆

单用户登陆,即在一个应用中,同一个用户只能在线登陆一个,一个用户登陆,在其他设备上会被即时挤下线,确认后清空登

单用户登陆,即在一个应用中,同一个用户只能在线登陆一个,一个用户登陆,在其他设备上会被即时挤下线,确认后清空登陆该设备上的登陆装填并退回到登陆界面。

    uni-app是目前能通过使用vue.js框架只需要编写一套代码同时打包Android,IOS,微信小程序,头条支付宝小程序和H5,通过使用HBuilder工具方便调试与云打包,关于苹果证书,推荐CW.PUB,https://cw.pub/index/document/index。使用HBuilder打越狱包通过那个网站签名就可以在正常苹果手机安装,不过网上还有其他些方法这里就不列举了。

     一般APP做单用户登陆会使用第三方消息推送平台,虽然uni-app虽然也可以对接友盟,极光等推送平台。但还是因为时间,对接平台审核等流程时间不允许。之前使用gatewayworkman和websocket做了即时聊天,所以单用户登陆也使用websocket实现。


 


uni-app socket单用户登陆例

1. uni-app前端在初始化socke时发送当前设备的唯一标识,然后实时接收一个“强制退出”类型的消息,一下只是简单示例。

//初始化
socket.on('init', () => { //连接初始化socket.send({type: 'login',token: uni.getStorageSync('access_token'),device_no: plus.device.uuid, //手机设备唯一编号});
}).on('quit_push',(res)=> {if(res) {uni.showModal({title: '退出通知',content: '你的账号在其他设备上登录!',showCancel: true,cancelText: '取消',confirmText: '确定',success: res => {if(res.confirm) {uni.clearStorageSync()store.commit('chat/clear')uni.reLaunch({url:"../../pages/login/index"})}else if(res.cancel) {uni.clearStorageSync()store.commit('chat/clear')uni.reLaunch({url:"../../pages/login/index"})}}});}
});

 

2. 后端接收“设备唯一标识”参数,先查找缓存是否存在,不存在记录设备标识和socket的clientid。

 

3. 登陆接口接收设备标识,缓存或库里取出标识记录与当前接收的设备标识判断是否一致,不一致则根据缓存中的clientid发送消息。

$is_Online= Db::name('UserLoginClient')->where('user_id',$user['id'])->order('id desc')->find();
if(isset($device_no) && $device_no && $is_online['device_no'] != $device_no && !empty($is_online['device_no'])) { Tools::sendToClient($is_online['client_id'],json_encode(['type' => 'quit_push','data' => 'ip','message' => '强制下线']));}

 

4. 工具类sendToClient方法部分

public static function sendToClient($client_id, $message){Gateway::sendToClient($client_id, $message);}

 


推送单用户登陆例

1. 首先对接了友盟,包括前端后端都加了SDK和使用上了他们的方法。

 

2. 消息推送有一个唯一值"token",这里简称“pushtoken”,由客户端生成,可以标识一个唯一的设备。

 

3. 后端登陆时,接收pushtoken,同样判断该pushtoken是否存在,不存在就以用户ID为键存储。

 

4. 存在时再判断与缓存是否一致,一致则加长缓存时间,不一致则给旧的pushtoken(缓存中的)推送一条消息,并缓存新的pushtoken。

if (self::$headToken && Cache::has(self::$prefix . self::$userId)) {if (self::$headToken == Cache::get(self::$prefix . self::$userId)) {Cache::set(self::$prefix . self::$userId, self::$headToken, self::$timeOut);} else { // 换了手机,客户端重新发送pushtoken到服务端,服务端与缓存中的pushtoken比较,不同则给原来pushtoken手机推送一条并重新缓存新的token// modify by wensen on 20180816// $addr = getCity();$addr = getMobCity();$ip = request()->ip();if ($addr) {$addr['province'] = empty($addr['province']) ? '' : $addr['province'];$addr['city'] = empty($addr['city']) ? '' : $addr['city'];// $address = "\t" . $addr['country'] . "-" . $addr['region'] . "-" . $addr['city'] . " (IP:" . $ip . ")\t";$address = "\t" . $addr['country'] . "-" . $addr['province'] . "-" . $addr['city'] . " (IP:" . $ip . ")\t";} else {$address = "IP:" . $ip . "";}$OldToken = Cache::get(self::$prefix . self::$userId);if (strlen($OldToken) == 64) {$cOntent= array('title' => 'APP紧急通知','body' => '您的账号于:' . date('Y-m-d H:i:s') . '在' . $address . '处登录,若不为您本人登录,请您立即修改密码!','pull_service' => 'login');\umeng\Push::send($OldToken, 'unicast', $content, 'message', true);} elseif (strlen($OldToken) == 44) {$cOntent= array('pull_service' => 'login','msg' => '您的账号于:' . date('Y-m-d H:i:s') . '在' . $address . '处登录,若不为您本人登录,请您立即修改密码!');\umeng\Push::send($OldToken, 'unicast', $content, 'message', true);}Cache::set(self::$prefix . self::$userId, self::$headToken, self::$timeOut);}} else {Cache::set(self::$prefix . self::$userId, self::$headToken, self::$timeOut);}

 

5. APP客户端接收推送进行弹窗提示和退出处理。

 

6. 以上是根据友盟的SDK封装的推送方法,其中包括单播,广播,跳应用activity,跳网页连接等等。

 


推荐阅读
  • uniapp 框架简介和生命周期
    介绍:uni-app使用vue的语法小程序的标签和API。也就是和这些语法同样作用的框架.生命周期,分为应用生命周期和页面生命周期,和小程序的基本一致.流程开发规范为了实现多 ... [详细]
  • 通过uni.getSystemInfoSync()可以同步获取系统信息,其中platform是获取客户端平台的switch(uni.getSystemInfoSyn ... [详细]
  • 1.支付能力a.开发步骤:1.登录开发中心,选择相应的小程序,进入该小程序详情页2.在小程序详情开发管理页面的功能列表中,点击右上角添加功能按钮,添加【小程序支付】功能,提交进入审 ... [详细]
  • VueCLI多页分目录打包的步骤记录
    本文介绍了使用VueCLI进行多页分目录打包的步骤,包括页面目录结构、安装依赖、获取Vue CLI需要的多页对象等内容。同时还提供了自定义不同模块页面标题的方法。 ... [详细]
  • 基于移动平台的会展导游系统APP设计与实现的技术介绍与需求分析
    本文介绍了基于移动平台的会展导游系统APP的设计与实现过程。首先,对会展经济和移动互联网的概念进行了简要介绍,并阐述了将会展引入移动互联网的意义。接着,对基础技术进行了介绍,包括百度云开发环境、安卓系统和近场通讯技术。然后,进行了用户需求分析和系统需求分析,并提出了系统界面运行流畅和第三方授权等需求。最后,对系统的概要设计进行了详细阐述,包括系统前端设计和交互与原型设计。本文对基于移动平台的会展导游系统APP的设计与实现提供了技术支持和需求分析。 ... [详细]
  • 本文介绍了使用C++Builder实现获取USB优盘序列号的方法,包括相关的代码和说明。通过该方法,可以获取指定盘符的USB优盘序列号,并将其存放在缓冲中。该方法可以在Windows系统中有效地获取USB优盘序列号,并且适用于C++Builder开发环境。 ... [详细]
  • 工作经验谈之-让百度地图API调用数据库内容 及详解
    这段时间,所在项目中要用到的一个模块,就是让数据库中的内容在百度地图上展现出来,如经纬度。主要实现以下几点功能:1.读取数据库中的经纬度值在百度上标注出来。2.点击标注弹出对应信息。3 ... [详细]
  • 我正在尝试将Firebase添加到涉及添加以下内容的现有应用程序中:classpath'com.googl ... [详细]
  • 本文涉及源码版本为2.6.9准备工作down一份Vue源码,从package.json入手,找我们需要的代码1、package.json中的scripts,build:nodesc ... [详细]
  • 团队作业第二次—项目选题报告(追光的人)
    所属课程软件工程1916作业要求团队作业第二次—项目选题报告团队名称追光的人作业目标组员提出选题,大家挑选出可行性最高的进行分析,制作选题报告和选题PPT目录队员贡献分比例选题报告 ... [详细]
  • 微信小程序使用uni-app实现首页搜索框导航栏功能详解
    这篇文章主要介绍了微信小程序使用uni-app实现首页搜索框导航栏功能,uni-app 是一个使用 Vue.js (opens new window)开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序 ... [详细]
  • 基于Vue.js的uniapp前端框架结合.net core开发跨平台project
    一、由来最近由于业务需要要开发一套公益的APP项目,因此结合所给出的需求最终采用uni-app这种跨平台前端框架以及.netcore快速搭建我们的项目, ... [详细]
  • 适合编程初学者的开源博客系统(Vue3+Vant版)
    目标为编程初学者打造入门学习项目,使用各种主流编程语言来实现。让想学编程的,一个都不落下。上述基本涵盖了当前编程开发所有主流语言。左侧为前端版本&# ... [详细]
  • Vue和uniapp中该如何使用canvas详解【vue框架】
    说起canvas是css3新增的标签,而饼状图又是canvas经典,我们公司现在正在用uni-app框架去研发APP,下面这篇文章主要给大家介绍了关于Vue和uniapp中该如何使 ... [详细]
  • hello,我又要细说uniapp了附件上传,图片上传,视频上传应该是目前手机比较常见的功能,但是对于上传还是有一些需要注 ... [详细]
author-avatar
书友23295799
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有