GET 매개 변수에서 값을 얻는 방법은 무엇입니까?

다음과 같이 GET 매개 변수가있는 URL이 있습니다.

www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5 

의 전체 가치를 얻어야합니다 c. URL을 읽으려고했지만 m2. JavaScript를 사용하여이 작업을 어떻게 수행합니까?

JavaScript 자체 에는 쿼리 문자열 매개 변수를 처리하기위한 기본 제공 기능이 없습니다.

(현대) 브라우저에서 실행되는 코드는 URL객체 (브라우저가 JS에 제공하는 API의 일부)를 사용할 수 있습니다 .

var url_string = "http://www.example.com/t.html?a=1&b=3&c=m2-m3-m4-m5"; //window.location.href
var url = new URL(url_string);
var c = url.searchParams.get("c");
console.log(c);

이전 브라우저 (Internet Explorer 포함)의 경우이 polyfill 또는 이전 버전의이 답변의 코드를 사용할 수 있습니다 URL.

URL location.search에서 ?문자 끝까지 또는 조각 식별자 (#foo)의 시작 (둘 중 빠른 것 중 하나)을 제공하는에 액세스 할 수 있습니다 .

그런 다음 다음과 같이 구문 분석 할 수 있습니다.

function parse_query_string(query) {
  var vars = query.split("&");
  var query_string = {};
  for (var i = 0; i < vars.length; i++) {
    var pair = vars[i].split("=");
    var key = decodeURIComponent(pair[0]);
    var value = decodeURIComponent(pair[1]);
    // If first entry with this name
    if (typeof query_string[key] === "undefined") {
      query_string[key] = decodeURIComponent(value);
      // If second entry with this name
    } else if (typeof query_string[key] === "string") {
      var arr = [query_string[key], decodeURIComponent(value)];
      query_string[key] = arr;
      // If third or later entry with this name
    } else {
      query_string[key].push(decodeURIComponent(value));
    }
  }
  return query_string;
}

var query_string = "a=1&b=3&c=m2-m3-m4-m5";
var parsed_qs = parse_query_string(query_string);
console.log(parsed_qs.c);

다음을 사용하여 현재 페이지의 URL에서 쿼리 문자열을 얻을 수 있습니다.

var query = window.location.search.substring(1);
var qs = parse_query_string(query);

내가 본 대부분의 구현은 이름과 값을 URL 디코딩하는 것을 놓쳤다.

올바른 URL 디코딩을 수행하는 일반적인 유틸리티 함수는 다음과 같습니다.

function getQueryParams(qs) {
    qs = qs.split('+').join(' ');

    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
    }

    return params;
}

//var query = getQueryParams(document.location.search);
//alert(query.foo);

출처

function gup( name, url ) {
    if (!url) url = location.href;
    name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
    var regexS = "[\\?&]"+name+"=([^&#]*)";
    var regex = new RegExp( regexS );
    var results = regex.exec( url );
    return results == null ? null : results[1];
}
gup('q', 'hxxp://example.com/?q=abc')

이것은 하나의 매개 변수를 확인하는 쉬운 방법입니다.

URL 예 :

    http://myserver/action?myParam=2

자바 스크립트 예제 :

    var myParam = location.search.split('myParam=')[1]

URL에 "myParam"이 있으면 변수 myParam에 "2"가 포함되고 그렇지 않으면 정의되지 않습니다.

이 경우 기본값을 원할 수도 있습니다.

    var myParam = location.search.split('myParam=')[1] ? location.search.split('myParam=')[1] : 'myDefaultValue';

업데이트 : 이것은 더 잘 작동합니다.

    var url = "http://www.example.com/index.php?myParam=384&login=admin"; // or window.location.href for current url
    var captured = /myParam=([^&]+)/.exec(url)[1]; // Value is in [1] ('384' in our case)
    var result = captured ? captured : 'myDefaultValue';

URL에 매개 변수가 가득 찬 경우에도 올바르게 작동합니다.

브라우저 공급 업체는 URL 및 URLSearchParams를 통해이를 수행하는 기본 방법을 구현했습니다.

let url = new URL('http://www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5');
let searchParams = new URLSearchParams(url.search);
console.log(searchParams.get('c'));  // outputs "m2-m3-m4-m5"

