Html 空间显示为% 2520,而不是% 20

将文件名传递给 firefox 浏览器会导致它将空格替换为 %2520而不是 %20

我在一个名为 myhtml.html的文件中有以下 HTML:

<img src="C:\Documents and Settings\screenshots\Image01.png"/>

当我将 myhtml.html加载到 firefox 中时,图像显示为一个损坏的图像。所以我右键点击链接查看图片,它显示了这个修改后的 URL:

file:///c:/Documents%2520and%2520Settings/screenshots/Image01.png
^
^-----Firefox changed my space to %2520.

怎么回事? 它把我的空间转换成了 %2520。它不是应该转换成 %20吗?

如何更改这个 HTML 文件,以便浏览器可以找到我的图像? 这里发生了什么?

151318 次浏览

当您试图通过 Firefox 浏览器访问本地文件名时,必须强制使用 file:\\\协议(http://en.wikipedia.org/wiki/File_URI_scheme) ,否则 Firefox 将对您的空间进行两次编码。从下面更改 html 片段:

<img src="C:\Documents and Settings\screenshots\Image01.png"/>

回到这里:

<img src="file:\\\C:\Documents and Settings\screenshots\Image01.png"/>

或者这样:

<img src="file://C:\Documents and Settings\screenshots\Image01.png"/>

然后通知 firefox 这是一个本地文件名,并且它在浏览器中正确地呈现图像,正确地编码字符串一次。

有用的链接: http://support.mozilla.org/en-US/questions/900466

由于某种可能有效的原因,URL 被编码了两次。%25是乌尔伦编码的 %标志。原始的网址是这样的:

http://server.com/my path/

然后有一次是电话密码:

http://server.com/my%20path/

还有两次:

http://server.com/my%2520path/

所以你不应该做的 urlencode-在你的情况下-因为其他组件似乎已经为您。简单地使用一个空格

解释一下 %2520是什么:

正如您所注意到的,公共空间字符被编码为 %20%字符被编码为 %25

获取 %2520的方法是,当 URL 中已经有一个 %20时,再次获取 urlencode,从而将 %20转换为 %2520

您(或您可能使用的任何框架)使用双重编码字符吗?

编辑: 扩展一下,特别是对于 本地的链接。假设你想链接到资源 C:\my path\my file.html:

  • 如果你只提供一个本地文件路径,浏览器应该在转换到正确的 URL 时对所有给定的字符进行编码和保护(在上面的例子中,你应该使用空格,因为 %是一个有效的文件名字符,因此它会被编码)。
  • 如果您提供了一个带有 file://协议的 URL,那么您基本上是在声明您已经采取了所有预防措施并对需要编码的内容进行了编码,其余内容应该被视为特殊字符。在上面的例子中,您应该提供 file:///c:/my%20path/my%20file.html。除了修正斜杠,客户端不应该在这里编码字符。

备注:

  • 斜杠方向斜杠 /在 URL 中使用,反斜杠 \在 Windows 路径中使用,但是大多数客户机都会将它们转换为正确的正斜杠。
  • 另外,协议名后面还有3个斜杠,因为你默默地引用当前机器而不是远程主机(完整的不缩写路径是 file://localhost/c:/my%20path/my%file.html) ,但是大多数客户机都会在没有主机部分的情况下工作(即只有两个斜杠) ,假设你指的是本地机器并添加第三个斜杠。

下面的代码片段解决了我的问题。

var strEnc = this.$.txtSearch.value.replace(/\s/g, "-");
strEnc = strEnc.replace(/-/g, " ");

我的第一行代码不是使用默认的 encodeURIComponent,而是使用正则表达式 /\s\g将所有的 spaces转换为 hyphens,接下来的代码行只是做相反的事情,即使用另一个 regex pattern /-/g将所有的 hyphens转换回 spaces。这里 /g实际上负责 finding all匹配字符。

当我将这个值发送给 Ajax 调用时,它会遍历为 normal spaces或者简单地遍历为 %20,从而去掉了 double-encoding

试试这个?

encodeURIComponent('space word').replace(/%20/g,'+')

用这个试试

file:///c:/Documents%20and%20Settings/screenshots/Image01.png

每当您试图在浏览器中使用 cmd 或任何 html 标记打开本地文件时,使用“ file://”并将空格替换为% 20(空格的 url 编码)