编码 URL 中的加号 (+)答案

【问题标题】：plus sign (+) in encoded URL编码 URL 中的加号 (+)
【发布时间】：2015-10-18 15:51:54
【问题描述】：

在 Web 应用程序中，我将 XML 文件的内容作为 URL 参数的一部分发送（可能不是最好的设计，但现在我坚持使用它）。所以地址是这样的：

http://localhost:5000/fill?xml=XXXXXXXXXXXXX

使用 Flask 中的url_for('url', xml=xml) 生成。

我在客户端这样做：

  var img = document.getElementById('preview');
  var xmlstr = decodeURIComponent(GetURLParameter("xml"));
  var xml = $.parseXML(xmlstr);

XML 文件的内容自然会被编码。但是文件中的所有空格都转换为加号+。而当我使用$.parseXML() 函数对其进行解码时，+ 仍然存在。

为什么？

【问题讨论】：

【解决方案1】：

我会先为 url 编码 XML：

http://localhost:5000/fill?xml=encodeURIComponent(XXXXXXXXXXXXX)

在解析xml之前解码它：

decodeURIComponent()

【讨论】：

Flask 已经对 URL 参数进行了编码（并且在 Python 而不是 JavaScript 中这样做），这就是为什么 OP 首先看到那些 + 字符。 decodeURIComponent() 不处理查询参数和路径组件之间的差异。

【解决方案2】：

是的，当您将数据放入查询字符串时，它是 URL 编码的；将空格转换为+ 是正常的；查询参数使用application/x-www-form-urlencoded form 编码。

decodeURIComponent() 没有处理这一差异；只需先使用.replace() 将+ 字符替换为空格即可：

var xmlstr = decodeURIComponent(GetURLParameter("xml").replace(/\+/g, " "));

【讨论】：

【解决方案3】：

在 2020 年，我建议使用 URLSearchParams 的本机实现来处理这个遗留编码问题。目前基本上所有浏览器都支持它（除了 IE，像往常一样），以及自 v10 以来的 NodeJS (see here)。

简单地做：

let myUrl = new URL("http://my.url.here?with=query&xml=...");
let xmlStr = (new URLSearchParams(myUrl.search)).get("xml");

所有的编码和解码都为您处理。

【讨论】：

【解决方案4】：

对任何想要在 URL 中编码大量数据的人的警告：大多数代理、网络服务器和某些浏览器对 URL 有长度限制，并且通常在超出该限制时它们会截断 URL。现实的限制是 2000 个字符，这应该适用于所有内容。

【讨论】：