Comment obtenir la chaîne de requête de l'URL actuelle avec JavaScript ?

Question

J'ai une URL comme celle-ci :

http://localhost/PMApp/temp.htm?ProjectID=462

Ce que j'ai besoin de faire, c'est de récupérer les détails après le ? (chaîne d'interrogation) - c'est-à-dire ProjectID=462 . Comment puis-je obtenir cela en utilisant JavaScript ?

Voici ce que j'ai fait jusqu'à présent :

var url = window.location.toString();
url.match(?);

Je ne sais pas quoi faire ensuite.

Answer 1

Essayez celui-ci

/**
 * Get the value of a querystring
 * @param  {String} field The field to get the value of
 * @param  {String} url   The URL to get the value from (optional)
 * @return {String}       The field value
 */
var getQueryString = function ( field, url ) {
    var href = url ? url : window.location.href;
    var reg = new RegExp( '[?&]' + field + '=([^&#]*)', 'i' );
    var string = reg.exec(href);
    return string ? string[1] : null;
};

Disons que votre URL est http://example.com&this=chicken&that=sandwich . Vous voulez obtenir la valeur de ceci, cela, et autre.

var thisOne = getQueryString('this'); // returns 'chicken'
var thatOne = getQueryString('that'); // returns 'sandwich'
var anotherOne = getQueryString('another'); // returns null

Si vous voulez utiliser une URL autre que celle de la fenêtre, vous pouvez la passer comme deuxième argument.

var yetAnotherOne = getQueryString('example', 'http://another-example.com&example=something'); // returns 'something'

Référence

Answer 2

Je pense qu'il est beaucoup plus sûr de s'en remettre au navigateur qu'à une quelconque regex ingénieuse :

const parseUrl = function(url) { 
  const a = document.createElement('a')
  a.href = url
  return {
    protocol: a.protocol ? a.protocol : null,
    hostname: a.hostname ? a.hostname : null,
    port: a.port ? a.port : null,
    path: a.pathname ? a.pathname : null,
    query: a.search ? a.search : null,
    hash: a.hash ? a.hash : null,
    host: a.host ? a.host : null  
  }
}

console.log( parseUrl(window.location.href) ) //stacksnippet
//to obtain a query
console.log( parseUrl( 'https://example.com?qwery=this').query )

Answer 3

Ceci retournera les paramètres de la requête sous la forme d'un tableau associatif.

var queryParams =[];
var query= document.location.search.replace("?",'').split("&");
for(var i =0; i< query.length; i++)
{
  if(query[i]){
    var temp = query[i].split("=");
    queryParams[temp[0]] = temp[1]
  }
}

Answer 4

Pour les projets React Native, React et Node, le projet ci-dessous fonctionne.

yarn add  query-string

import queryString from 'query-string';

const parsed = queryString.parseUrl("https://pokeapi.co/api/v2/pokemon?offset=10&limit=10");

console.log(parsed.offset) will display 10