ฉันควรใช้ encodeURI หรือ encodeURIComponent เพื่อเข้ารหัส URL หรือไม่


282

ควรใช้วิธีใดในสองวิธีนี้ในการเข้ารหัส URL



13
ความแตกต่างที่สำคัญอย่างหนึ่งก็คือencodeURIจะไม่เข้ารหัส/ดังนั้น: encodeURIComponent("ac/dc")=> ac%2FdcและencodeURI("ac/dc")=>ac/dc

สิ่งนี้อาจมีประโยชน์: "encodeURIComponent() and encodeURI() encode a URI by replacing URL reserved characters with their UTF-8 encoding....They differ because encodeURI does not encode queryString or hash values...URLs do not allow many special characters, like spaces or slashes. However these special characters are part of life, so URL encoding was invented." แหล่งที่มา
user1063287

โปรดดูหัวข้อเฉพาะencodeURIComponent differs from encodeURI as followsที่: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/
......

คำตอบ:


324

ขึ้นอยู่กับสิ่งที่คุณต้องการทำ

encodeURI สันนิษฐานว่าอินพุตเป็น URI ที่สมบูรณ์ซึ่งอาจมีอักขระบางตัวที่ต้องการการเข้ารหัส

encodeURIComponent จะเข้ารหัสทุกอย่างด้วยความหมายพิเศษดังนั้นคุณจึงใช้มันเป็นส่วนประกอบของ URIs เช่น

var world = "A string with symbols & characters that have special meaning?";
var uri = 'http://example.com/foo?hello=' + encodeURIComponent(world);

108

หากคุณกำลังเข้ารหัสสตริงที่จะใส่ในองค์ประกอบ URL (พารามิเตอร์การสืบค้น) คุณควรโทร encodeURIComponentคุณควรจะเรียก

หากคุณกำลังเข้ารหัสที่มีอยู่ URL encodeURIโทร


1
หากฉันใช้ ajax ฉันจะถอดรหัส url ที่ส่งไปยัง php ได้อย่างไร?
Aditya Shukla

6
คุณทำไม่ได้ เว็บเซิร์ฟเวอร์ทำโดยอัตโนมัติ
เควนติน

@Aditya: มันขึ้นอยู่กับสิ่งที่คุณทำ
SLAKS

@slaks. ฉันกำลังส่งพารามิเตอร์ผ่าน get ดังนั้นฉันต้องการดึงข้อมูลเหล่านั้นใน php
Aditya Shukla

2
ดี. ฉันอาจพูดอย่างเร่งรีบเมื่อฉันบอกว่าเว็บเซิร์ฟเวอร์จะทำเช่นนั้น แต่ห้องสมุดใดก็ตามที่คุณใช้ในการอ่านข้อมูลในแบบฟอร์มของคุณจะดูแลคุณ
เควนติน

47

xkr.usมีการอภิปรายที่ยอดเยี่ยมพร้อมตัวอย่าง หากต้องการเสนอราคาสรุป:

เมธอด escape () ไม่เข้ารหัสอักขระ + ซึ่งตีความว่าเป็นช่องว่างบนฝั่งเซิร์ฟเวอร์รวมถึงสร้างโดยฟอร์มที่มีช่องว่างในฟิลด์ เนื่องจากข้อบกพร่องนี้และความจริงที่ว่าฟังก์ชั่นนี้ไม่สามารถจัดการกับอักขระที่ไม่ใช่ ASCII ได้อย่างถูกต้องคุณควรหลีกเลี่ยงการใช้ Escape () ทุกครั้งที่ทำได้ ทางเลือกที่ดีที่สุดคือ encodeURIComponent ()

escape () จะไม่เข้ารหัส: @ * / +