Firefox, Opera, Safari, Chrome 및 Edge에서 현재 지원됩니다. 브라우저 지원 목록 은 여기를 참조하십시오 .

https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams https://developer.mozilla.org/en-US/docs/Web/API/URL/URL

https://url.spec.whatwg.org/

Google 엔지니어 인 Eric Bidelman 은 지원되지 않는 브라우저 에이 폴리 필 을 사용 하도록 권장 합니다.

나는 이것을 아주 쉽게 발견했다.

function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi,    
    function(m,key,value) {
      vars[key] = value;
    });
    return vars;
  }

그런 다음 다음과 같이 호출하십시오.

var fType = getUrlVars()["type"];

에서 쿼리 문자열을 가져올 수 있으며 location.search물음표 다음에 모든 것을 나눌 수 있습니다.

var params = {};

if (location.search) {
    var parts = location.search.substring(1).split('&');

    for (var i = 0; i < parts.length; i++) {
        var nv = parts[i].split('=');
        if (!nv[0]) continue;
        params[nv[0]] = nv[1] || true;
    }
}

// Now you can get the parameters you want like so:
var abc = params.abc;

나는 더 간단하고 우아한 해결책을 썼습니다.

var arr = document.URL.match(/room=([0-9]+)/)
var room = arr[1];

URLSearchParams를 사용하는 매우 간단한 방법 입니다.

function getParam(param){
  return new URLSearchParams(window.location.search).get(param);
}

그것은 현재 크롬, 파이어 폭스, 사파리, 에지 및 지원 것 등 .

다음은 정규 표현식이없고 최소한의 돌연변이가있는 재귀 솔루션입니다 (params 객체 만 변경되어 JS에서는 피할 수 없다고 생각합니다).

그것이 굉장하기 때문에 :

• 재귀
• 같은 이름의 여러 매개 변수를 처리합니다
• 잘못된 매개 변수 문자열 (결 측값 등)을 잘 처리합니다.
• '='가 값에 있으면 중단되지 않습니다.
• URL 디코딩을 수행합니다
• 그리고 마지막으로, 그것은 굉장합니다 ... 아아!

암호:

var get_params = function(search_string) {

  var parse = function(params, pairs) {
    var pair = pairs[0];
    var parts = pair.split('=');
    var key = decodeURIComponent(parts[0]);
    var value = decodeURIComponent(parts.slice(1).join('='));

    // Handle multiple parameters of the same name
    if (typeof params[key] === "undefined") {
      params[key] = value;
    } else {
      params[key] = [].concat(params[key], value);
    }

    return pairs.length == 1 ? params : parse(params, pairs.slice(1))
  }

  // Get rid of leading ?
  return search_string.length == 0 ? {} : parse({}, search_string.substr(1).split('&'));
}

var params = get_params(location.search);

// Finally, to get the param you want
params['c'];

나는 이것을하는 기능을 만들었다 :

var getUrlParams = function (url) {
  var params = {};
  (url + '?').split('?')[1].split('&').forEach(function (pair) {
    pair = (pair + '=').split('=').map(decodeURIComponent);
    if (pair[0].length) {
      params[pair[0]] = pair[1];
    }
  });
  return params;
};

2017 년 5 월 26 일 업데이트, 여기에 ES7 구현이 있습니다 (바벨 사전 설정 단계 0, 1, 2 또는 3으로 실행).

const getUrlParams = url => `${url}?`.split('?')[1]
  .split('&').reduce((params, pair) =>
    ((key, val) => key ? {...params, [key]: val} : params)
    (...`${pair}=`.split('=').map(decodeURIComponent)), {});

일부 테스트 :

