我试图用JavaScript解决这个问题,应该这样处理:
var url = new URL('http://a:b@example.com:890/path/wah@t/foo.js?foo=bar&bingobang=&king=kong@kong.com#foobar/bing/bo@ng?bang');
因为(至少在Chrome中)它被解析为:
{
"hash": "#foobar/bing/bo@ng?bang",
"search": "?foo=bar&bingobang=&king=kong@kong.com",
"pathname": "/path/wah@t/foo.js",
"port": "890",
"hostname": "example.com",
"host": "example.com:890",
"password": "b",
"username": "a",
"protocol": "http:",
"origin": "http://example.com:890",
"href": "http://a:b@example.com:890/path/wah@t/foo.js?foo=bar&bingobang=&king=kong@kong.com#foobar/bing/bo@ng?bang"
}
然而,这不是跨浏览器的(
https://developer.mozilla.org/en-US/docs/Web/API/URL),因此我将其拼凑在一起,以从上面提取相同的部分:
^(?:(?:(([^:\/#\?]+:)?(?:(?:\/\/)(?:(?:(?:([^:@\/#\?]+)(?:\:([^:@\/#\?]*))?)@)?(([^:\/#\?\]\[]+|\[[^\/\]@#?]+\])(?:\:([0-9]+))?))?)?)?((?:\/?(?:[^\/\?#]+\/+)*)(?:[^\?#]*)))?(\?[^#]+)?)(#.*)?
这个正则表达式的功劳归功于https://gist.github.com/rpflorence,他发布了这个jsperf http://jsperf.com/url-parsing(最初在这里发现:https://gist.github.com/jlong/2428561#comment-310066),他想出了最初基于的正则表达式。
这些部分按照以下顺序排列:
var keys = [
"href", // http://user:pass@host.com:81/directory/file.ext?query=1
"origin", // http://user:pass@host.com:81
"protocol", // http:
"username", // user
"password", // pass
"host", // host.com:81
"hostname", // host.com
"port", // 81
"pathname", // /directory/file.ext
"search", // ?query=1
"hash" //
];
还有一个小型库可以封装它并提供查询参数:
https://github.com/sadams/lite-url(也可在bower上获得)
如果您有改进意见,请创建一个拉取请求,附带更多测试,我将感激地接受并合并。