การใช้เมธอด encodeURI () นั้นค่อนข้างพิเศษกว่าการหลบหนี () โดยที่ encodes สำหรับ URIs ซึ่งต่างจาก querystring ซึ่งเป็นส่วนหนึ่งของ URL ใช้วิธีนี้เมื่อคุณต้องการเข้ารหัสสตริงที่จะใช้สำหรับทรัพยากรใด ๆ ที่ใช้ URIs และต้องการอักขระบางตัวที่จะไม่ถูกเข้ารหัส โปรดทราบว่าวิธีนี้ไม่ได้เข้ารหัสอักขระ 'เนื่องจากเป็นอักขระที่ถูกต้องภายใน URIs

encodeURI () จะไม่เข้ารหัส: ~! @ # $ & * () =: /,;? + '

สุดท้าย encodeURIComponent () วิธีการที่ควรใช้ในกรณีส่วนใหญ่เมื่อเข้ารหัสองค์ประกอบเดียวของ URI วิธีนี้จะเข้ารหัสตัวอักษรบางตัวที่ปกติจะได้รับการยอมรับว่าเป็นตัวอักษรพิเศษสำหรับ URIs เพื่อให้ส่วนประกอบจำนวนมากอาจรวมอยู่ โปรดทราบว่าวิธีนี้ไม่ได้เข้ารหัสอักขระ 'เนื่องจากเป็นอักขระที่ถูกต้องภายใน URIs

encodeURIComponent () จะไม่เข้ารหัส: ~! * () '


เพิ่งเรียนรู้ เซิร์ฟเวอร์ TOMCAT 9 นั้นมีความเฉพาะเจาะจงมากขึ้นเกี่ยวกับสิ่งที่คุณสามารถส่งไปยัง URL encodeURIComponent () ดูเหมือนจะทำงานได้ดีขึ้นในกรณีที่คุณมี "ช่องว่าง" ในสิ่งที่คุณต้องเข้ารหัส Tomcat 8 ไม่สนใจ แต่ 9 นั้นพิเศษกว่า
Aggie Jon จาก 87

ดังนั้นในคำอื่น ๆencodeURIล้มเหลวหากคุณพยายามแปลงชื่อไฟล์เป็น URL และชื่อไฟล์มี#อยู่ในนั้น
gman

17

นี่คือบทสรุป

  1. escape () จะไม่เข้ารหัส @ * _ + - /

    อย่าใช้มัน

  2. encodeURI () จะไม่เข้ารหัส AZ az 0-9; , /? : @ & = + $ - _ ! ~ * '() #

    ใช้มันเมื่ออินพุตของคุณเป็น URL ที่สมบูรณ์เช่น ' https://searchexample.com/search?q=wiki '

  3. encodeURIComponent () จะไม่เข้ารหัส AZ az 0-9 - _ ! ~ * '() ใช้มันเมื่ออินพุตของคุณเป็นส่วนหนึ่งของ URL ที่สมบูรณ์เช่น const queryStr = encodeURIComponent(someString)

1
นี่คือคำตอบที่ยอดเยี่ยมเพราะมันบอกสิ่งที่พวกเขาทำ อย่างไรก็ตามฉันยังมีคำถามเกี่ยวกับสิ่งที่ฉันควรใช้และเมื่อ จะทำอย่างไรถ้า URI ของฉันเป็น URL ที่สมบูรณ์ ฉันควรใช้ Rule 2 หรือ Rule 3 จากด้านบนหรืออาจเป็นเช่น encodeURIComponent (encodeURI (theCompleteURI))
Panu Logic

10

encodeURIComponent (): สมมติว่าอาร์กิวเมนต์เป็นส่วน (เช่นโปรโตคอลชื่อโฮสต์เส้นทางหรือสตริงการสืบค้น) ของ URI ดังนั้นมันจะหนีอักขระเครื่องหมายวรรคตอนที่ใช้เพื่อแยกส่วนของ URI

encodeURI (): ใช้สำหรับเข้ารหัส URL ที่มีอยู่


7

ความแตกต่างระหว่างencodeURIและencodeURIComponent:

