<a href…>로 앰퍼샌드를 인코딩합니까?


157

HTML을 자동으로 생성하는 코드를 작성 중이며 올바르게 인코딩하고 싶습니다.

다음 URL에 대한 링크를 생성한다고 가정 해보십시오.

http://www.google.com/search?rls=en&q=stack+overflow

모든 속성 값을 HTML로 인코딩해야한다고 가정합니다. (잘못된 경우 수정하십시오.) 따라서 위의 URL을 앵커 태그에 넣으면 앰퍼샌드를 다음 &amp;과 같이 인코딩해야 합니다.

<a href="http://www.google.com/search?rls=en&amp;q=stack+overflow">

그 맞습니까?



6
@CiroSantilli : 실제 URL 문자열에 관한 것입니다. HTML 속성에 나타날 때 어떻게 인코딩되는지에 관한 것입니다.
— JW.

내가 알다시피, 앰퍼샌드 인코딩은 html5에서 항상 필요한 것은 아니며 답변이 오래되었습니다.
— qdinar

1

답변:


175

그렇습니다. HTML 엔터티는 HTML 속성 내에서 파싱되고 길을 잃습니다.& 을 잃으면 모호성이 생깁니다. 당신은 항상 작성해야하는 이유의 &amp;대신으로 &내부의 모든 HTML 특성을가집니다.

그건 단지 & 따옴표가 필요로 인코딩 할 수 있습니다. é속성 과 같은 특수 문자가 있으면 HTML 파서를 만족시키기 위해 해당 문자 를 인코딩 할 필요가 없습니다.

예를 들어 URL과 같이 ASCII가 아닌 문자로 특수 처리해야하는 경우가 é있었습니다. 퍼센트 이스케이프를 사용하여 인코딩해야했으며,이 경우 RFC 1738에%C3%A9 의해 정의 되었으므로 줄 것 입니다. 그러나 RFC 1738은 RFC 3986 (URI, Uniform Resource Identifiers) 및 RFC 3987 (IRI, Internationalized Resource Identifiers) 로 대체되었으며 WhatWG는 브라우저가 ASCII가 아닌 URL을 볼 때 브라우저의 작동 방식을 정의하는 작업을 기반으로했습니다. HTML5 이후의 문자 . 따라서 퍼센트 인코딩 여부에 관계없이 URL에 비 ASCII 문자를 포함시키는 것이 안전합니다.


1
나는 이것을 확신했지만 의심의 여지가 거의 없었다. 확인해 주셔서 감사합니다.
— JW.

1
또한 공백을 % 20 대신 "+"로 인코딩하면 URL을보다 쉽게 ​​읽을 수 있습니다.
— NickG

1
+는 현재 고유 한 iPhone 메일 클라이언트의 mailto 링크에서 가치가없는 것으로 간주되지 않습니다.
— Ryan Olson

1
é여전히 인코딩이 필요합니다 : stackoverflow.com/questions/2742852/unicode-characters-in-urls
— lulalala

4
템플릿 엔진 에 의존하는 경우 HTML 엔터티를 이스케이프 처리하는 것이 자동으로 처리되는지 여부를 확인해야한다고 덧붙입니다. 필자의 경우 Twig 는 그렇게하고 있었고 &amp;직접 사용하는 대신 태그 속성에 쓰는 것을 잘못 두 번 이스케이프 처리하고있었습니다 &.
— 카마 페더

24

현재 공식 HTML 권장 사항에 따라 앰퍼샌드는 &amp;이 문맥에서와 같이 이스케이프되어야합니다 . 그러나 브라우저는이를 요구하지 않으며 HTML5 CR은이를 규칙 으로 만들 것을 제안 하므로 속성 값에 특수 규칙이 적용됩니다. 현재 HTML5 유효성 검사기는이 점에서 구식입니다 ( 댓글이있는 버그 보고서 참조 ).

속성 값에서 앰퍼샌드를 이스케이프하는 것은 가능하지만 현재 도구를 사용한 유효성 검증과는 별도로 값에서 이스케이프 할 필요가 없습니다 href(이스케이프를 시작하면 실수 할 위험이 적습니다).


4
XHTML (로 전송 된 실제 XHTML application/xhtml+xml)은 항상 필요할 것입니다.
— zneak

4
여전히 논의되고 토론되고 오해되고있는이 변화에 대한 한 가지 경고 &는 " 모호 하지 않은 " 것이면 지금은 괜찮을 것입니다 . 앰퍼샌드를 모호하게 만드는 한 가지 확실한 방법은 공백이 아닌 문자와 세미콜론을 먼저 사용하는 것입니다. 그 앰퍼샌드 지금은 모호하고, 것입니다 구문 분석 오류가 발생합니다.
— matty