console.log(getUrlParams('https://google.com/foo?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('/foo?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('?a=1&b=2&c')); // Will log {a: '1', b: '2', c: ''}
console.log(getUrlParams('https://google.com/')); // Will log {}
console.log(getUrlParams('a=1&b=2&c')); // Will log {}

2018 년 3 월 26 일 업데이트, 여기에 Typescript 구현이 있습니다.

const getUrlParams = (search: string) => `${search}?`
  .split('?')[1]
  .split('&')
  .reduce(
    (params: object, pair: string) => {
      const [key, value] = `${pair}=`
        .split('=')
        .map(decodeURIComponent)

      return key.length > 0 ? { ...params, [key]: value } : params
    },
    {}
  )

2019 년 2 월 13 일 업데이트, TypeScript 3에서 작동하는 업데이트 된 TypeScript 구현이 있습니다.

interface IParams { [key: string]: string }

const paramReducer = (params: IParams, pair: string): IParams => {
  const [key, value] = `${pair}=`.split('=').map(decodeURIComponent)

  return key.length > 0 ? { ...params, [key]: value } : params
}

const getUrlParams = (search: string): IParams =>
  `${search}?`.split('?')[1].split('&').reduce<IParams>(paramReducer, {})

이것 좀 봐

function getURLParameters(paramName)
{
    var sURL = window.document.URL.toString();
    if (sURL.indexOf("?") > 0)
    {
        var arrParams = sURL.split("?");
        var arrURLParams = arrParams[1].split("&");
        var arrParamNames = new Array(arrURLParams.length);
        var arrParamValues = new Array(arrURLParams.length);

        var i = 0;
        for (i = 0; i<arrURLParams.length; i++)
        {
            var sParam =  arrURLParams[i].split("=");
            arrParamNames[i] = sParam[0];
            if (sParam[1] != "")
                arrParamValues[i] = unescape(sParam[1]);
            else
                arrParamValues[i] = "No Value";
        }

        for (i=0; i<arrURLParams.length; i++)
        {
            if (arrParamNames[i] == paramName)
            {
                //alert("Parameter:" + arrParamValues[i]);
                return arrParamValues[i];
            }
        }
        return "No Parameters Found";
    }
}

ECMAScript 6 솔루션 :

var params = window.location.search
  .substring(1)
  .split("&")
  .map(v => v.split("="))
  .reduce((map, [key, value]) => map.set(key, decodeURIComponent(value)), new Map())

나는 사용한다

function getVal(str) {
    var v = window.location.search.match(new RegExp('(?:[\?\&]'+str+'=)([^&]+)'));
    return v ? v[1] : null;
}

parseUri 라이브러리를 사용합니다 . 요청한 내용을 정확하게 수행 할 수 있습니다.

var uri = 'www.test.com/t.html&a=1&b=3&c=m2-m3-m4-m5';
var c = uri.queryKey['c'];
// c = 'm2-m3-m4-m5'

여기 내 해결책이 있습니다. Andy E 가이 질문에 대답하는 동안 조언했듯이 여러 정규 표현식 문자열을 반복적으로 작성하고 루프를 실행하여 단일 값을 얻으면 스크립트 성능에 좋지 않습니다. 따라서 모든 GET 매개 변수를 단일 객체로 반환하는 더 간단한 스크립트를 만들었습니다. 한 번만 호출하고 결과를 변수에 할당 한 다음 나중에 언제라도 적절한 키를 사용하여 해당 변수에서 원하는 값을 가져와야합니다. 또한 URI 디코딩 (예 : % 20)을 처리하고 +를 공백으로 바꿉니다.

 function getUrlQueryParams(url) {
  var queryString = url.split("?")[1];
  var keyValuePairs = queryString.split("&");
  var keyValue = [];
  var queryParams = {};
  keyValuePairs.forEach(function(pair) {
    keyValue = pair.split("=");
    queryParams[keyValue[0]] = decodeURIComponent(keyValue[1]).replace(/\+/g, " ");
});
  return queryParams;
}

다음은 스크립트에 대한 몇 가지 테스트입니다.

// Query parameters with strings only, no special characters.
var currentParams = getUrlQueryParams("example.com/foo?number=zero");
alert(currentParams["number"]); // Gives "zero".

// For the URL you stated above...
var someParams = getUrlQueryParams("www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5 ");
alert(someParams["c"]); // Gives "m2-m3-m4-m5".

// For a query params with URI encoding...
var someParams = getUrlQueryParams("www.example.com/t.html?phrase=a%20long%20shot&location=Silicon+Valley%2C+USA");
alert(someParams["phrase"]); // Gives "a long shot".
alert(someParams["location"]); // Gives "Silicon Valley, USA".

또는 URI 구문 분석 휠을 재발 명하지 않으려면 URI.js를 사용 하십시오.

foo라는 매개 변수의 값을 얻으려면 다음을 수행하십시오.

new URI((''+document.location)).search(true).foo

그게 뭐야

1. document.location을 문자열로 변환하십시오 (객체입니다).
2. 해당 문자열을 URI.js의 URI 클래스 구성자에 공급하십시오.
3. search () 함수를 호출하여 URL의 검색 (쿼리) 부분을 가져옵니다
   (true를 전달하면 객체를 출력하도록 알려줍니다)
4. 결과 객체의 foo 속성에 액세스하여 값을 가져옵니다.

여기에 바이올린이 있습니다 .... http://jsfiddle.net/m6tett01/12/

들어 단일 매개 변수 값 이 index.html을 같이? MSG = 1 사용 코드 다음,

$(window).load(function(){
    queryString();
});

function queryString()
{
    var queryString = window.location.search.substring(1);
    var varArray = queryString.split("="); //eg. index.html?msg=1

    var param1 = varArray[0];
    var param2 = varArray[1];

}

대한 모든 매개 변수 값을 사용, 코드를 다음

$(window).load(function(){
    queryString();
});

function queryString()
{
    var queryString = window.location.search;
    var varArray = queryString.split("&");
    for (var i=0;i<varArray.length;i++) {
      var param = varArray[i].split("=");
        //parameter-value pair
    }
} 

여기에 하나의 예를 게시하고 있습니다. 그러나 jQuery에 있습니다. 그것이 다른 사람들을 도울 것입니다 :

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.url.js"></script>

<!-- URL:  www.example.com/correct/?message=done&year=1990-->

<script type="text/javascript">
$(function(){
    $.url.attr('protocol')  // --> Protocol: "http"
    $.url.attr('path')          // --> host: "www.example.com"
    $.url.attr('query')         // --> path: "/correct/"
    $.url.attr('message')   // --> query: "done"
    $.url.attr('year')      // --> query: "1990"
});
</script>

가장 짧은 방법 :

new URL(location.href).searchParams.get("my_key");

이 질문에 답변이 너무 많아서 다른 질문을 추가하고 있습니다.

/**
 * parses and returns URI query parameters 
 * 
 * @param {string} param parm
 * @param {bool?} asArray if true, returns an array instead of a scalar 
 * @returns {Object|Array} 
 */
function getURIParameter(param, asArray) {
    return document.location.search.substring(1).split('&').reduce(function(p,c) {
        var parts = c.split('=', 2).map(function(param) { return decodeURIComponent(param); });
        if(parts.length == 0 || parts[0] != param) return (p instanceof Array) && !asArray ? null : p;
        return asArray ? p.concat(parts.concat(true)[1]) : parts.concat(true)[1];
    }, []);
}

용법:

getURIParameter("id")  // returns the last id or null if not present
getURIParameter("id", true) // returns an array of all ids

이것은 빈 매개 변수 (키없이 존재하는 키 "=value"), 스칼라 및 배열 기반 값 검색 API의 노출 및 적절한 URI 구성 요소 디코딩에 대처 합니다.

이 방법을 사용하는 가장 쉬운 replace()방법 :

로부터 urlStr문자열 :

paramVal = urlStr.replace(/.*param_name=([^&]*).*|(.*)/, '$1');

또는 현재 URL에서 :

paramVal = document.URL.replace(/.*param_name=([^&]*).*|(.*)/, '$1');

설명:

• document.URL -interface는 문서 위치 (페이지 URL)를 문자열로 반환합니다.
• replace()-메소드는 패턴 의 일부 또는 전부 가 대체로 대체 된 새 문자열을 리턴합니다. .
• /.*param_name=([^&]*).*/- 정규식 슬래시로 묶인 패턴은 다음을 의미합니다.
  • .* -0 개 이상의 문자
  • param_name= -매개 변수 이름,
  • () -정규식으로 그룹화
  • [^&]* -다음을 제외한 모든 문자 중 하나 이상 & ,
  • | -교대
  • $1 -정규식의 첫 번째 그룹에 대한 참조.

var urlStr = 'www.test.com/t.html?a=1&b=3&c=m2-m3-m4-m5';
var c = urlStr.replace(/.*c=([^&]*).*|(.*)/, '$1');
var notExisted = urlStr.replace(/.*not_existed=([^&]*).*|(.*)/, '$1');
console.log(`c === '${c}'`);
console.log(`notExisted === '${notExisted}'`);

또 다른 제안.

이미 좋은 답변이 있지만, 나는 그것들이 불필요하게 복잡하고 이해하기 어렵다는 것을 알았습니다. 짧고 간단하며 URL의 토큰 이름에 해당하는 키 이름을 가진 간단한 연관 배열을 반환합니다.

배우고 싶은 사람들을 위해 아래에 주석이 달린 버전을 추가했습니다.

이것은 루프를 위해 jQuery ($ .each)에 의존합니다 .forEach 대신 권장합니다. 이전 브라우저에서 지원되지 않는 새로운 기능을 지원하기 위해 개별 수정 프로그램을 연결하는 대신 jQuery를 사용하여 크로스 브라우저 호환성을 보장하는 것이 더 간단하다는 것을 알았습니다.

편집 :이 글을 쓴 후 나는 Eric Elliott의 대답을 알았습니다 .Each는 위와 같은 이유로 일반적으로 반대하지만 forEach를 사용하지만 거의 동일합니다.

function getTokens(){
    var tokens = [];
    var query = location.search;
    query = query.slice(1);
    query = query.split('&');
    $.each(query, function(i,value){    
        var token = value.split('=');   
        var key = decodeURIComponent(token[0]);     
        var data = decodeURIComponent(token[1]);
        tokens[key] = data;
    });
    return tokens;
}

댓글 버전 :

function getTokens(){
    var tokens = [];            // new array to hold result
    var query = location.search; // everything from the '?' onward 
    query = query.slice(1);     // remove the first character, which will be the '?' 
    query = query.split('&');   // split via each '&', leaving us an array of something=something strings

    // iterate through each something=something string
    $.each(query, function(i,value){    

        // split the something=something string via '=', creating an array containing the token name and data
        var token = value.split('=');   

        // assign the first array element (the token name) to the 'key' variable
        var key = decodeURIComponent(token[0]);     

        // assign the second array element (the token data) to the 'data' variable
        var data = decodeURIComponent(token[1]);

        tokens[key] = data;     // add an associative key/data pair to our result array, with key names being the URI token names
    });

    return tokens;  // return the array
}

아래 예에서는이 주소를 가정합니다.

http://www.example.com/page.htm?id=4&name=murray

URL 토큰을 자신의 변수에 할당 할 수 있습니다.

var tokens = getTokens();

그런 다음 다음과 같이 이름으로 각 URL 토큰을 참조하십시오.

document.write( tokens['id'] );

"4"가 인쇄됩니다.

함수에서 직접 토큰 이름을 참조 할 수도 있습니다.

document.write( getTokens()['name'] );

"murray"를 인쇄합니다.

// Read a page's GET URL variables and return them as an associative array.
function getUrlVars()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
    for(var i = 0; i < hashes.length; i++)
    {
        hash = hashes[i].split('=');
        vars.push(hash[0]);
        vars[hash[0]] = hash[1];
    }
    return vars;
}

