useragent识别访问设备

最新推荐文章于 2024-02-01 11:11:21 发布

renkai721

最新推荐文章于 2024-02-01 11:11:21 发布

阅读量237

点赞数

分类专栏：前端文章标签： useragent vue pc 移动端 navigator

本文链接：https://blog.csdn.net/renkai721/article/details/133910389

版权

前端专栏收录该内容

33 篇文章 3 订阅 ¥19.90 ¥99.00

订阅专栏

超级会员免费看

本文介绍了如何在ruoyi框架的前后端分离项目中，根据用户设备类型（手机或PC）动态跳转到不同登录页面，使用navigator.userAgent进行设备识别并利用NProgress进度条完成加载提示。

摘要由CSDN通过智能技术生成

背景需求

ruoyi框架，前后端分离。现在要在用户访问的时候根据不同的设备跳转到不同的登录页面。

教程

router/index.js

修改src/router/index.js，在这里增加自己的要跳转的页面

permission.js

在白名单中添加自己的登录页面

增加以下识别的代码

let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i)
      if (flag) {
        console.log('手机端');
        next(`/loginPhone?re

了解本专栏