encodeURIComponent(value)ส่วนใหญ่จะใช้ในการเข้ารหัสค่าพารามิเตอร์ queryString และจะเข้ารหัสทุกอักขระที่ใช้งานvalueได้ encodeURIละเว้นคำนำหน้าโปรโตคอล ( http://) และชื่อโดเมน


ในกรณีที่หายากมากเมื่อคุณต้องการใช้การเข้ารหัสด้วยตนเองเพื่อเข้ารหัสอักขระเพิ่มเติม (แม้ว่าพวกเขาไม่จำเป็นต้องเข้ารหัสในกรณีทั่วไป) เช่น: ! *คุณอาจใช้:

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

(ที่มา )


6
คุณไม่ควรหนีตัวอักษรเหล่านั้นด้วย URL
Arashsoft

ดังที่เอกสารอ้างอิงอ้างถึง: "ตัวละครเหล่านี้ไม่มีการใช้ URI เพื่อลดขนาดอย่างเป็นทางการ"
caesarsol

@caesarsol ดังนั้นฉันควรแก้ไขคำตอบของฉัน แจ้งให้เราทราบความคิดของคุณเพราะผมไม่สามารถเข้าใจสิ่งที่อ้างว่าเอกสารหมายถึง ..
T.Todua

เพียงแค่ไม่มีประโยชน์ที่จะเข้ารหัสตัวอักษรเหล่านี้จนกว่าคุณจะทำอะไรบางอย่างออกมาจาก URL ที่เข้ารหัสกรณีการใช้งานปกติ :)
caesarsol

2

คำตอบอื่น ๆ อธิบายถึงวัตถุประสงค์ นี่คืออักขระที่แต่ละฟังก์ชันจะแปลง :

control = '\x00\x01\x02\x03\x04\x05\x06\x07\x08\x09\x0A\x0B\x0C\x0D\x0E\x0F'
        + '\x10\x11\x12\x13\x14\X15\x16\x17\x18\x19\x1A\x1B\x1C\x1D\x1E\x1F'
                                                                    + '\x7F'
encodeURI         (control + ' "%<>[\\]^`{|}'                             )
encodeURIComponent(control + ' "%<>[\\]^`{|}' + '#$&,:;=?' + '+/@'        )
escape            (control + ' "%<>[\\]^`{|}' + '#$&,:;=?' +       "!'()~")

อักขระทั้งหมดข้างต้นจะถูกแปลงเป็นรหัสเปอร์เซ็นต์เลขฐานสิบหก เว้นวรรคถึง%20, เปอร์เซ็นต์ถึง%25, ฯลฯ อักขระด้านล่างไม่ผ่านการเปลี่ยนแปลง

นี่คือตัวละครที่ฟังก์ชั่นจะไม่แปลง :

pass_thru = '*-._0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'

encodeURI         (pass_thru + '#$&,:;=?' + '+/@' + "!'()~")
encodeURIComponent(pass_thru +                      "!'()~")
escape            (pass_thru +              '+/@'          )

-4

encodeURIComponentในฐานะที่เป็นกฎทั่วไปใช้ อย่ากลัวชื่อยาว ๆ ที่คิดว่ามันใช้เฉพาะเจาะจงมากขึ้นสำหรับฉันมันเป็นวิธีที่ใช้กันทั่วไปมากกว่า นอกจากนี้อย่าถูกดูดเข้าไปในการใช้ encodeURI เพราะคุณทดสอบแล้วและดูเหมือนว่าจะเข้ารหัสอย่างถูกต้องมันอาจไม่ใช่สิ่งที่คุณตั้งใจจะใช้และแม้ว่าการทดสอบอย่างง่าย ๆ ของคุณโดยใช้ "Fred" ในฟิลด์ชื่อแรกคุณจะพบว่า ในภายหลังเมื่อคุณใช้ข้อความขั้นสูงเช่นการเพิ่มแอมเปอร์แซนด์หรือแฮชแท็กมันจะล้มเหลว คุณสามารถดูคำตอบอื่น ๆ สำหรับสาเหตุที่เป็นเช่นนี้

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.