如何转义 JSON 字符串以将其包含在 URL 中?

IT技术 javascript jquery json url escaping
2021-02-20 23:04:40

使用 Javascript,我想生成一个页面链接。页面的参数位于我在 JSON 中序列化的 Javascript 数组中。

所以我想生成一个这样的 URL:

http://example.com/?data="MY_JSON_ARRAY_HERE"

我如何需要转义我的 JSON 字符串(数组序列化)以将其作为参数包含在 URL 中?

如果有使用 JQuery 的解决方案,我会喜欢的。

注意:是的,页面的参数需要在一个数组中,因为它们很多。我想我会在之后使用 bit.ly 来缩短链接。

6个回答
encodeURIComponent(JSON.stringify(object_to_be_serialised))
似乎它编码的字符多于必需的字符(当我在 Firefox 中粘贴链接时,某些字符被还原(即{[")。有没有办法只对必需的字符进行编码,以便我可以缩短我的网址?
2021-05-11 23:04:40

您可以使用encodeURIComponent来安全地对查询字符串的部分进行 URL 编码:

var array = JSON.stringify([ 'foo', 'bar' ]);
var url = 'http://example.com/?data=' + encodeURIComponent(array);

或者,如果您将此作为 AJAX 请求发送:

var array = JSON.stringify([ 'foo', 'bar' ]);
$.ajax({
    url: 'http://example.com/',
    type: 'GET',
    data: { data: array },
    success: function(result) {
        // process the results
    }
});

我想做同样的事情。对我来说问题是我的网址太长了。我今天使用Bruno Jouhier 的 jsUrl.js 库找到了一个解决方案

我还没有非常彻底地测试它。但是,以下示例显示了使用 3 种不同方法对同一大对象进行编码后字符串输出的字符长度:

  • 2651 个字符使用 jQuery.param
  • 1691 个字符使用 JSON.stringify + encodeURIComponent
  • 821个字符使用 JSURL.stringify

显然 JSURL 具有最优化的 urlEncoding js 对象格式。

https://groups.google.com/forum/?fromgroups=#!topic/nodejs/ivdZuGCF86Q 上的线程 显示了编码和解析的基准。

注意:经过测试,jsurl.js 库似乎使用了 ECMAScript 5 函数,例如 Object.keys、Array.map 和 Array.filter。因此,它只能在现代浏览器上工作(没有即 8 及以下)。但是,这些功能的 polyfill 是否可以使其与更多浏览器兼容。

从 0.1.4 开始,如果您仍然需要它们,它也与 IE 6-8 兼容。
2021-04-27 23:04:40

使用encodeURIComponent()

var url = 'index.php?data='+encodeURIComponent(JSON.stringify({"json":[{"j":"son"}]})),

我会提供一个奇怪的选择。有时使用不同的编码会更容易,尤其是当您处理各种系统时,这些系统并非都以相同的方式处理 URL 编码的细节。这不是最主流的方法,但在某些情况下可以派上用场。

您可以对数据进行 base64 编码,而不是对数据进行 URL 编码。这样做的好处是编码数据非常通用,仅由字母字符组成,有时还包含尾随的='s。例子:

JSON 字符串数组:

["option", "Fred's dog", "Bill & Trudy", "param=3"]

该数据,URL 编码为data参数:

"data=%5B%27option%27%2C+%22Fred%27s+dog%22%2C+%27Bill+%26+Trudy%27%2C+%27param%3D3%27%5D"

同样,base64 编码:

"data=WyJvcHRpb24iLCAiRnJlZCdzIGRvZyIsICJCaWxsICYgVHJ1ZHkiLCAicGFyYW09MyJd"

base64 方法可以更短一些,但更重要的是它更简单。我经常在 cURL、Web 浏览器和其他客户端之间移动 URL 编码的数据时遇到问题,通常是由于引号、嵌入的%标志等。Base64 非常中立,因为它不使用特殊字符。

终于在这里找到了我朋友(&)的地址(%26)
2021-04-25 23:04:40
这是真的,但您可以选择要在 base64 中使用的字符:替换/$_或任何其他不需要每个 RFC 3986 的 url 编码的字符。
2021-05-07 23:04:40
base64 字符串的问题在于它们可以包含斜杠 (/) 字符,这会使 url 无效...
2021-05-10 23:04:40