如何解析一个URL

163 阅读1分钟

这是一个面试题, 之前没有接触过URL解析,所以直接用了split来解析URL。实际上,这种方法不是不能解,但是遇到像[] 空格 '/' 这些特殊的字符浏览器会自动将其转义,所以比较好的方式是用JavaScript的URL解析器去解析URL。 比方说向以下URL ‘www.xxx.com/?name=coder…

这个时候可以搬出我们的解析器

const url = new URL('https://www.xxx.com/?name=coder&age=20&callback=https%3A%2F%2Fyouzan.com%3Fname%3Dtest&list%5B%5D=a&list%5B%5D=b&json=%7B%22str%22%3A%22abc%22,%22num%22%3A123%7D&illegal=C%9E5%25H__a100373__b4')
// url.search获取URL解析字符串
const a = new URLSearchParams(url.search)

const obj = {}
// 遍历URLSearchParams对象解析
a.forEach((v,k) => obj[k] = v)

// 结果
{
    age: "20",
    callback: "https://youzan.com?name=test",
    illegal: "C�5%H__a100373__b4",
    json: "{\"str\":\"abc\",\"num\":123}",
    list[]: "b",
    name: "coder",
}

参考: developer.mozilla.org/zh-CN/docs/…