5

我正在构建一个单页 AJAX 应用程序，并且希望在某些情况下在 URL 哈希 (#) 之后将状态存储在 JSON 中。我已经看到其他几个网站这样做了，但我希望在我努力实现这一点时获得一些最佳实践、技巧或陷阱。

4

2 回答 2

8

我实际上建议不要将数据封装到 json 中，然后将其放入哈希中。原因是 JSON 本身需要大量标记，并且实际上会打开一些安全漏洞，因为您必须稍后评估直接来自用户的代码。

作为更好的选择，我建议使用 x-www-form-urlencoded 作为封装。例如，如果这是您的状态对象：

var stateObject = {
  userName: 'John Doe',
  age: 31
}

然后你会创建一个像这样的哈希片段：

// Create an array to build the output string.
var hashPartBuffer = [];
for (var k in stateObject) {
  hashPartBuffer.push(
    encodeURIComponent(k),
    '=',
    encodeURIComponent(stateObject[k]),
    '&'); 
}
if (hashPartBuffer.length) {
  // Remove the last element from the string buffer
  // which is '&'.
  hashPartBuffer.pop();
}
var hashPartString = hashPartBuffer.join('');
// This will now be 'userName=John%20Doe&age=31'

然后你将通过以下方式解析它：

var hashPartString = 'userName=John%20Doe&age=31';
var pairs = hashPartString.split(/&/);
var stateObject = {};
for (var i = 0; i < pairs.length; i++) {
  var keyValue = pairs.split(/=/);
  // Validate that this has the right structure.
  if (keyValue.length == 2) {
    stateObject[keyValue[0]] = keyValue[1];
  }
}
于 2011-03-18T20:29:15.293 回答
5

回来回答我自己的问题——我可以证明 JSON 字符串的 URL 编码（甚至只是部分）在我们的生产环境中工作得非常好。

前任。源 JSON：

{"mode":21,"popup":18,"windowId":2}

前任。在 URL 中编码：

http://example.com/my-ajax-app#%7B%22mode%22:21,%22popup%22:18,%22windowId%22:2%7D

对于像上面这样的少量 JSON，我们在任何浏览器上都没有问题（甚至可以追溯到 IE7）。我们没有测试过更大的 JSON 字符串。

于 2012-07-18T05:06:37.993 回答