Không gian html hiển thị dưới dạng% 2520 thay vì% 20

Question

Chuyển tên tệp tới trình duyệt firefox khiến nó thay thế dấu cách bằng %2520 thay vì %20.

Tôi có HTML sau đây trong một tập tin gọi là myhtml.html:

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

Khi tôi tải myhtml.html vào firefox, hình ảnh xuất hiện như một hình ảnh bị hỏng. Vì vậy, tôi nhấp chuột phải vào liên kết để xem hình ảnh và nó hiển thị URL được sửa đổi này:

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

Cái quái gì? Nó chuyển đổi không gian của tôi thành %2520. Không nên chuyển đổi nó thành %20?

Làm cách nào để thay đổi tệp HTML này để trình duyệt có thể tìm thấy hình ảnh của tôi? Những gì đang xảy ra ở đây?

Answer 1

Một chút giải thích như những gì mà %2520 là:

Nhân vật không gian chung được mã hóa như %20 như bạn lưu ý mình. Ký tự % được mã hóa là %25.

Cách bạn nhận được %2520 là khi url của bạn đã có một %20 trong đó và được mã hóa url một lần nữa, biến đổi số %20 thành %2520.

Bạn (hoặc bất kỳ khuôn khổ nào bạn có thể đang sử dụng) ký tự mã hóa kép?

Edit: Mở rộng một chút về vấn đề này, đặc biệt đối với ĐỊA PHƯƠNG liên kết. Giả sử bạn muốn liên kết đến các tài nguyên C:\my path\my file.html:

• nếu bạn cung cấp một đường dẫn tập tin địa phương chỉ, trình duyệt được dự kiến ​​để mã hóa và bảo vệ tất cả các nhân vật nhất định (ở trên, bạn nên cung cấp cho nó với không gian như hình, kể từ % là một tên tệp hợp lệ và như vậy nó sẽ được mã hóa) khi chuyển sang một URL thích hợp (xem điểm tiếp theo).
• nếu bạn cung cấp URL có giao thức file://, về cơ bản bạn nói rằng bạn đã thực hiện tất cả các biện pháp phòng ngừa và mã hóa những gì cần mã hóa, phần còn lại sẽ được coi là ký tự đặc biệt. Trong ví dụ trên, bạn nên cung cấp file:///c:/my%20path/my%20file.html. Ngoài việc sửa lỗi, khách hàng không nên mã hóa các ký tự ở đây.

GHI CHÚ: hướng

• Slash - dấu gạch chéo / được sử dụng trong URL, đảo ngược dấu gạch chéo \ trong các nẻo Windows, nhưng hầu hết khách hàng sẽ làm việc với cả hai bằng cách chuyển đổi chúng sang các dấu gạch chéo thích hợp. Ngoài ra, có 3 dấu gạch chéo sau tên giao thức, vì bạn đang lặng lẽ tham chiếu đến máy hiện tại thay vì máy chủ từ xa (đường dẫn không được viết tắt đầy đủ sẽ là file://localhost/c:/my%20path/my%file.html), nhưng một lần nữa hầu hết khách hàng sẽ hoạt động mà không có phần máy chủ (tức là hai dấu gạch chéo chỉ) bằng cách giả sử bạn có nghĩa là máy địa phương và thêm dấu gạch chéo thứ ba.

Answer 2

Khi bạn đang cố gắng truy cập tên tệp cục bộ thông qua trình duyệt firefox, bạn phải ép buộc giao thức file:\\\ (http://en.wikipedia.org/wiki/File_URI_scheme) hoặc firefox sẽ mã hóa không gian của bạn hai lần. Thay đổi đoạn mã html từ này:

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

này:

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

hay này:

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

Sau đó firefox được thông báo rằng đây là một tên tập tin địa phương, và nó ám ảnh chính xác trong trình duyệt, mã hóa chính xác chuỗi một lần.

liên kết hữu ích: http://support.mozilla.org/en-US/questions/900466

Answer 3

Đối với bất cứ lý do url được mã hóa hai lần. %25 là url được mã hóa %. Vì vậy, các url ban đầu trông giống như:

http://server.com/my path/ 

Sau đó, nó đã urlencoded một lần:

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

và hai lần:

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

Vì vậy, bạn nên làm không urlencoding như các thành phần khác dường như đó đã dành cho bạn. Sử dụng đơn giản là một không gian

Answer 4

Đoạn mã sau giải quyết được sự cố của tôi. Nghĩ rằng điều này có thể hữu ích cho người khác.

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

Thay sử dụng mặc định encodeURIComponent dòng đầu tiên của tôi về code được chuyển đổi tất cả spaces vào hyphens sử dụng regex mẫu /\s\g và dòng sau chỉ làm ngược lại, tức là chuyển đổi tất cả hyphens trở lại spaces sử dụng khác regex pattern /-/g. Tại đây, /g thực sự chịu trách nhiệm đối với finding all các ký tự trùng khớp.

Khi tôi gửi giá trị này cho cuộc gọi Ajax của mình, giá trị này đi ngang là normal spaces hoặc chỉ đơn giản là %20 và do đó loại bỏ double-encoding.