Jukka가 말했듯이 모든 앰퍼샌드를 인코딩하는 데 위험이 있으므로 href URL 중 하나에 세미콜론이 포함될 가능성을 고려하십시오. 세미콜론으로 URL을 본 적이 있는지 확실하지 않으므로 가능성이 적습니다. 그것은 할 수 없습니다. 실제로, 우리의 사용 &이 모호 할 것이라고 생각하지 않습니다 . 따라서 href 속성에서 인코딩되지 않은 상태로 계속 사용합니다.
— matty

탈출이 필요한 모든 이유는 정확하게 모호 할 가능성이 있기 때문이다 . 이 특정 문제로 인해 XSS 공격 경로, 잘못된 렌더링 또는 99.99 %의 영향이 발생하지는 않았지만 이것이 귀찮은 이유는 아닙니다. 올바르게 탈출하는 것은 어렵고 항상 실수를 할 가능성이 있습니다.
— Phil

5

zneak의 답변에 충분한 예제가 없으며 HTML 및 URI 처리가 다른 측면 및 표준으로 표시되지 않고 사소한 것들이 없기 때문에 새로운 답변을 게시하고 있습니다.

링크의 URL에 관한 두 가지 표준이 있습니다 (<a href ).

첫 번째 표준은 RFC 1866 (HTML 2.0)입니다. 여기서 "3.2.1. 데이터 문자"에서 HTML 속성 값으로 사용될 때 이스케이프해야하는 문자를 읽을 수 있습니다. (특성 자체는 특수 문자를 전혀 허용하지 않습니다. 예를 들어 <a hr&ef="http://..., 허용되지 않거나 아닙니다 <a hr&amp;ef="http://....)

나중에 이것은 HTML 4 표준에 적용 되었으며, 이스케이프해야하는 문자는 다음과 같습니다.

<   to   &lt;
>   to   &gt;
&   to   &amp;
"   to   &quote;
'   to   &apos;

다른 표준은 URL이 처리되는 RFC 3986 "일반 URI 표준"입니다 (이것은 사용자가 HTML 요소를 클릭하여 브라우저가 링크를 따라 가려고 할 때 발생합니다).

reserved    = gen-delims / sub-delims

gen-delims  = ":" / "/" / "?" / "#" / "[" / "]" / "@"

sub-delims  = "!" / "$" / "&" / "'" / "(" / ")" / "*" / "+" / "," / ";" / "="

클라이언트가 데이터 또는 구분 기호를 나타내는 지 알 수 있도록 해당 문자를 이스케이프하는 것이 중요합니다.

이스케이프 처리되지 않은 예 :

https://example.com/?user=test&password&te&st&goto=https://google.com

예, 완전한 합법적 URL

https://example.com/?user=test&password&te%26st&goto=https%3A%2F%2Fgoogle.com

HTML 속성 값의 완전한 합법적 URL 예 :

https://example.com/?user=test&amp;password&amp;te%26st&amp;goto=https%3A%2F%2Fgoogle.com

또한 중요한 시나리오 :

  • 값으로 자바 스크립트 :

    <img src="..." onclick="window.location.href = &quot;https://example.com/?user=test&amp;password&amp;te%26st&amp;goto=https%3A%2F%2Fgoogle.com&quot;;">...</a>(예, ;;맞습니다)

  • 값으로 JSON :

    <a href="..." data-analytics="{&quot;event&quot;: &quot;click&quot;}">...</a>

  • 이스케이프 된 것들 내부의 이스케이프 된 것들, 이중 인코딩, 매개 변수 내의 URL 내의 URL 등 ...

    http://x.com/?passwordUrl=http%3A%2F%2Fy.com%2F%3Fuser%3Dtest&amp;password=&quot;&quot;123


3

예,로 변환해야 &합니다 &amp;.

W3C의이 html 유효성 검사기 도구 는 이와 같은 질문에 도움이됩니다. 특정 페이지에 대한 오류 및 경고가 표시됩니다.


1
W3C 유효성 검사기 가이 ( &href에서 이스케이프 처리되지 않음)를 오류로 감지하는지 확실하지 않습니다 .
— ChrisW

6
현재 W3C 유효성 검사기는 이스케이프 처리되지 않은 & 유효한 것으로 허용합니다. 표준이 변경되었고 더 이상 인코딩이 필요하지 않다는 의미입니까? (대부분의 답변을 구식으로 만듭니다)? 그렇다면 href 또는 모든 속성에만 적용됩니까?
— matteo
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.