// Usage for URL: http://my.site.com/location?locationId=53cc272c0364aefcb78756cd&shared=false
var id = getUrlVars()["locationId"];

여기에서 얻었습니다 : http://jquery-howto.blogspot.ru/2009/09/get-url-parameters-values-with-jquery.html

간단한 방법

function getParams(url){
        var regex = /[?&]([^=#]+)=([^&#]*)/g,
            params = {},
            match;
        while(match = regex.exec(url)) {
            params[match[1]] = match[2];
        }
        return params;
    }

그런 다음 getParams (url)처럼 호출하십시오.

URL GET 변수를 읽고 url 매개 변수를 기반으로 작업을 완료해야했습니다. 나는 해결책을 찾기 위해 높고 낮은 것을 찾고이 작은 코드를 보았습니다. 기본적으로 현재 페이지 URL을 읽고 URL에서 정규 표현식을 수행 한 다음 URL 매개 변수를 연관 배열에 저장하여 쉽게 액세스 할 수 있습니다.

예를 들어 하단에 자바 스크립트가있는 다음 URL이있는 경우.

http://TestServer/Pages/NewsArchive.aspx?year=2013&Month=July

매개 변수 id와 page를 얻기 위해해야 ​​할 일은 다음과 같습니다.

강령은 다음과 같습니다.

<script type="text/javascript">
var first = getUrlVars()["year"];
var second = getUrlVars()["Month"];

alert(first);
alert(second);
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
</script>

// http:localhost:8080/path?param_1=a&param_2=b
var getParamsMap = function () {
    var params = window.location.search.split("&");
    var paramsMap = {};
    params.forEach(function (p) {
        var v = p.split("=");
        paramsMap[v[0]]=decodeURIComponent(v[1]);
    });
    return paramsMap;
};

// -----------------------

console.log(getParamsMap()["param_1"]);  // should log "a"     

Eldon McGuinness의 Gist 는 지금까지 본 JavaScript 쿼리 문자열 파서의 가장 완벽한 구현입니다.

불행히도, 그것은 jQuery 플러그인으로 작성되었습니다.

나는 그것을 바닐라 JS에 다시 쓰고 몇 가지 개선을했습니다.

function parseQuery(str) {
  var qso = {};
  var qs = (str || document.location.search);
  // Check for an empty querystring
  if (qs == "") {
    return qso;
  }
  // Normalize the querystring
  qs = qs.replace(/(^\?)/, '').replace(/;/g, '&');
  while (qs.indexOf("&&") != -1) {
    qs = qs.replace(/&&/g, '&');
  }
  qs = qs.replace(/([\&]+$)/, '');
  // Break the querystring into parts
  qs = qs.split("&");
  // Build the querystring object
  for (var i = 0; i < qs.length; i++) {
    var qi = qs[i].split("=");
    qi = qi.map(function(n) {
      return decodeURIComponent(n)
    });
    if (typeof qi[1] === "undefined") {
      qi[1] = null;
    }
    if (typeof qso[qi[0]] !== "undefined") {

      // If a key already exists then make this an object
      if (typeof (qso[qi[0]]) == "string") {
        var temp = qso[qi[0]];
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]] = [];
        qso[qi[0]].push(temp);
        qso[qi[0]].push(qi[1]);

      } else if (typeof (qso[qi[0]]) == "object") {
        if (qi[1] == "") {
          qi[1] = null;
        }
        qso[qi[0]].push(qi[1]);
      }
    } else {
      // If no key exists just set it as a string
      if (qi[1] == "") {
        qi[1] = null;
      }
      qso[qi[0]] = qi[1];
    }
  }
  return qso;
}

