Sobre este problema HTML
Quando o parser HTML do navegador encontra um atributo src, espera que o valor entre as aspas de abertura e de fecho seja um URL válido. Os URLs têm regras rigorosas sobre quais caracteres são permitidos — uma aspa dupla literal (") não é um deles. Se um carácter " aparecer dentro do URL, o validador assinala-o como um carácter ilegal na string de query (ou outras partes do URL).
Este erro frequentemente não deriva de uma aspa intencionalmente incorporada no próprio URL. Em vez disso, é normalmente um sintoma de HTML malformado em volta do atributo. Causas comuns incluem:
-
Aspas dispersas após o valor do atributo, como escrever
src="https://example.com/script.js"async""em vez de separar adequadamente os atributos. -
Aspas de fecho acidentalmente duplicadas, como
src="https://example.com/script.js"". -
Atributos booleanos com valores de string vazia incorretamente, como
async""em vez de apenasasync, o que faz com que o parser interprete as aspas extra como parte do valorsrcprecedente. -
Erros de copiar-colar que introduzem aspas inteligentes (
"") ou aspas extra no URL.
Isto importa por várias razões. Atributos src malformados podem causar a falha completa do carregamento do script, quebrando a funcionalidade da sua página. Também viola a especificação HTML, o que pode levar a comportamento imprevisível em diferentes navegadores, pois cada parser tenta recuperar do erro de forma diferente.
Para corrigir o problema, inspecione cuidadosamente a tag <script> e certifique-se de que:
-
O valor do atributo
srccontém apenas um URL válido sem caracteres"não escapados. - As aspas de abertura e de fecho em volta do valor do atributo estão adequadamente balanceadas.
- Os atributos são separados por espaços em branco — não colados uns aos outros.
-
Atributos booleanos como
asyncedefersão escritos como palavras-chave simples sem valores.
Se você genuinamente precisar de um carácter de aspa dupla numa string de query (o que é raro), codifique-o como %22.
Exemplos
Incorreto — aspas dispersas entre atributos
Neste exemplo, o atributo async está malformado como async"", o que faz com que o parser interprete as aspas extra como parte do URL src:
<script src="https://example.com/js/app.js?ver=3.1" async""></script>
Incorreto — aspa de fecho duplicada
Aqui, um " extra no final do valor src cria um carácter ilegal no URL:
<script src="https://example.com/js/app.js?ver=3.1""></script>
Incorreto — aspas inteligentes de copiar-colar
Aspas curvas/inteligentes copiadas de um processador de texto não são delimitadores de atributo HTML válidos e são tratadas como parte do URL:
<script src="https://example.com/js/app.js?ver=3.1"></script>
Correto — atributos limpos com aspas adequadas
<script src="https://example.com/js/app.js?ver=3.1" async></script>
Correto — atributo booleano escrito como palavra-chave simples
Atributos booleanos como async e defer não precisam de um valor. Simplesmente inclua o nome do atributo:
<script src="https://example.com/js/app.js?ver=3.1" defer></script>
Embora async="async" seja tecnicamente válido pela especificação, a forma mais limpa e comum é o atributo simples. Evite padrões de string vazia como async="" colocados sem espaçamento adequado, pois podem levar exatamente aos erros de aspas descritos aqui.
Correto — documento válido completo
<!DOCTYPE html>
<html lang="en">
<head>
<title>Valid Script Example</title>
<script src="https://example.com/js/app.js?ver=3.1" async></script>
</head>
<body>
<p>Page content here.</p>
</body>
</html>
Se você estiver a gerar tags <script> dinamicamente (através de um CMS, motor de templates, ou ferramenta de build), verifique o código-fonte do template em vez de apenas a saída renderizada. As aspas dispersas são frequentemente introduzidas por concatenação de strings incorreta ou lógica de escape no código do lado do servidor.
Encontre problemas como este automaticamente
O Rocket Validator analisa milhares de páginas em segundos, detetando problemas HTML em todo o seu site.