转义 html 标签上的 url答案

【问题标题】：Escape url on a html tag转义 html 标签上的 url
【发布时间】：2010-01-28 22:30:50
【问题描述】：

我正在这样做：

<a href="http%3A%2F%2Flocalhost%3A8080%2Fnews.xhtml%3Fid%3D32%26lang%3Den" target="_blank" />

当它被渲染时，链接指向：http://localhost:8080/news.xhtml?id=32&lang=en

我需要这个链接指向编码的 url 而不是解码的。

有谁知道如何逃脱它？

更新（根据 cmets）：我需要它来实现 Share this on facebook 功能。方法是调用以下链接：http://facebook.com/sharer.php?u=<encoded url to share>

【问题讨论】：

以后请在问题中添加更多context，以便整个功能需求清晰，而不是问半个问题;)

标签： html jsf

【解决方案1】：

为什么需要这个？该链接将在技术上被破坏。

无论如何，您基本上只需要将百分比% 替换为它们的URL 编码表示%25（换句话说：只需对URL 进行两次编码）。

因此，在您的特定情况下，结果将是：

http%253A%252F%252Flocalhost%253A8080%252Fnews.xhtml%253Fid%253D32%2526lang%253Den

更新：当您在 JSF 上下文中提出这个问题时，以下是您通常在 JSF 中创建链接的方式（因此默认情况下已经进行了 URL 编码）：

<h:outputLink value="#{bean.url}" />

如果你想对它进行两次编码，你必须抓住 JSTL 的c:url：

<c:url value="#{bean.url}" var="url" />
<h:outputLink value="#{url}" />

更新 2：根据评论，实际需求现在已经完全清楚，正常的 JSF 方式将是（请注意，您不一定需要对其进行编码两次这里！）：

<h:outputLink value="http://facesbook.com/sharer.php">
    <f:param name="u" value="#{bean.url}" />
</h:outputLink>

【讨论】：

嗯...我需要它来实现在 facebook 上分享这个功能。方法是调用以下链接：facebook.com/sharer.php?u=<encoded url to share>

【解决方案2】：

我不确定你为什么要这样做，但你实际上是在双重转义真实的 URL：

var s0 = "http://localhost:8080/news.xhtml?id=32&lang=en";
var s1 = escape(s0);
var s2 = escape(s1);
var s3 = unescape(s2);
var s4 = unescape(s3);
// Assume function created for echo
echo("Original: " + s0);
echo("Escape1: " + s1);
echo("Escape2: " + s2);
echo("Unescape1: " + s3);
echo("Unescape2: " + s4);

这会产生以下输出：

Original: http://localhost:8080/news.xhtml?id=32&lang=en
Escape1: http%3A//localhost%3A8080/news.xhtml%3Fid%3D32%26lang%3Den
Escape2: http%253A//localhost%253A8080/news.xhtml%253Fid%253D32%2526lang%253Den
Unescape1: http%3A//localhost%3A8080/news.xhtml%3Fid%3D32%26lang%3Den
Unescape2: http://localhost:8080/news.xhtml?id=32&lang=en

注意：通常您只想转义 URL 的各个参数，而不是整个 URL 本身。

【讨论】：

我觉得自己很傻。逃逸是否预先内置在现代 ECMA/javascript 中？我以为js只能在十六进制和十进制之间切换。
是的，escape是全局对象上的一个函数，和encodeURI/decodeURI、encodeURIComponent/decodeURIComponent一起在js中已经存在很久了。

【解决方案3】：

有许多资源可以为您执行此操作：

HtmlEscape.net 例如将您的文本转义为http://localhost:8080/news.xhtml?id=32&lang=en。

浏览器往往需要这么多的转义，你在这里有什么要求？

【讨论】：

【解决方案4】：

我也不清楚背景，但我想知道您是否有意对整个 URL 进行编码？

我的理解是，您只需要对不符合 URL 标准的任何内容进行编码，例如空格、不表示目录的正斜杠等。

但是假设您可能将 URL 作为 get 变量传递给您，也许您可以使用 javascript（或 jquery）之类的东西来解码链接指向的位置，而无需麻烦手动双编码等。那里是一个非常简单和轻量级的 jquery 插件，名为URL Encode，可以编码和解码。当然，源代码仍会反映编码，但链接（无论是单击还是悬停时）都会反映未编码的 URL

【讨论】：