将查询字符串作为带哈希的 url 后的对象获取

Question

所以我有一个这种格式的网址。:

https://my-app.com/my-route/someOtherRoute#register?param1="122"&param2="333"

我知道如何获取普通网址的查询字符串，但我无法获取后面的查询字符串#

我使用node-url到目前为止我已经这样做了：

import * as urlTool from 'url';
const url = "https://my-app.com/my-route/someOtherRoute#register?param1="122"&param2="333"
const parsedUrl = urlTool.parse(url,true);
const { pathName, hash } = parsedUrl

所以到目前为止，我hash有这个值#register?param1="122"&param2="333"，但是如何以动态方式获取查询字符串，因为查询字符串可能或可能不一直存在，而且我也不知道它们的名称，如何我可以获得#url之后可能出现的任何查询字符串吗？

Answer 1

您可以使用splitand Object.fromEntrieswithURLSearchParams将查询参数提取到对象中：

const url = `https://my-app.com/my-route/someOtherRoute#register?param1="122"&param2="333"`

const [hash, query] = url.split('#')[1].split('?')
const params = Object.fromEntries(new URLSearchParams(query))

console.log(hash)
console.log(params)

Answer 2

使用搜索参数

var url = `https://my-app.com/my-route/someOtherRoute#register?param1="122"&param2="333"`;
console.log(new URL(`https://1.com?${url.split("?")[1]}`).searchParams.get("param1"));

使用String#split和Array#reduce构建对象

var url = `https://my-app.com/my-route/someOtherRoute#register?param1="122"&param2="333"`;
console.log(url.split("?")[1].split("&").reduce(function(result, param) {
  var [key, value] = param.split("=");
  result[key] = value;
  return result;
}, {}));

认为这样写会更安全：

function getParamsAfterHash(url) {
  if (typeof url !== "string" || !url) url = location.href;
  url = url.split("#")[1];
  if (!url) return {};
  url = url.split("?")[1];
  if (!url) return {};
  return url.split("&").reduce(function(result, param) {
    var [key, value] = param.split("=");
    result[key] = value;
    return result;
  }, {});
}

console.log(getParamsAfterHash(`https://my-app.com/my-route/someOtherRoute#register?param1="122"&param2="333"`));