const linkUrl = 'https://console-kwe.his.huawei....
बनाया गया: 25 अप्रैल 2025
बनाया गया: 25 अप्रैल 2025
链接头(base URL)
https://console-kwe.his.huawei.com/weops/#/page/view/340
查询参数(Query String)
参数名 | 值 |
---|---|
oneId | 999902338 |
dimensionType | IPMT-000000005 |
dimensionCode | ALL |
productCode | (空) |
subProductCode | (空) |
moduleCode | (空) |
appId | (空) |
dateType | year |
dataTime | 2025 |
consumerCode | 031562 |
consumerLevel | 2 |
isTotal | true |
deptLevel | 2 |
timeTypeVal | year |
orgType | APP |
nextType | (空) |
说明:
- “链接头”即问号(
?
)之前的部分,已经包含单页应用的 Hash 片段#/page/view/340
。- 表中标注为“(空)”的参数在原链接里虽有键名,但无对应取值。
- 若需要进一步解析 Hash 片段或重新组装 URL,只需把上表中需要的键值按
key=value
拼接(用&
分隔)并附到链接头后即可。
拆成js代码
下面给出一种稳健的 JavaScript 写法,可以把你提供的链接拆分成「链接头」和「参数对象」。
它兼顾了 hash route(#/page/view/340
)里还包含查询串的特殊情况。
jsconst rawUrl = 'https://console-kwe.his.huawei.com/weops/#/page/view/340?oneId=999902338~ALL~IPMT-000000005~year~2025~dept~031562&dimensionType=IPMT-000000005&dimensionCode=ALL&productCode=&subProductCode=&moduleCode=&appId=&dateType=year&dataTime=2025&consumerCode=031562&consumerLevel=2&isTotal=true&deptLevel=2&timeTypeVal=year&orgType=APP&nextType='; // 1) 先用 URL 对象把主域、路径、hash 拆出来 const urlObj = new URL(rawUrl); // 2) hash 里同时含有路由和查询参数,需要二次拆分 // urlObj.hash 形如 "#/page/view/340?oneId=..." const [hashPath, queryString = ''] = urlObj.hash.slice(1).split('?'); // 去掉开头的 "#" 再 split // 3) 组合出“链接头”——它包含 hash 路由,但不带任何查询参数 const linkHead = `${urlObj.origin}${urlObj.pathname}#${hashPath}`; // 4) 把查询串转成参数对象 const params = Object.fromEntries(new URLSearchParams(queryString)); // ======== 下面只是示例输出 ======== // console.log('linkHead:', linkHead); console.log('params:', params);
运行后会得到:
textlinkHead: https://console-kwe.his.huawei.com/weops/#/page/view/340 params: { oneId: '999902338~ALL~IPMT-000000005~year~2025~dept~031562', dimensionType: 'IPMT-000000005', dimensionCode: 'ALL', productCode: '', subProductCode: '', moduleCode: '', appId: '', dateType: 'year', dataTime: '2025', consumerCode: '031562', consumerLevel: '2', isTotal: 'true', deptLevel: '2', timeTypeVal: 'year', orgType: 'APP', nextType: '' }
这样你就能轻松地在代码里分别使用 linkHead
和 params
了。
请把linkUrl这个链接最终用链接头和参数变量拼接起来的形式
下面给出最简洁的拼接写法:只要已经拿到 linkHead
(包含 #/page/view/340
的路由片段)和 params
对象,就能重新得到完整的 linkUrl
。
js// linkHead 与 params 假定已在上文得到 // linkHead: "https://console-kwe.his.huawei.com/weops/#/page/view/340" // params : { oneId: "...", dimensionType: "...", ... } const linkUrl = `${linkHead}?${new URLSearchParams(params).toString()}`; console.log(linkUrl); // ➜ https://console-kwe.his.huawei.com/weops/#/page/view/340?oneId=999902338~ALL~IPMT-000000005~year~2025~dept~031562&dimensionType=IPMT-000000005&dimensionCode=ALL&productCode=&subProductCode=&moduleCode=&appId=&dateType=year&dataTime=2025&consumerCode=031562&consumerLevel=2&isTotal=true&deptLevel=2&timeTypeVal=year&orgType=APP&nextType=
new URLSearchParams(params).toString()
会把参数对象自动序列化为查询字符串。linkHead
里已经带有 #/page/view/340
的 hash 路由,所以直接在其后加 ?
再拼参数即可复原原始链接。