HTML静态页面获取url参数和UserAgent的实现


Posted in HTML / CSS onAugust 05, 2022

前言

接技术支持小伙伴信:有用户反馈app在华为设备上下载不了,以为是服务器覆盖的范围不够或服务器挂了,直到另一个客服同事发来一个录屏,基本知道原因,从而说明了反馈问题时,描述和材料对问题的分析与解决影响是巨大的。

原因

由于设备浏览器的useragent是电脑因此,下载页面就是电脑的页面,能下载的是电脑的安装文件。但在微信中却是能够正常显示的,但微信中“无法下载”,因此引导打开了浏览器,这样就是用户出现的“下载问题”

解决

在这个静态的下载页面url上带个参数,从微信引导浏览器打开时候,根据这个参数来展现界面,不已useragent为依据即可避免这个事情。

1、静态页面获取url的参数

有如下几种方法

function getURLParameter(name) { 
	return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null; 
}
function GetQueryString(name) {
   var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)","i");
   var r = window.location.search.substr(1).match(reg);
   if (r!=null) return unescape(r[2]); return null;
}

亲测上面两个函数,皆可。

2、取useragent的值

直接使用:navigator.userAgent

document.getElementById(“userAgentDiv”).innerHTML = navigator.userAgent;

3、测试页面

完整的html测试页面代码如下

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>参数与Ua测试(runoob.com)</title>
</head>
<body>
<script>
function getURLParameter(name) { 
	return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null; 
}
function GetQueryString(name) {
   var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)","i");
   var r = window.location.search.substr(1).match(reg);
   if (r!=null) return unescape(r[2]); return null;
}
function showUserAgent() {
   document.getElementById("userAgentDiv").innerHTML = navigator.userAgent;
}
document.write("param of os<br>");
document.write("1 GetQueryString:");
document.write(GetQueryString("os"));
document.write("<br> 2 getURLParameter: ");
document.write(getURLParameter("os"));

document.write("<h1>ua:");
document.write(navigator.userAgent);
document.write("</h1>");
</script>
</body>
</html>

当访问file:///C:/Users/R/Desktop/param.html时结果为:

HTML静态页面获取url参数和UserAgent的实现

当访问file:///C:/Users/R/Desktop/param.html?os=Android 时结果为:

HTML静态页面获取url参数和UserAgent的实现

这两个问题解决了,那个页面展现问题也随着解决了。当然商店是需要上架的,但市场上大部分平板以及一些定制机,这个ua一般是电脑,所以这个可以极大的覆盖所有“页面”导致的下载问题了。

 到此这篇关于HTML静态页面获取url参数和UserAgent的实现的文章就介绍到这了,更多相关HTML获取url参数和UserAgent内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

 
HTML / CSS 相关文章推荐
HTML5如何适配 iPhone IOS 底部黑条
Mar 09 HTML / CSS
css3打造一款漂亮的卡哇伊按钮
Mar 20 HTML / CSS
使用CSS3 制作一个material-design 风格登录界面实例
Dec 12 HTML / CSS
纯css3使用vw和vh实现自适应的方法
Feb 09 HTML / CSS
网页中的电话号码如何实现一键直呼效果_附示例
Mar 15 HTML / CSS
HTML5的结构和语义(1):前言
Oct 17 HTML / CSS
input file上传文件样式支持html5的浏览器解决方案
Nov 14 HTML / CSS
html5使用canvas绘制一张图片
Dec 15 HTML / CSS
html5 postMessage解决跨域、跨窗口消息传递方案
Dec 20 HTML / CSS
HTML5 3D旋转相册的实现示例
Dec 03 HTML / CSS
原生canvas制作画图小工具的踩坑和爬坑
Jun 09 HTML / CSS
css3 文字断裂效果
Apr 22 HTML / CSS
CSS使用Flex和Grid布局实现3D骰子
Aug 05 #HTML / CSS
css中:last-child不生效的解决方法
Aug 05 #HTML / CSS
CSS浮动引起的高度塌陷问题
Aug 05 #HTML / CSS
使用CSS实现六边形的图片效果
Aug 05 #HTML / CSS
el-form每行显示两列底部按钮居中效果的实现
Aug 05 #HTML / CSS
纯CSS打字动画的实现示例
Aug 05 #HTML / CSS
新的CSS 伪类函数 :is() 和 :where()示例详解
You might like
PHP中使用memcache存储session的三种配置方法
2014/04/05 PHP
php动态添加url查询参数的方法
2015/04/14 PHP
使用Thinkphp框架开发移动端接口
2015/08/05 PHP
php版微信公众平台入门教程之开发者认证的方法
2016/09/26 PHP
一个刚完成的layout(拖动流畅,不受iframe影响)
2007/08/17 Javascript
使用js写的一个简易的投票
2013/11/27 Javascript
基于NodeJS的前后端分离的思考与实践(三)轻量级的接口配置建模框架
2014/09/26 NodeJs
浅谈jquery中delegate()与live()
2015/06/22 Javascript
简单解析JavaScript中的__proto__属性
2016/05/10 Javascript
JQuery实现DIV其他动画效果的简单实例
2016/09/18 Javascript
jQuery+正则+文本框只能输入数字的实现方法
2016/10/07 Javascript
JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)
2017/08/16 Javascript
Django与Vue语法的冲突问题完美解决方法
2017/12/14 Javascript
JS实现图片居中悬浮效果
2017/12/25 Javascript
vue项目中公用footer组件底部位置的适配问题
2018/05/10 Javascript
Nuxt升级2.0.0时出现的问题(小结)
2018/10/08 Javascript
使用JavaScript解析URL的方法示例
2019/03/01 Javascript
js getBoundingClientRect使用方法详解
2019/07/17 Javascript
微信小程序canvas分享海报功能
2019/10/31 Javascript
js实现时间日期校验
2020/05/26 Javascript
Openlayers实现距离面积测量
2020/09/28 Javascript
解析Python中的二进制位运算符
2015/05/13 Python
Pytorch 实现冻结指定卷积层的参数
2020/01/06 Python
python Canny边缘检测算法的实现
2020/04/24 Python
Django分组聚合查询实例分享
2020/04/29 Python
Python unittest装饰器实现原理及代码
2020/09/08 Python
中国领先的专业家电网购平台:国美在线
2016/12/25 全球购物
XML文档定义有几种形式?它们之间有何本质区别?解析XML文档有哪几种方式?
2016/01/12 面试题
三分钟演讲稿范文
2014/04/24 职场文书
承诺书范文
2014/06/03 职场文书
2014年小学教师工作总结
2014/11/10 职场文书
中学生逃课检讨书
2015/02/17 职场文书
2016年感恩教师节活动总结
2016/04/01 职场文书
python 破解加密zip文件的密码
2021/04/22 Python
Java 将PPT幻灯片转为HTML文件的实现思路
2021/06/11 Java/Android
Redis字典实现、Hash键冲突及渐进式rehash详解
2021/09/04 Redis