/**
- 解析一个url，并生成window.location对象包含的域
- location:
- {
- href: '包含完整的url',
- origin: '包含协议到pathname之前的内容',
- protocol: 'url使用的协议，包含末尾的:',
- username: '用户名', // 暂时不支持
- password: '密码', // 暂时不支持
- host: '完整主机名，包含:和端口',
- hostname: '主机名，不包含端口'
- port: '端口号',
- pathname: '服务器上访问资源的路径/开头',
- search: 'query string，?开头',
- hash: '
#开头的fragment identifier'
- }
*
- @param {string} url 需要解析的url
- @return {Object} 包含url信息的对象
*/
方案一
function parseUrl(url) {
var result = {};
var keys = ['href', 'origin', 'protocol', 'host',
'hostname', 'port', 'pathname', 'search', 'hash'];
var i, len;
var regexp = /(([^:]+:)\/\/(([^:\/\?#]+)(:\d+)?))(\/[^?#]*)?(\?[^#]*)?(#.*)?/;
var match = regexp.exec(url);
console.info('match=', match);
if (match) {
for (i = keys.length - 1; i >= 0; --i) {
result[keys[i]] = match[i] ? match[i] : '';
}
}
console.info('result=', result);
return result;
}
方案二
function parseURL(url) {
//创建一个 a 标签，并将 url 赋值给标签的 href 属性。
const a = document.createElement('a')
a.href = url
return {
source: url,
protocol: a.protocol.replace(':', ''), // 协议
host: a.hostname, // 主机名称
port: a.port, // 端口号
query: a.search, // 查询字符串
params: (function () { // 查询参数
let ret = {},
seg = a.search.replace(/^\?/, '').split('&'),
len = seg.length, i = 0, s
for (; i < len; i++) {
if (!seg[i]) {
continue
}
s = seg[i].split('=')
ret[s[0]] = decodeURIComponent(s[1])
}
return ret
})(),
file: (a.pathname.match(/\/([^\/?#]+)$/i) || [, ''])[1], // 文件名
hash: a.hash.replace('#', ''), // 哈希参数
path: a.pathname.replace(/^([^\/])/, '/$1'), // 路径
relative: (a.href.match(/tps?:\/\/[^\/]+(.+)/) || [, ''])[1], // 相对路径
segments: a.pathname.replace(/^\//, '').split('/') // 路径片段
}
}
parseUrl("http://test.com:8080?name=1&password=2#page1");
