html 空间显示为 %2520 而不是 %20

A html space is showing as %2520 instead of %20

提问by Eric Leschinski

Passing a filename to the firefox browser causes it to replace spaces with %2520instead of %20.

将文件名传递给 Firefox 浏览器会导致它用%2520代替%20.

I have the following HTML in a file called myhtml.html:

我在名为 的文件中有以下 HTML myhtml.html：

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

When I load myhtml.htmlinto firefox, the image shows up as a broken image. So I right click the link to view the picture and it shows this modified URL:

当我加载myhtml.html到 Firefox 时，图像显示为损坏的图像。所以我右键单击链接查看图片，它显示了这个修改后的 URL：

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

What the heck? It converted my space into a %2520. Shouldn't it be converting it to a %20?

有没有搞错？它将我的空间转换为%2520. 不应该将其转换为 a%20吗？

How do I change this HTML file so that the browser can find my image? What's going on here?

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

回答by Nick Andriopoulos

A bit of explaining as to what that %2520is :

稍微解释一下那%2520是什么：

The common space character is encoded as %20as you noted yourself. The %character is encoded as %25.

公共空格字符%20按照您自己的注释进行编码。的%字符被编码为%25。

The way you get %2520is when your url already has a %20in it, and gets urlencoded again, which transforms the %20to %2520.

您获得的方式%2520是当您的 url 中已经包含 a%20并再次进行 urlencoded 时，%20将%2520.

Are you (or any framework you might be using) double encoding characters?

您（或您可能正在使用的任何框架）是双编码字符吗？

Edit:Expanding a bit on this, especially for LOCALlinks. Assuming you want to link to the resource C:\my path\my file.html:

编辑：对此进行一些扩展，特别是对于本地链接。假设您要链接到资源C:\my path\my file.html：

• if you provide a local file path only, the browser is expected to encode and protect all characters given (in the above, you should give it with spaces as shown, since %is a valid filename character and as such it will be encoded) when converting to a proper URL (see next point).
• if you provide a URL with the file://protocol, you are basically stating that you have taken all precautions and encoded what needs encoding, the rest should be treated as special characters. In the above example, you should thus provide file:///c:/my%20path/my%20file.html. Aside from fixing slashes, clients should not encode characters here.

• 如果您仅提供本地文件路径，则浏览器应在转换时对所有给定的字符进行编码和保护（在上面，您应该给它提供如图所示的空格，因为它%是一个有效的文件名字符，因此它将被编码）到一个正确的 URL（见下一点）。
• 如果您提供带有file://协议的 URL ，您基本上是在说明您已采取所有预防措施并对需要编码的内容进行编码，其余部分应视为特殊字符。在上面的示例中，您应该因此提供file:///c:/my%20path/my%20file.html. 除了修复斜杠外，客户端不应在此处对字符进行编码。

NOTES:

笔记：

• Slash direction - forward slashes /are used in URLs, reverse slashes \in Windows paths, but most clients will work with both by converting them to the proper forward slash.
• In addition, there are 3 slashes after the protocol name, since you are silently referring to the current machine instead of a remote host ( the full unabbreviated path would be file://localhost/c:/my%20path/my%file.html), but again most clients will work without the host part (ie two slashes only) by assuming you mean the local machine and adding the third slash.

• 斜杠方向 - /URL 中使用正斜杠\，Windows 路径中使用反斜杠，但大多数客户端将通过将它们转换为正确的正斜杠来使用两者。
• 此外，协议名称后面有 3 个斜杠，因为您是在默默地引用当前机器而不是远程主机（完整的未缩写路径将是file://localhost/c:/my%20path/my%file.html），但同样，大多数客户端将在没有主机部分的情况下工作（即只有两个斜杠） ) 假设您指的是本地计算机并添加第三个斜杠。

回答by hek2mgl

For some - possibly valid - reason the url was encoded twice. %25is the urlencoded %sign. So the original url looked like:

出于某些（可能是有效的）原因，url 被编码了两次。%25是 urlencoded%符号。所以原始网址看起来像：

http://server.com/my path/

Then it got urlencoded once:

然后它被 urlencoded 一次：

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

and twice:

和两次：

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

So you should do no urlencoding - in your case- as other components seems to to that already for you. Use simply a space

所以你不应该做 urlencoding -在你的情况下- 因为其他组件似乎已经为你准备好了。简单地使用一个空间

回答by Eric Leschinski

When you are trying to visit a local filename through firefox browser, you have to force the file:\\\protocol (http://en.wikipedia.org/wiki/File_URI_scheme) or else firefox will encode your space TWICE. Change the html snippet from this:

当您尝试通过 firefox 浏览器访问本地文件名时，您必须强制使用file:\\\协议（http://en.wikipedia.org/wiki/File_URI_scheme），否则 firefox 将对您的空间进行两次编码。从此更改 html 片段：

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

to this:

对此：

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

or this:

或这个：

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

Then firefox is notified that this is a local filename, and it renders the image correctly in the browser, correctly encoding the string once.

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

Helpful link: http://support.mozilla.org/en-US/questions/900466

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

回答by Subrata Sarkar

The following code snippet resolved my issue. Thought this might be useful to others.

以下代码片段解决了我的问题。认为这可能对其他人有用。

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

Rather using default encodeURIComponentmy first line of code is converting all spacesinto hyphensusing regex pattern /\s\gand the following line just does the reverse, i.e. converts all hyphensback to spacesusing another regex pattern /-/g. Here /gis actually responsible for finding allmatching characters.

而是使用默认值，encodeURIComponent我的第一行代码是将所有代码转换spaces为hyphensusing regex 模式/\s\g，而下一行正好相反，即将所有代码转换hyphens回spaces使用另一个regex pattern /-/g. 这里/g其实是负责finding all匹配字符的。

When I am sending this value to my Ajax call, it traverses as normal spacesor simply %20and thus gets rid of double-encoding.

当我将此值发送到我的 Ajax 调用时，它会遍历 as normal spacesor 简单地%20并因此摆脱double-encoding.

回答by Hopefulee

Try this?

尝试这个？

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

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