// DEMO
console.log(parseQuery("?foo=bar&foo=boo&roo=bar;bee=bop;=ghost;=ghost2;&;checkbox%5B%5D=b1;checkbox%5B%5D=b2;dd=;http=http%3A%2F%2Fw3schools.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab&http=http%3A%2F%2Fw3schools2.com%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab"));

이 바이올린을 참조하십시오 .

우아하고 기능적인 스타일 솔루션

URL 매개 변수 이름을 키로 포함하는 객체를 만든 다음 이름으로 매개 변수를 쉽게 추출 할 수 있습니다.

// URL: https://example.com/?test=true&orderId=9381  

// Build an object containing key-value pairs
export const queryStringParams = window.location.search
  .split('?')[1]
  .split('&')
  .map(keyValue => keyValue.split('='))
  .reduce<QueryStringParams>((params, [key, value]) => {
    params[key] = value;
    return params;
  }, {});

type QueryStringParams = {
  [key: string]: string;
};


// Return URL parameter called "orderId"
return queryStringParams.orderId;

여기 내가하는 일이 있습니다.

var uriParams = getSearchParameters();
alert(uriParams.c);


// background functions:

// Get object/associative array of URL parameters
function getSearchParameters () {
  var prmstr = window.location.search.substr(1);
  return prmstr !== null && prmstr !== "" ? transformToAssocArray(prmstr) : {};
}

// convert parameters from url-style string to associative array
function transformToAssocArray (prmstr) {
  var params = {},
      prmarr = prmstr.split("&");

  for (var i = 0; i < prmarr.length; i++) {
    var tmparr = prmarr[i].split("=");
    params[tmparr[0]] = tmparr[1];
  }
  return params;
}