如何编码URL参数？

我正在尝试将参数传递给看起来像这样的URL：

http://www.foobar.com/foo?imageurl=

我想传递参数，例如由另一个API自身生成的图像URL，图像的链接结果为：

http://www.image.com/?username=unknown&password=unknown

但是，当我尝试使用URL时：

http://www.foobar.com/foo?imageurl=http://www.image.com/?username=unknown&password=unknown

没用

我也尝试在imageURL上使用encodeURI()和encodeURIComponent()，这也行不通。

使用PHP

echo urlencode("http://www.image.com/?username=unknown&password=unknown");

结果

http%3A%2F%2Fwww.image.com%2F%3Fusername%3Dunknown%26password%3Dunknown

使用Javascript：

var myUrl = "http://www.image.com/?username=unknown&password=unknown";
var encodedURL= "http://www.foobar.com/foo?imageurl=" + encodeURIComponent(myUrl);

演示：http : //jsfiddle.net/Lpv53/

使用新的ES6 Object.entries()，它使一个有趣的小嵌套map/成为可能join：

const encodeGetParams = p => 
  Object.entries(p).map(kv => kv.map(encodeURIComponent).join("=")).join("&");

const params = {
  user: "María Rodríguez",
  awesome: true,
  awesomeness: 64,
  "ZOMG+&=*(": "*^%*GMOZ"
};

console.log("https://example.com/endpoint?" + encodeGetParams(params))

您不应该使用encodeURIComponent()或encodeURI()。您应该根据MDN文档使用fixedEncodeURIComponent()和fixedEncodeURI()。

关于encodeURI()...

如果有人希望遵循最新的URL RFC3986，这使得方括号保留（用于IPv6），因此在形成可能属于URL的内容（例如主机）时不进行方括号编码，以下代码段可能会有所帮助：

function fixedEncodeURI(str) { return encodeURI(str).replace(/%5B/g, '[').replace(/%5D/g, ']'); }

关于encodeURIComponent()...

为了更严格地遵守RFC 3986（保留！，'，（，）和*），即使这些字符没有正式的URI分隔用法，也可以安全地使用以下字符：

function fixedEncodeURIComponent(str) { return encodeURIComponent(str).replace(/[!'()*]/g, function(c) { return '%' + c.charCodeAt(0).toString(16); }); }

那么区别是什么呢？ fixedEncodeURI()并fixedEncodeURIComponent()转换相同的一组值，但fixedEncodeURIComponent()也会转换此组：+@?=:*#;,$&。此集用于GET参数（&，+等），锚标记（#），通配符标记（*），电子邮件/用户名部分（@）等。

例如-如果使用encodeURI()，user@example.com/?email=me@home则不会将第二个错误正确地发送@到服务器，但浏览器会处理兼容性（Chrome经常会这样做）。