programing

어떻게 자바 스크립트 개체에 URL매개 변수 변환하는 데?

shortcode 2022. 9. 13. 22:30
반응형

어떻게 자바 스크립트 개체에 URL매개 변수 변환하는 데?

나는:이 문자열이 있다.

abc=foo&def=%5Basf%5D&xyz=5

어떻게 나는 이것과 비슷한 자바 스크립트 개체로 변환할 수 있을까요?

{
  abc: 'foo',
  def: '[asf]',
  xyz: 5
}

1년 2021년에...주세요 낡은 것으로 이것을 고려해 보자.

편집

이 편집과 대답이 말에 근거해 설명을 향상시킨다.

var search = location.search.substring(1);
JSON.parse('{"' + decodeURI(search).replace(/"/g, '\\"').replace(/&/g, '","').replace(/=/g,'":"') + '"}')

abc=foo&def=%5Basf%5D&xyz=5 5단계:

  • decodeURI:abc=foo&, def=[asf]&, xyz=5
  • 탈출 말에는, 없기 때문에 인용이 똑같다.
  • , 치환:abc=foo","def=[asf]","xyz=5
  • 교체: = :abc":"foo","def":"[asf]","xyz":"5
  • 따옴표로 :{"abc":"foo","def":"[asf]","xyz":"5"}

합법적인 JSON입니다.

개선된 솔루션에서는 검색 문자열에 더 많은 문자를 사용할 수 있습니다.URI 디코딩에는 리바이버 함수를 사용합니다.

var search = location.search.substring(1);
JSON.parse('{"' + search.replace(/&/g, '","').replace(/=/g,'":"') + '"}', function(key, value) { return key===""?value:decodeURIComponent(value) })

search = "abc=foo&def=%5Basf%5D&xyz=5&foo=b%3Dar";

주다

Object {abc: "foo", def: "[asf]", xyz: "5", foo: "b=ar"}

원답

원라이너:

JSON.parse('{"' + decodeURI("abc=foo&def=%5Basf%5D&xyz=5".replace(/&/g, "\",\"").replace(/=/g,"\":\"")) + '"}')

2022 ES6/7/8 및 접근 중

ES6 이후 Javascript는 이 문제에 대한 고성능 솔루션을 만들기 위해 몇 가지 구성을 제공합니다.

여기에는 URLearchParams반복기 사용도 포함됩니다.

let params = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');
params.get("abc"); // "foo"

사용 사례에서 실제로 개체로 변환해야 할 경우 다음 기능을 구현할 수 있습니다.

function paramsToObject(entries) {
  const result = {}
  for(const [key, value] of entries) { // each 'entry' is a [key, value] tupple
    result[key] = value;
  }
  return result;
}

기본 데모

const urlParams = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');
const entries = urlParams.entries(); //returns an iterator of decoded [key,value] tuples
const params = paramsToObject(entries); //{abc:"foo",def:"[asf]",xyz:"5"}

Object.fromEntries 및 스프레드 사용

Object.fromEntries를 사용할 수 있습니다.paramsToObjectObject.fromEntries(entries).

반복하는 값의 쌍은, 리스트의 이름과 값의 쌍으로, 키는 이름, 값은 값입니다.

★★URLParams는 호출 대신 확산 연산자를 사용하여 반복 가능한 개체를 반환합니다..entries이치노

const urlParams = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5');
const params = Object.fromEntries(urlParams); // {abc: "foo", def: "[asf]", xyz: "5"}

주의: 모든 값은 URLearchParams 사양에 따라 자동으로 문자열이 됩니다.

여러 개의 동일한 키

@siipe가 지적한 바와 같이 여러 개의 동일한 키 값을 포함하는 문자열은 사용 가능한 마지막 값으로 강제됩니다.foo=first_value&foo=second_value으로 다음과 같습니다.{foo: "second_value"}.

이 답변에 따르면, https://stackoverflow.com/a/1746566/1194694은 이를 사용하여 무엇을 할지 결정하는 사양이 없으며 각 프레임워크는 다르게 동작할 수 있습니다.

일반적인 사용 예로는 두 개의 동일한 값을 배열에 결합하여 출력 개체를 다음과 같이 만드는 것입니다.

{foo: ["first_value", "second_value"]}

이것은, 다음의 코드로 실시할 수 있습니다.

const groupParamsByKey = (params) => [...params.entries()].reduce((acc, tuple) => {
 // getting the key and value from each tuple
 const [key, val] = tuple;
 if(acc.hasOwnProperty(key)) {
    // if the current key is already an array, we'll add the value to it
    if(Array.isArray(acc[key])) {
      acc[key] = [...acc[key], val]
    } else {
      // if it's not an array, but contains a value, we'll convert it into an array
      // and add the current value to it
      acc[key] = [acc[key], val];
    }
 } else {
  // plain assignment if no special case is present
  acc[key] = val;
 }

return acc;
}, {});

const params = new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5&def=dude');
const output = groupParamsByKey(params) // {abc: "foo", def: ["[asf]", "dude"], xyz: 5}

라이너 하나.깔끔하고 심플합니다.

const params = Object.fromEntries(new URLSearchParams(location.search));

구체적인 경우는 다음과 같습니다.

const str = 'abc=foo&def=%5Basf%5D&xyz=5';
const params = Object.fromEntries(new URLSearchParams(str));
console.log(params);

2022년 원라이너 어프로치

쿼리 파라미터를 객체에 해석하는 일반적인 경우:

Object.fromEntries(new URLSearchParams(location.search));

고객 고유의 경우:

Object.fromEntries(new URLSearchParams('abc=foo&def=%5Basf%5D&xyz=5'));

& 쌍을 각 합니다.=하다

var str = "abc=foo&def=%5Basf%5D&xy%5Bz=5"
var obj = str.split("&").reduce(function(prev, curr, i, arr) {
    var p = curr.split("=");
    prev[decodeURIComponent(p[0])] = decodeURIComponent(p[1]);
    return prev;
}, {});

정규 표현을 사용하는 또 다른 접근법:

var obj = {}; 
str.replace(/([^=&]+)=([^&]*)/g, function(m, key, value) {
    obj[decodeURIComponent(key)] = decodeURIComponent(value);
}); 

이것은 John Resig의 "Search and Don't Replace"를 각색한 것입니다.

지금까지 제가 찾은 제안 솔루션은 더 복잡한 시나리오를 다루지 않습니다.

다음과 같은 쿼리 문자열을 변환해야 했습니다.

https://random.url.com?Target=Offer&Method=findAll&filters%5Bhas_goals_enabled%5D%5BTRUE%5D=1&filters%5Bstatus%5D=active&fields%5B%5D=id&fields%5B%5D=name&fields%5B%5D=default_goal_name

다음과 같은 오브젝트로 변환합니다.

{
    "Target": "Offer",
    "Method": "findAll",
    "fields": [
        "id",
        "name",
        "default_goal_name"
    ],
    "filters": {
        "has_goals_enabled": {
            "TRUE": "1"
        },
        "status": "active"
    }
}

또는:

https://random.url.com?Target=Report&Method=getStats&fields%5B%5D=Offer.name&fields%5B%5D=Advertiser.company&fields%5B%5D=Stat.clicks&fields%5B%5D=Stat.conversions&fields%5B%5D=Stat.cpa&fields%5B%5D=Stat.payout&fields%5B%5D=Stat.date&fields%5B%5D=Stat.offer_id&fields%5B%5D=Affiliate.company&groups%5B%5D=Stat.offer_id&groups%5B%5D=Stat.date&filters%5BStat.affiliate_id%5D%5Bconditional%5D=EQUAL_TO&filters%5BStat.affiliate_id%5D%5Bvalues%5D=1831&limit=9999

대상:

{
    "Target": "Report",
    "Method": "getStats",
    "fields": [
        "Offer.name",
        "Advertiser.company",
        "Stat.clicks",
        "Stat.conversions",
        "Stat.cpa",
        "Stat.payout",
        "Stat.date",
        "Stat.offer_id",
        "Affiliate.company"
    ],
    "groups": [
        "Stat.offer_id",
        "Stat.date"
    ],
    "limit": "9999",
    "filters": {
        "Stat.affiliate_id": {
            "conditional": "EQUAL_TO",
            "values": "1831"
        }
    }
}

복수의 솔루션을 컴파일 해, 실제로 기능하는 하나의 솔루션으로 조정했습니다.

코드:

var getParamsAsObject = function (query) {

    query = query.substring(query.indexOf('?') + 1);

    var re = /([^&=]+)=?([^&]*)/g;
    var decodeRE = /\+/g;

    var decode = function (str) {
        return decodeURIComponent(str.replace(decodeRE, " "));
    };

    var params = {}, e;
    while (e = re.exec(query)) {
        var k = decode(e[1]), v = decode(e[2]);
        if (k.substring(k.length - 2) === '[]') {
            k = k.substring(0, k.length - 2);
            (params[k] || (params[k] = [])).push(v);
        }
        else params[k] = v;
    }

    var assign = function (obj, keyPath, value) {
        var lastKeyIndex = keyPath.length - 1;
        for (var i = 0; i < lastKeyIndex; ++i) {
            var key = keyPath[i];
            if (!(key in obj))
                obj[key] = {}
            obj = obj[key];
        }
        obj[keyPath[lastKeyIndex]] = value;
    }

    for (var prop in params) {
        var structure = prop.split('[');
        if (structure.length > 1) {
            var levels = [];
            structure.forEach(function (item, i) {
                var key = item.replace(/[?[\]\\ ]/g, '');
                levels.push(key);
            });
            assign(params, levels, params[prop]);
            delete(params[prop]);
        }
    }
    return params;
};

간결한 솔루션:

location.search
  .slice(1)
  .split('&')
  .map(p => p.split('='))
  .reduce((obj, pair) => {
    const [key, value] = pair.map(decodeURIComponent);
    obj[key] = value;
    return obj;
  }, {});

이것은 간단한 버전입니다.오류 체크를 추가할 필요가 있습니다.

var obj = {};
var pairs = queryString.split('&');
for(i in pairs){
    var split = pairs[i].split('=');
    obj[decodeURIComponent(split[0])] = decodeURIComponent(split[1]);
}

나는 달러를 찾았다.String.deparam은 가장 완전한 사전 빌드 솔루션입니다(네스트된 객체 등을 수행할 수 있습니다).메뉴얼을 참조해 주세요.

JS의 API의 JS API를 할 수 .querystring:

const querystring = require('querystring');

querystring.parse('abc=foo&def=%5Basf%5D&xyz=5&foo=b%3Dar');
// returns the object

문서: https://nodejs.org/api/querystring.html

URLearchParams의 최신 표준을 기반으로 한 또 다른 솔루션(https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams)

function getQueryParamsObject() {
  const searchParams = new URLSearchParams(location.search.slice(1));
  return searchParams
    ? _.fromPairs(Array.from(searchParams.entries()))
    : {};
}

이 솔루션에서는, 다음의 기능을 사용하고 있는 것에 주의해 주세요.

Array.from (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from)

_.fromPairs(간단함을 위해 lodash의 https://lodash.com/docs#fromPairs))를 참조하십시오.

searchParams.entries() 반복기에 액세스할 수 있기 때문에 호환성이 높은 솔루션을 쉽게 만들 수 있습니다.

여기서도 같은 문제가 있었습니다만, URL 파라미터에 다음과 같은 어레이가 포함되어 있기 때문에, 실제로는 아무것도 동작하지 않았습니다.

?param[]=5&param[]=8&othr_param=abc&param[]=string

그래서 URI의 파라미터에서 배열을 만드는 JS 함수를 작성하게 되었습니다.

/**
 * Creates an object from URL encoded data
 */
var createObjFromURI = function() {
    var uri = decodeURI(location.search.substr(1));
    var chunks = uri.split('&');
    var params = Object();

    for (var i=0; i < chunks.length ; i++) {
        var chunk = chunks[i].split('=');
        if(chunk[0].search("\\[\\]") !== -1) {
            if( typeof params[chunk[0]] === 'undefined' ) {
                params[chunk[0]] = [chunk[1]];

            } else {
                params[chunk[0]].push(chunk[1]);
            }


        } else {
            params[chunk[0]] = chunk[1];
        }
    }

    return params;
}

URLearchParam 인터페이스를 사용하여 이를 수행하는 가장 간단한 방법 중 하나입니다.

동작 코드 스니펫은 다음과 같습니다.

let paramObj={},
    querystring=window.location.search,
    searchParams = new URLSearchParams(querystring);    

  //*** :loop to add key and values to the param object.
 searchParams.forEach(function(value, key) {
      paramObj[key] = value;
   });

ES6, URL API 및 URLearchParams API를 사용합니다.

function objectifyQueryString(url) {
  let _url = new URL(url);
  let _params = new URLSearchParams(_url.search);
  let query = Array.from(_params.keys()).reduce((sum, value)=>{
    return Object.assign({[value]: _params.get(value)}, sum);
  }, {});
  return query;
}

ES6 1개의 라이너(긴 라인이라고 할 수 있는 경우)

[...new URLSearchParams(location.search).entries()].reduce((prev, [key,val]) => {prev[key] = val; return prev}, {})

기본 노드 모듈을 사용한 간단한 답변입니다.(서드파티제의 npm 모듈 없음)

querystring 모듈은 URL 쿼리 문자열을 해석 및 포맷하기 위한 유틸리티를 제공합니다.다음 방법으로 액세스 할 수 있습니다.

const querystring = require('querystring');

const body = "abc=foo&def=%5Basf%5D&xyz=5"
const parseJSON = querystring.parse(body);
console.log(parseJSON);

ES6에는 매우 간단하고 잘못된 답이 있습니다.

console.log(
  Object.fromEntries(new URLSearchParams(`abc=foo&def=%5Basf%5D&xyz=5`))
);

단, 이 1개의 라인코드는 같은 키를 여러커버하지 않기 때문에 보다 복잡한 것을 사용해야 합니다.

function parseParams(params) {
  const output = [];
  const searchParams = new URLSearchParams(params);

  // Set will return only unique keys()
  new Set([...searchParams.keys()])
    .forEach(key => {
      output[key] = searchParams.getAll(key).length > 1 ?  
        searchParams.getAll(key) : // get multiple values
        searchParams.get(key); // get single value
    });

  return output;
}

console.log(
   parseParams('abc=foo&cars=Ford&cars=BMW&cars=Skoda&cars=Mercedes')
)

코드는 다음 구조를 생성합니다.

[
  abc: "foo"
  cars: ["Ford", "BMW", "Skoda", "Mercedes"]
]

은 꽤 간단합니다.URLSearchParams API JavaScript Web API,

var paramsString = "abc=foo&def=%5Basf%5D&xyz=5";

//returns an iterator object
var searchParams = new URLSearchParams(paramsString);

//Usage
for (let p of searchParams) {
  console.log(p);
}

//Get the query strings
console.log(searchParams.toString());

//You can also pass in objects

var paramsObject = {abc:"forum",def:"%5Basf%5D",xyz:"5"}

//returns an iterator object
var searchParams = new URLSearchParams(paramsObject);

//Usage
for (let p of searchParams) {
  console.log(p);
}

//Get the query strings
console.log(searchParams.toString());

##유용한 링크

메모: IE에서는 지원되지 않습니다.

제가 알고 있는 네이티브 솔루션은 없습니다.Dojo는 우연히 그 틀을 사용하면 비직렬화 방법이 내장되어 있습니다.

그렇지 않으면 직접 구현할 수 있습니다.

function unserialize(str) {
  str = decodeURIComponent(str);
  var chunks = str.split('&'),
      obj = {};
  for(var c=0; c < chunks.length; c++) {
    var split = chunks[c].split('=', 2);
    obj[split[0]] = split[1];
  }
  return obj;
}

편집: 디코드 추가URIC 구성 요소()

/**
 * Parses and builds Object of URL query string.
 * @param {string} query The URL query string.
 * @return {!Object<string, string>}
 */
function parseQueryString(query) {
  if (!query) {
    return {};
  }
  return (/^[?#]/.test(query) ? query.slice(1) : query)
      .split('&')
      .reduce((params, param) => {
        const item = param.split('=');
        const key = decodeURIComponent(item[0] || '');
        const value = decodeURIComponent(item[1] || '');
        if (key) {
          params[key] = value;
        }
        return params;
      }, {});
}

console.log(parseQueryString('?v=MFa9pvnVe0w&ku=user&from=89&aw=1'))
see log

테스트를 거친 YouAreI.js라는 경량 라이브러리가 있습니다.

YouAreI = require('YouAreI')
uri = new YouAreI('http://user:pass@www.example.com:3000/a/b/c?d=dad&e=1&f=12.3#fragment');

uri.query_get() => { d: 'dad', e: '1', f: '12.3' }

URI.js 를 사용하고 있는 경우는, 다음을 사용할 수 있습니다.

https://medialize.github.io/URI.js/docs.html#static-parseQuery

var result = URI.parseQuery("?foo=bar&hello=world&hello=mars&bam=&yup");
result === {
  foo: "bar",
  hello: ["world", "mars"],
  bam: "",
  yup: null
};

console.log(decodeURI('abc=foo&def=%5Basf%5D&xyz=5')
  .split('&')
  .reduce((result, current) => {
    const [key, value] = current.split('=');

    result[key] = value;

    return result
  }, {}))

이것은 같은 이름의 여러 파라미터를 고려하기 때문에 최적의 솔루션인 것 같습니다.

    function paramsToJSON(str) {
        var pairs = str.split('&');
        var result = {};
        pairs.forEach(function(pair) {
            pair = pair.split('=');
            var name = pair[0]
            var value = pair[1]
            if( name.length )
                if (result[name] !== undefined) {
                    if (!result[name].push) {
                        result[name] = [result[name]];
                    }
                    result[name].push(value || '');
                } else {
                    result[name] = value || '';
                }
        });
        return( result );
    }

<a href="index.html?x=1&x=2&x=3&y=blah">something</a>
paramsToJSON("x=1&x=2&x=3&y=blah"); 

console yields => {x: Array[3], y: "blah"} where x is an array as is proper JSON

나중에 jQuery 플러그인으로도 변환하기로 했습니다...

$.fn.serializeURLParams = function() {
    var result = {};

    if( !this.is("a") || this.attr("href").indexOf("?") == -1 ) 
        return( result );

    var pairs = this.attr("href").split("?")[1].split('&');
    pairs.forEach(function(pair) {
        pair = pair.split('=');
        var name = decodeURI(pair[0])
        var value = decodeURI(pair[1])
        if( name.length )
            if (result[name] !== undefined) {
                if (!result[name].push) {
                    result[name] = [result[name]];
                }
                result[name].push(value || '');
            } else {
                result[name] = value || '';
            }
    });
    return( result )
}

<a href="index.html?x=1&x=2&x=3&y=blah">something</a>
$("a").serializeURLParams(); 

console yields => {x: Array[3], y: "blah"} where x is an array as is proper JSON

첫 번째 에서는 파라미터만 받아들이지만 jQuery 플러그인은 URL 전체를 받아들여 시리얼화된 파라미터를 반환합니다.

사용하는 것은 다음과 같습니다.

var params = {};
window.location.search.substring(1).split('&').forEach(function(pair) {
  pair = pair.split('=');
  if (pair[1] !== undefined) {
    var key = decodeURIComponent(pair[0]),
        val = decodeURIComponent(pair[1]),
        val = val ? val.replace(/\++/g,' ').trim() : '';

    if (key.length === 0) {
      return;
    }
    if (params[key] === undefined) {
      params[key] = val;
    }
    else {
      if ("function" !== typeof params[key].push) {
        params[key] = [params[key]];
      }
      params[key].push(val);
    }
  }
});
console.log(params);

★★★★★★★★★★★★★★★★★★★★
?a=aa&b=bb
Object {a: "aa", b: "bb"}

중복된 매개 변수(예:
?a=aa&b=bb&c=cc&c=potato
Object {a: "aa", b: "bb", c: ["cc","potato"]}

키가 없습니다(예:
?a=aa&b=bb&=cc
Object {a: "aa", b: "bb"}

★★★★★★★★★★★★★★★★★★★
?a=aa&b=bb&c
Object {a: "aa", b: "bb"}

의 JSON은 "JSON/regex"라는 URL에 시킵니다.
?a=aa&b=bb&c=&=dd&e
Object {a: "aa", b: "bb", c: ""}

여기 빠르고 더러운 버전이 있습니다. 기본적으로 URL 매개 변수를 '&'로 구분된 어레이 요소로 나눈 다음, '='로 구분된 키/값 쌍을 개체로 추가하는 작업을 반복합니다.디코드 사용 중URIComponent()는 인코딩된 문자를 일반 문자열 등가 문자열로 변환합니다(따라서 %20은 공백이 되고 %26은 '&' 등이 됩니다).

function deparam(paramStr) {
    let paramArr = paramStr.split('&');     
    let paramObj = {};
    paramArr.forEach(e=>{
        let param = e.split('=');
        paramObj[param[0]] = decodeURIComponent(param[1]);
    });
    return paramObj;
}

예:

deparam('abc=foo&def=%5Basf%5D&xyz=5')

돌아온다

{
    abc: "foo"
    def:"[asf]"
    xyz :"5"
}

유일한 문제는 xyz가 숫자가 아닌 문자열이라는 것입니다(디코딩 사용으로 인해).URIComponent()를 포함하지만 그 이후로는 나쁘지 않습니다.

//under ES6 
const getUrlParamAsObject = (url = window.location.href) => {
    let searchParams = url.split('?')[1];
    const result = {};
    //in case the queryString is empty
    if (searchParams!==undefined) {
        const paramParts = searchParams.split('&');
        for(let part of paramParts) {
            let paramValuePair = part.split('=');
            //exclude the case when the param has no value
            if(paramValuePair.length===2) {
                result[paramValuePair[0]] = decodeURIComponent(paramValuePair[1]);
            }
        }

    }
    return result;
}

재귀가 필요한 경우 작은 js-extension-ling 라이브러리를 사용할 수 있습니다.

npm i js-extension-ling
const jsx = require("js-extension-ling");

console.log(jsx.queryStringToObject("a=1")); 
console.log(jsx.queryStringToObject("a=1&a=3")); 
console.log(jsx.queryStringToObject("a[]=1")); 
console.log(jsx.queryStringToObject("a[]=1&a[]=pomme")); 
console.log(jsx.queryStringToObject("a[0]=one&a[1]=five"));
console.log(jsx.queryStringToObject("http://blabla?foo=bar&number=1234")); 
console.log(jsx.queryStringToObject("a[fruits][red][]=strawberry"));
console.log(jsx.queryStringToObject("a[fruits][red][]=strawberry&a[1]=five&a[fruits][red][]=cherry&a[fruits][yellow][]=lemon&a[fruits][yellow][688]=banana"));

다음과 같이 출력됩니다.

{ a: '1' }
{ a: '3' }
{ a: { '0': '1' } }
{ a: { '0': '1', '1': 'pomme' } }
{ a: { '0': 'one', '1': 'five' } }
{ foo: 'bar', number: '1234' }
{
  a: { fruits: { red: { '0': 'strawberry' } } }
}
{
  a: {
    '1': 'five',
    fruits: {
      red: { '0': 'strawberry', '1': 'cherry' },
      yellow: { '0': 'lemon', '688': 'banana' }
    }
  }
}

주의: locutus parse_str 함수(https://locutus.io/php/strings/parse_str/)를 기반으로 합니다.

먼저 GET VAR에 대해 정의해야 합니다.

function getVar()
{
    this.length = 0;
    this.keys = [];
    this.push = function(key, value)
    {
        if(key=="") key = this.length++;
        this[key] = value;
        this.keys.push(key);
        return this[key];
    }
}

읽기만 하는 것이 아니라:

function urlElement()
{
    var thisPrototype = window.location;
    for(var prototypeI in thisPrototype) this[prototypeI] = thisPrototype[prototypeI];
    this.Variables = new getVar();
    if(!this.search) return this;
    var variables = this.search.replace(/\?/g,'').split('&');
    for(var varI=0; varI<variables.length; varI++)
    {
        var nameval = variables[varI].split('=');
        var name = nameval[0].replace(/\]/g,'').split('[');
        var pVariable = this.Variables;
        for(var nameI=0;nameI<name.length;nameI++)
        {
            if(name.length-1==nameI) pVariable.push(name[nameI],nameval[1]);
            else var pVariable = (typeof pVariable[name[nameI]] != 'object')? pVariable.push(name[nameI],new getVar()) : pVariable[name[nameI]];
        }
    }
}

다음과 같이 사용합니다.

var mlocation = new urlElement();
mlocation = mlocation.Variables;
for(var key=0;key<mlocation.keys.length;key++)
{
    console.log(key);
    console.log(mlocation[mlocation.keys[key]];
}

는 또한 해야 했다.+URL의 쿼리 부분(디코딩)에서URIComponent는 그렇지 않습니다.) 그래서 나는 Wolfgang의 코드를 다음과 같이 수정했습니다.

var search = location.search.substring(1);
search = search?JSON.parse('{"' + search.replace(/\+/g, ' ').replace(/&/g, '","').replace(/=/g,'":"') + '"}',
             function(key, value) { return key===""?value:decodeURIComponent(value)}):{};

제 경우, jQuery를 사용하여 URL 지원 양식 매개 변수를 가져오고, 이 매개 변수를 사용하여 개체를 빌드하면 개체의 매개 변수를 쉽게 업데이트하고 쿼리 URL을 재구성할 수 있습니다. 예:

var objForm = JSON.parse('{"' + $myForm.serialize().replace(/\+/g, ' ').replace(/&/g, '","').replace(/=/g,'":"') + '"}',
             function(key, value) { return key===""?value:decodeURIComponent(value)});
objForm.anyParam += stringToAddToTheParam;
var serializedForm = $.param(objForm);

언급URL : https://stackoverflow.com/questions/8648892/how-to-convert-url-parameters-to-a-javascript-object

반응형