쿼리 문자열에 한 시간씩 졌습니다. 타사 웹훅이 전송 중이었습니다 filter[status]=open&filter[assignee]=me, 내 핸들러가 읽고 있었어요 filter 플랫 문자열로서,그리고 나는 왜 모든 요청이 필터링되지 않은 것을 통해 왔는지 알아낼 수 없었다. raw URL 을 쿼리 문자열 파서에 붙여 넣은 순간 중첩 된 객체로 해결되는 것을 본 순간 버그는 명백했다: 보낸 사람은 대괄호 표기법을 사용했고 내 파서는 사용하지 않았다. 이 가이드는 내가 사용하는 방법을 다룹니다 쿼리 문자열 파서 Toolz.dev에서 쿼리 문자열의 까다로운 부분은 실제로 무엇이며, 동일한 키가 두 가지 다른 방식으로 인코딩되어 조용히 통합을 깨뜨릴 수 있는 이유는 무엇입니까.
TL;DR: 쿼리 문자열은 매개변수를 키-값 쌍으로 전달하는 물음표 뒤의 URL 부분입니다. 쿼리 문자열 파서는 이를 구조화된 JSON 으로 변환하여 퍼센트 인코딩을 디코딩하고 반복되는 키와 대괄호 배열을 처리하며 JSON 에서 올바르게 인코딩된 쿼리 문자열을 다시 빌드할 수 있습니다. The 쿼리 문자열 파서 브라우저에서 양방향을 수행하므로 페이지를 떠나지 않고도 지저분한 URL을 검사하거나 깨끗한 URL을 조립할 수 있습니다.
쿼리 문자열이란 무엇입니까?
쿼리 문자열은 첫 번째 물음표 다음에 시작하여 해시 뒤의 부분인 조각에서 끝나는 URL 섹션입니다. 매개변수를 다음과 같이 전달합니다 key=value 앰퍼샌드로 결합된 쌍입니다 ?q=json&page=2 두 개의 매개 변수를 전달합니다. 서버와 클라이언트 코드는 검색을 필터링하거나,캠페인을 추적하거나,목록을 페이지로 연결하거나,페이지 간에 상태를 전달하기 위해 해당 매개 변수를 읽습니다. 해당 구성 요소에서 합법적인 것과 그렇지 않은 것에 대한 일반 규칙은 다음에서 나옵니다 RFC 3986URI 표준과 브라우저가 양식 스타일 매개변수에 대해 따르는 특정 규칙은 다음에서 나옵니다 WHATWG URL 표준.
캐치는 RFC 3986 이 쿼리 구성 요소의 구문을 정의하지만 그 의미는 정의하지 않는다는 것입니다. 어떤 문자가 허용되고 어떻게 퍼센트 인코딩되어야 하는지를 말하지만 방법에 대해서는 아무 것도 말하지 않습니다 key=value 쌍은 데이터 구조에 매핑됩니다. 그 해석은 HTML 양식 제출에서 상속되었으며 다른 플랫폼은 호환되지 않는 방식으로 확장했습니다. 이것이 동일한 쿼리 문자열이 PHP 백엔드, Rails 컨트롤러 및 JavaScript 프런트 엔드에 약간 다른 의미를 가질 수 있는 이유이며 파서가 규칙을 명시적으로 만들어야 하는 이유입니다.
쿼리 문자열의 모든 키와 값은 URL 인코딩되어 예약된 문자가 살아남습니다. 공백이 됩니다 %20 또는 더하기 기호, 값 내부의 앰퍼샌드가 됩니다 %26 따라서 구분 기호로 오해되지 않으며 슬래시가 됩니다 %2F. 파싱은 쌍을 분할한 다음 각 변을 디코딩하는 것을 의미하고,빌딩은 각 변을 인코딩하고 쌍을 결합하는 것을 의미합니다. 어느 방향에서든 인코딩을 잘못 가져오고 값이 자동으로 손상됩니다.
쿼리 문자열 파서는 실제로 무엇을 합니까?
파서는 URL 또는 베어 쿼리 문자열을 가져와 구조화되고 읽을 수있는 데이터로 바꿉니다. 도중에 물음표까지의 모든 것을 제거하고 해시 이후의 조각을 무시하고 쌍을 분할하고 각 키와 값을 디코딩하고 반복 키와 대괄호로 묶인 키를 나타내는 방법을 결정합니다. 출력은 읽고 복사 할 수있는 JSON 개체이며,복제 된 모든 쌍의 플랫 테이블이 더해져 중복되고 빈 값이 분명합니다.
Toolz.dev 에서 도구는 두 방향으로 실행됩니다. 구문 분석 모드에서는 전체 URL 또는 해당 쿼리 문자열만 붙여넣고 JSON 및 매개변수 테이블을 가져옵니다. 빌드 모드에서는 JSON 개체를 붙여넣고 배열 표현 방법을 선택하여 올바르게 인코딩된 쿼리 문자열을 얻습니다. 샘플을 로드하면 조각이 포함된 실제 URL,반복 스타일 배열 및 인코딩된 공간이 정리된 JSON 으로 해결된 다음 다시 빌드할 수 있습니다.
URL 을 eyeball 하는 대신 전용 파서를 사용하는 이유는 쿼리 문자열이 구조를 숨기기 때문입니다. 인코딩된 문자,반복된 키,괄호 표기법이 있는 긴 URL 은 스캔하여 올바르게 읽는 것이 거의 불가능하며,가장 읽기 어려운 부분인 인코딩과 중복은 정확히 버그를 유발하는 부분입니다. JSON 옆에 디코딩된 테이블을 보면 추측이 제거됩니다.
반복되는 키는 어떻게 처리되나요?
동일한 키가 쿼리 문자열에 합법적으로 두 번 이상 나타날 수 있습니다 tags=react&tags=laravel그리고 그것을 해석하는 올바른 방법은 하나도 없습니다. 이것이 많은 혼란의 근원입니다. 시스템마다 중복을 다르게 해결하므로 파서는 선택하도록 해야 합니다.
가장 일반적인 규칙이자 Toolz.dev 도구의 기본값은 반복되는 키를 배열로 수집하는 것입니다 tags=react&tags=laravel 된다 {"tags":["react","laravel"]}. 이것은 browser's 가 소유하는 방법을 일치한다 URLSearchParams.getAll 값과 대부분의 최신 백엔드가 어떻게 동작하는지 노출합니다. 하지만 일부 프레임워크는 첫 번째 발생만 유지하고 일부는 마지막 발생만 유지하므로 도구는 keep-first 및 keep-last 옵션도 제공합니다. 통합을 디버깅할 때 URL 을 생성하거나 소비하는 시스템에 parser's 동작을 일치시키는 것이 JSON 을 의미 있게 만드는 것입니다.
이러한 모호함은 학문적이지 않습니다. HTTP 파라미터 오염이라는 고전적인 보안 및 정확성 문제는 요청 경로의 두 시스템이 해결할 수 있기 때문에 정확하게 존재합니다 id=1&id=2 다르게, 보는 사람 1 그리고 다른 하나는 보고 있습니다 2. 주어진 파서가 중복을 해결하는 방법을 명시적으로 볼 수 있는 것이 해당 버그 클래스에 대해 추론하는 가장 빠른 방법입니다.
태그[] 또는 필터[색상]와 같은 괄호는 무엇을 의미합니까?
브라켓 표기법은 플랫 쿼리 문자열 안에 배열과 중첩된 객체를 인코딩하기 위한 규칙으로,파서가 가장 동의하지 않는 부분입니다. 뒤에 오는 빈 브라켓은 배열을 표시합니다. 그래서 tags[]=react&tags[]=laravel 빌드 {"tags":["react","laravel"]}. 명명된 대괄호는 중첩된 개체를 표시합니다 filter[color]=red&filter[size]=l 빌드 {"filter":{"color":"red","size":"l"}}. 부류는 둥지를 틀 수 있습니다 a[b][c]=1 빌드 {"a":{"b":{"c":"1"}}}.
이 구문은 PHP와 Ruby on Rails가 양식 데이터를 직렬화하는 방식과 다음과 같은 많은 JavaScript 라이브러리에서 비롯됩니다 qs 그것을 따르십시오. 그것은 핵심 URL 표준의 일부가 아니며,정확히 이것이 평야가되는 이유입니다 URLSearchParams 브라우저에서는 이를 확장하지 않으므로 문자 그대로의 키를 제공합니다 tags[] 배열 대신.Toolz.dev 파서는 규칙을 이해하고 이를 일치하는 구조로 확장하며, 대신 리터럴 키를 원할 때 해당 동작을 끌 수 있습니다.
구문 분석 및 구축 시 주요 규칙이 정렬되는 방식은 다음과 같습니다:
| 배열 작풍 | 로 인코딩 | 파르세스에게 | 에서 공통 |
|---|---|---|---|
| 반복된 키 | tags=a&tags=b |
["a","b"] |
브라우저, 대부분의 백엔드 |
| 빈 부류 | tags[]=a&tags[]=b |
["a","b"] |
PHP, 레일, qs 라이브러리 |
| 색인된 브래킷 | tags[0]=a&tags[1]=b |
["a","b"] |
qs 라이브러리, 주문 데이터 |
| 쉼표로 연결된 | tags=a,b |
분할할 문자열 1개 | 일부 API, 컴팩트 URL |
도구로 쿼리 문자열을 빌드할 때,이 중 어느 것을 내보낼지 선택하므로 출력은 수신 시스템이 기대하는 것과 일치합니다. 구문 분석할 때 도구는 반복된 키와 대괄호 표기법을 감지하고 쉼표로 연결된 값은 쉼표가 구분 기호인지 데이터의 일부인지 알기 때문에 단일 문자열로 유지됩니다.
왜 더하기 기호가 공백으로 바뀌나요?
URL의 쿼리 문자열에서 리터럴 공간은 플러스 기호가 아닌 플러스 기호로 인코딩되는 경우가 많습니다 %20. 에서 계승한 규칙입니다 application/x-www-form-urlencoded HTML 양식이 사용하는 형식과 WHATWG URL 표준 코드화: 양식으로 인코딩된 데이터를 구문 분석할 때 a + 는 공백으로 디코딩된다. 그래서 q=json+parser 로 구문 분석해야 합니다 json parser그리고 Toolz.dev 도구는 기본적으로 이 작업을 수행합니다.
미묘함은 이 규칙이 경로가 아닌 쿼리 구성 요소에 적용된다는 것입니다. A + 경로 세그먼트에는 문자 그대로의 플러스가 있습니다. 때로는 데이터에 전화번호나 검색과 같이 보존해야 하는 플러스 기호가 실제로 포함되는 경우도 있습니다 C++. 그런 경우 도구는 plus-as-space 를 끄는 스위치가 있으므로 plus 는 왕복 여행에서 살아남습니다. 이것은 범용의 일종의 세부 사항입니다 URL 인코더 쿼리를 보고 있는지 경로를 보고 있는지 알 수 없기 때문에 결정하지 않습니다.
이 올바른 것을 얻는 것은 빌드할 때도 중요합니다. 도구가 값을 인코딩할 때 예약된 문자를 퍼센트 인코딩하고 기본적으로 폼 인코딩 스타일의 공백에 플러스를 사용하므로 도구가 생성하는 문자열은 브라우저와 백엔드가 의도한 대로 디코딩하는 문자열입니다.
이것이 전체 URL 파서와 어떻게 다른가요?
쿼리 문자열 파서와 전체 URL 파서는 겹치지만 다른 질문에 답하며,오른쪽을 사용하면 단계를 저장합니다. URL 파서는 구성 요소,스킴, 호스트,포트, 경로,쿼리 및 조각으로 전체 링크를 끊고 요청이 어디로 가는지 또는 리디렉션이나 CORS 검사가 이상하게 동작하는 이유를 디버깅할 때 원하는 것입니다. 쿼리 문자열 파서는 쿼리에만 초점을 맞추고 배열 및 중첩 키를 포함하여 구조화되고 편집 가능한 JSON 으로 전환하며 쿼리를 다시 빌드할 수 있습니다.
X-1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 1000 X 10 URL 파서 on Toolz.dev is the tool for anatomy: give it a link and it shows you the host version origin distinction,the default port,and the pieces of the path. 쿼리 문자열 파서는 파라미터로 작업하기 위한 도구이다: give it the same link and it gives you the parameters as JSON you can edit,그리고 당신의 편집으로부터 쿼리 문자열을 다시 만든다. 실제로 나는 그것들을 함께 사용하는데,링크를 이해하기 위한 URL 파서와 그것의 파라미터를 바꾸기 위한 쿼리 문자열 파서,그리고 만약 내가 캠페인 링크를 조립하고 있다면 나는 에 도달한다 UTM 빌더 대신 분석 태그에 특화된 쿼리 문자열 작성기입니다.
나는 실제로 언제 이것에 도달합니까?
정직한 대답은 URL 이 페이지를 가리키는 것 이상의 일을 할 때마다입니다. 나는 그것을 사용하여 웹 후크와 OAuth 리디렉션을 디버깅합니다. 여기서 매개 변수는 전체 페이로드를 전달하고 잘못 인코딩 된 하나의 값은 흐름을 깨뜨립니다. 나는 마케팅 링크에서 추적 매개 변수를 읽어서 캠페인이 통과하는 것을 정확히 볼 수 있습니다. 나는 그것을 사용하여 채팅에 붙여 넣은 동료가 JSON 으로 쿼리 문자열을 테스트 픽스처에 떨어 뜨릴 수 있고,반대로 수행하여 빠른 수동 요청을 위해 작은 개체를 쿼리 문자열로 바꿉니다.
작업된 예제는 보상을 구체화합니다. OAuth 공급자는 다음과 같은 것을 사용하여 앱으로 다시 리디렉션합니다 ?code=abc123&state=xyz789&scope=read%20write&error=. 파서에 붙여넣으면 깨끗한 개체로 해결됩니다: code 그리고 state 그들의 문자 그대로의 가치로서, scope 에 해독 read write 왜냐하면 %20 는 공간이며, 그리고 error 공급자가 매개변수를 보냈지만 비워두었다는 것을 알려주는 누락된 키가 아닌 빈 문자열입니다. raw URL에서 눈으로 읽으면 인코딩된 공간을 놓칠 가능성이 높습니다 scope 그리고 빈 것을 잘못 읽었습니다 error그리고 그 두 가지는 정확히 콜백 핸들러가 올바르게 분기되는지 여부를 결정하는 세부 사항입니다. 디코딩된 테이블을 보면 모호성이 제거되고, 요청을 재현해야 하는 경우 빌드 모드는 편집된 개체를 한 단계에서 유효한 콜백 URL로 다시 전환합니다.
그 작업의 너무 많은 부분이 토큰,서명된 값 및 추적 식별자를 전달하는 URL 을 포함하기 때문에 브라우저에서 완전히 실행되는 도구에서 수행하는 것이 중요합니다. 붙여 넣기하는 것은 전송,로그 또는 저장되지 않으며 도구는 네트워크와 계속 작동하므로 삭제 된 복사본이 아닌 프로덕션에서 서명 된 콜백 URL 을 안전하게 검사 할 수 있습니다. 나는 이런 종류의 작업을 클라이언트 측에 유지하기위한 더 넓은 사례를 만듭니다 온라인 도구의 데이터 개인 정보 보호 가이드, 이 파서는 제가 설명한 다른 링크 및 텍스트 유틸리티와 나란히 있습니다 웹 개발자 툴킷. 만약 당신의 직업의 일부가 지저분한 입력을 깨끗한 slugs와 식별자로 바꾸는 것이라면,the Slug 생성기 URL 작업의 출력측에 대한 자연스러운 동반자입니다.
자주 묻는 질문
쿼리 문자열이란 무엇입니까?
쿼리 문자열은 ?q=json&page=2 와 같이 앰퍼샌드에 의해 결합된 키-값 쌍으로 매개변수를 전달하는 물음표 뒤의 URL 부분입니다. 서버와 클라이언트 코드는 결과를 필터링하거나 캠페인을 추적하거나 상태를 전달하기 위해 읽습니다. 각 키와 값은 공백과 예약된 문자가 살아남도록 URL 인코딩되며 해시 뒤의 조각은 해당 일부가 아닙니다.
구문 분석할 때 반복되는 키는 어떻게 처리됩니까?
기본적으로 두 번 이상 나타나는 키는 배열로 결합되므로 tags=react&tags=laravel 은 {"tags":["react","laravel"]}. 다른 백엔드가 중복을 다르게 해결하고 JSON 이 대상 시스템과 일치하도록 하기 때문에 첫 번째 값만 유지하거나 대신 마지막 값만 유지하도록 전환할 수 있습니다.
태그[] 또는 필터[색상]와 같은 괄호는 무엇을 의미합니까?
브라켓 표기법은 배열과 중첩된 객체를 플랫 쿼리 문자열 안에 인코딩합니다. tags[]=react&tags[]=laravel 은 배열을 빌드하고 filter[color]=red&filter[size]=l 은 중첩된 객체 {"filter":{"color":"red","size":"l"}}. PHP, Rails, form 라이브러리에서는 일반적이므로 파서는 이를 일치하는 구조로 확장하고, 리터럴 키를 유지하기 위해 이를 끌 수 있습니다.
왜 더하기 기호가 공백이 되는가?
URL 의 쿼리 문자열에서 리터럴 공백은 종종 HTML 양식 제출에서 상속된 규칙인 더하기 기호로 인코딩되므로 파서는 기본적으로 +를 다시 공백으로 변환합니다. 데이터에 C++ 또는 전화 번호와 같이 보관해야 하는 실제 더하기 기호가 포함되어 있으면 공백으로 더하기 옵션을 끄고 더하기 값을 보존합니다.
JSON 에서 쿼리 문자열을 빌드할 수 있습니까?
예. 빌드 모드로 전환하고 키-값 쌍의 JSON 개체를 붙여 넣습니다. 도구는 각 키와 값을 백분율로 인코딩하고 앰퍼샌드로 결합하며 배열 인코딩 방법을 선택할 수 있습니다: 반복되는 키,빈 대괄호,인덱싱된 대괄호 또는 쉼표로 구분된 목록이므로 출력은 수신 시스템이 기대하는 것과 일치합니다.
이것과 전체 URL 파서의 차이점은 무엇입니까?
전체 URL 파서는 전체 URL 을 구성표,호스트, 포트,경로, 쿼리 및 조각으로 나눕니다. 쿼리 문자열 파서는 쿼리에만 초점을 맞추고 배열 및 중첩 키를 포함한 구조화된 편집 가능한 JSON 으로 변환하며 쿼리를 다시 빌드할 수 있습니다. URL 파서를 사용하여 링크를 검사하고 이 도구를 사용하여 해당 매개 변수를 읽거나 변경합니다.
전체 URL을 처리합니까, 아니면 쿼리 부분만 처리합니까?
둘 다. 전체 URL 을 붙여 넣으면 파서가 물음표까지의 모든 것을 삭제하고 해시 뒤의 조각은 무시하므로 매개 변수 만 얻습니다. 물음표가없는 베어 쿼리 문자열을 붙여 넣으면 그대로 구문 분석되므로 매개 변수 만 복사했을 때 편리합니다.
내 URL은 아무데나 전송되나요?
아니요. 파싱,디코딩, 인코딩은 모두 브라우저에서 JavaScript 로 실행되므로 전송,로그 또는 저장되는 것이 없습니다. URL 을 파싱하는 동안 네트워크 탭을 보거나 인터넷에서 연결을 끊으면 확인할 수 있습니다. 페이지가 로드되면 도구가 오프라인으로 계속 작동하기 때문입니다.
무료를 사용하여 매개변수를 검사하거나 조립합니다 쿼리 문자열 파서. 그것은 JSON 로 URL 를 구문 분석하고,반복된 열쇠,괄호 배열 및 부호화를 취급하는,질문 끈을 뒤,완전히 당신의 브라우저에서,건설합니다.
