Javascript에서 쿼리 매개 변수를 만드는 방법은 무엇입니까?

GET 요청 을 수행하기위한 쿼리 매개 변수 를 작성하는 방법이 있습니까?JavaScript에서 있습니까?

파이썬에서와 마찬가지로 urllib.urlencode(), 사전 (또는 두 개의 튜플 목록)을 가져 와서 같은 문자열을 만듭니다 'var1=value1&var2=value2'.

여기 있습니다 :

function encodeQueryData(data) {
   const ret = [];
   for (let d in data)
     ret.push(encodeURIComponent(d) + '=' + encodeURIComponent(data[d]));
   return ret.join('&');
}

용법:

const data = { 'first name': 'George', 'last name': 'Jetson', 'age': 110 };
const querystring = encodeQueryData(data);

URLSearchParams 는 브라우저 지원을 증가시키고 있습니다.

const data = {
  var1: 'value1',
  var2: 'value2'
};

const searchParams = new URLSearchParams(data);

// searchParams.toString() === 'var1=value1&var2=value2'

Node.js는 querystring 모듈을 제공합니다 .

const querystring = require('querystring');

const data = {
  var1: 'value1',
  var2: 'value2'
};

const searchParams = querystring.stringify(data);

// searchParams === 'var1=value1&var2=value2'

기능의

function encodeData(data) {
    return Object.keys(data).map(function(key) {
        return [key, data[key]].map(encodeURIComponent).join("=");
    }).join("&");
}   

Zabba 는 현재 받아 들여진 대답에 대한 의견으로 나에게 최고의 솔루션이라는 제안을 제공했습니다 : use jQuery.param () .

jQuery.param()원래 질문의 데이터를 사용 하면 코드는 다음과 같습니다.

const params = jQuery.param({
    var1: 'value',
    var2: 'value'
});

변수 params는

"var1=value&var2=value"

보다 복잡한 예제, 입력 및 출력은 jQuery.param () 설명서를 참조하십시오 .

우리는 방금 이 문제를 해결하는 것을 목표로하는 프로젝트 arg.js를 출시 했습니다 . 전통적으로 너무 어려웠지만 이제는 할 수 있습니다.

var querystring = Arg.url({name: "Mat", state: "CO"});

그리고 독서 작품 :

var name = Arg("name");

또는 전체를 얻는 것 :

var params = Arg.all();

당신은 차이점을 걱정하는 경우 ?query=true와 #hash=true다음은 사용할 수 있습니다 Arg.query()및 Arg.hash()방법을.

이것은 일을해야합니다 :

const createQueryParams = params => 
      Object.keys(params)
            .map(k => `${k}=${encodeURI(params[k])}`)
            .join('&');

예:

const params = { name : 'John', postcode: 'W1 2DL'}
const queryParams = createQueryParams(params)

결과:

name=John&postcode=W1%202DL

ES2017 (ES8)

를 사용 Object.entries()하면 객체 [key, value]쌍 의 배열이 반환 됩니다. 예를 {a: 1, b: 2}들어을 반환 [['a', 1], ['b', 2]]합니다. IE에서만 지원되지 않으며 지원되지 않습니다.

암호:

const buildURLQuery = obj =>
      Object.entries(obj)
            .map(pair => pair.map(encodeURIComponent).join('='))
            .join('&');

예:

buildURLQuery({name: 'John', gender: 'male'});

결과:

"name=John&gender=male"

당신이 사용하는 경우 프로토 타입 이 Form.serialize은

당신이 사용하는 경우 jQuery를 이 아약스 / 직렬화

나는 이것을 달성하기위한 독립적 인 기능을 모른다.하지만 구글 라이브러리 검색은 현재 라이브러리를 사용하지 않는다면 유망한 옵션을 찾았다. 하지만 그렇지 않다면, 그들은 하늘이기 때문에 정말로해야합니다.

이 10 살짜리 질문을 다시 방문하고 싶습니다. 이 기성 프로그래밍 시대에 가장 좋은 방법은 종속성 관리자 ( npm)를 사용하여 프로젝트를 설정하는 것 입니다. 쿼리 문자열을 인코딩하고 모든 주요 사례를 처리하는 라이브러리의 전체 코티지 산업이 있습니다. 이것은 가장 인기있는 것 중 하나입니다.

https://www.npmjs.com/package/query-string

타이프 스크립트에 약간의 수정 :

  public encodeData(data: any): string {
    return Object.keys(data).map((key) => {
      return [key, data[key]].map(encodeURIComponent).join("=");
    }).join("&");
  }

이 스레드 는 PHP에서 URL을 이스케이프 처리하기위한 일부 코드를 가리 킵니다. 있다 escape()및 unescape()대부분의 작업을 할 것이다, 그러나 당신은 몇 가지 여분의 물건을 추가 할 필요가있다.

function urlencode(str) {
str = escape(str);
str = str.replace('+', '%2B');
str = str.replace('%20', '+');
str = str.replace('*', '%2A');
str = str.replace('/', '%2F');
str = str.replace('@', '%40');
return str;
}

function urldecode(str) {
str = str.replace('+', ' ');
str = unescape(str);
return str;
}