在 Javascript 中解析相对 URL 中的搜索参数

Question

我有一个相对 URL，类似于/a/b?someParam=cccc

我想提取参数的值。一种替代方法是执行 (new URL(myUri, 'http://example.com')).searchParams.get('someParam'). 它很好，因为它使用浏览器的内置函数，并且在 url 参数被编码的情况下它是安全的。

但是，它取决于 url 的随机基数http://example.com。有没有办法在没有基础的情况下解析 URL？或者提取搜索参数？

Answer 1

您可以将 后面的所有内容?直接传递给URLSearchParams。

const getParamsFromURI = ( uri ) => {
  // Get everything after the `?`
  const [ , paramString ] = uri.split( '?' );

  // Return parameters
  return new URLSearchParams( paramString );
};

const params = getParamsFromURI( '/a/b?someParam=cccc' );
console.log( params.get( 'someParam' ) );

或者，如果您想使用URL构造函数，您可以从中获取基础window.location.origin

const getParamsFromURI = ( uri ) => {
  // Create url with base
  const base = window.location.origin; // Could also be a fixed value e.g. http://example.com
  const url = new URL( uri, base );
  
  // Return parameters
  return url.searchParams;
};

const params = getParamsFromURI( '/a/b?someParam=cccc' );
console.log( params.get( 'someParam' ) );