javascript - html - 将 json 附加到链接的正确方法

Question

嗨，我有一个使用 Facebook 登录的代码:

<iframe allowtransparency="true" frameborder="no" height="600" scrolling="auto" src="http://www.facebook.com/plugins/registration.php?
client_id=183620578322567&
redirect_uri=http://example.com/store_user_data.php?&
fields=[
{"name":"name"},
{"name":"email"},
{"name":"password"},
{"name":"gender"},
{"name":"birthday"},
{"name":"captcha"}
]"
scrolling="auto"
frameborder="no" 
style="border: none;" 
width="500"
height="600">
</iframe>

正如您所看到的，src 属性中的 json 部分(字段)有问题，可能缺少引号，但我无法附加它，那么正确的方法是什么？谢谢

Answer 1

有些会或不会涉及您的问题:

• 不要使用 escape()，它自 ECMAScript v3 起已被弃用。

• 使用 encodeURI() 代替。您还可以反过来使用 decodeURI()。

• 不要使用 encodeURIComponent() 转义所有 url 字符串，因为它会破坏您的 URL，使用它就在您想要发送 url 作为参数时。

• 不要使用 ' 作为 json 中的属性，而是使用 "，因为提到的函数不会对 ' 字符进行编码。

例如，您可以将 json 添加到 url，然后调用 encodeURI:

var url = 'http://myhost.com/?{"key", "value"}';
var myEncodedurl = encodeURI(url);
//result-->http://myhost.com/?%7B%22key%22,%20%22value%22%7D

但是

encodeURIComponent(url);
//result-->http%3A%2F%2Fmyhost.com%2F%3F%7B%22key%22%2C%20%22value%22%7D

如果您想将所有 url 作为参数发送，那么使用 encodeURIComponent 会对您有所帮助，如下所示:

var myEncodedurl = 'http://myotherhost.com/?myurl=' +
                    encodeURIComponent('http://myhost.com/?{"key", "value"}');
//result-->http://myotherhost.com/?myurl=http%3A%2F%2Fmyhost.com%2F%3F%7B%22key%22%2C%20%22value%22%7D

顺便说一句，对于您的示例，您最好尝试:

var url = 'http://www.facebook.com/plugins/registration.php?client_id=183620578322567&redirect_uri=' +
encodeURIComponent('http://example.com/store_user_data.php?&'
+ 'fields=['
+ '{"name":"name"},'
+ '{"name":"email"},'
+ '{"name":"password"},'
+ '{"name":"gender"},'
+ '{"name":"birthday"},'
+ '{"name":"captcha"}'
+ ']&"'
+ 'scrolling="auto"'//extract it from encodeURIComponent if they belong to your original url
+ 'frameborder="no"'//extract it from encodeURIComponent if they belong to your original url
+ 'style="border: none;"'//extract it from encodeURIComponent if they belong to your original url
+ 'width="500"'//extract it from encodeURIComponent if they belong to your original url
+ 'height="600"'/*extract it from encodeURIComponent if they belong to your original url*/);