<li id="jut4n"></li>

當前位置：首頁 > 網頁制作 > HTML/Xhtml > 詳細頁面

HTML靜態頁面獲取url參數和UserAgent的實現

時間：2022-09-12來源：www.ship-models.net作者：電腦系統城

前言

接技術支持小伙伴信：有用戶反饋app在華為設備上下載不了，以為是服務器覆蓋的范圍不夠或服務器掛了，直到另一個客服同事發來一個錄屏，基本知道原因，從而說明了反饋問題時，描述和材料對問題的分析與解決影響是巨大的。

原因

由于設備瀏覽器的useragent是電腦因此，下載頁面就是電腦的頁面，能下載的是電腦的安裝文件。但在微信中卻是能夠正常顯示的，但微信中“無法下載”，因此引導打開了瀏覽器，這樣就是用戶出現的“下載問題”

解決

在這個靜態的下載頁面url上帶個參數，從微信引導瀏覽器打開時候，根據這個參數來展現界面，不已useragent為依據即可避免這個事情。

1、靜態頁面獲取url的參數

有如下幾種方法

1
2
3
4
5
6
7
8 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

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

3、測試頁面

完整的html測試頁面代碼如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 <!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時結果為：

在這里插入圖片描述

當訪問file:///C:/Users/R/Desktop/param.html?os=Android 時結果為：

在這里插入圖片描述

這兩個問題解決了，那個頁面展現問題也隨著解決了。當然商店是需要上架的，但市場上大部分平板以及一些定制機，這個ua一般是電腦，所以這個可以極大的覆蓋所有“頁面”導致的下載問題了。

相關信息

2022-09-12
html網頁引入svg圖片的4種方式
2021-04-22
巧用 -webkit-box-reflect 倒影實現各類動效(小結)
2021-04-22
HTML+CSS+JS實現圖片的瀑布流布局的示例代碼

HTML5 video自定義視頻播放器
HTML5 video自定義視頻播放器...

2020-03-04
HTML5之audio屬性
audio主要支持的音頻格式：mp3 ogg wav<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>audio</title></head><body>  <a...

2020-03-04

熱門系統總排行

裝機必備

系統教程欄目

欄目熱門教程

人氣教程排行

站長推薦

熱門系統下載

淑芬两腿间又痒了