كيفية ترميز URL باستخدام JavaScript

قد تحتاج إلى تشفير عنوان URL إذا كنت ترسله كجزء من طلب GET ، على سبيل المثال.

كيف تقوم بترميز URL في JavaScript؟

اعتمادًا على ما عليك القيام به ، هناك وظيفتان من وظائف JavaScript اللتان ستساعدكان.

الأول هوencodeURI()، والثاني هوencodeURIComponent().

ملاحظة: قد تقرأ عنهاescape()، ولكن هذا مهمل ويجب عدم استخدامه.

هاتان الطريقتان تختلفان في الرموز التي يتم ترميزها.

بالتفصيل،encodeURI()لا يشفر[email protected]#{{content}}amp;*()=:/,;?+وencodeURIComponent()لا يشفر-_.!~*'()، ترميز جميع الأحرف الأخرى. لماذا يختلفون؟ لأنها مخصصة لاستخدامات مختلفة:

  • encodeURI()يهدف إلى ترميز عنوان URL كامل
  • encodeURIComponent()يهدف إلى ترميز قيمة معلمة URL واحدة

إذا كنت ستتصلencodeURIComponent()على عنوان URL كامل ، لأنه يقوم بترميز/، سيتم ترميز فواصل مسار URL أيضًا (من بين أشياء أخرى):

encodeURI("http://flaviocopes.com/ hey!/")
//"http://flaviocopes.com/%20hey!/"
encodeURIComponent("http://www.example.org/a file with spaces.html")
// "http%3A%2F%2Fflaviocopes.com%2F%20hey!%2F"

MDNيقترح تحسينًا للالتزام بـRFC 3986 standard (http://tools.ietf.org/html/rfc3986) ، بتنفيذ الوظيفة التالية:

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

أنت تسميها لكل معلمة فردية ستضيفها إلى عنوان URL.

الencodeURI()وencodeURIComponent()طرق لها المقابلةdecodeURI()وdecodeURIComponent()الذي يقوم بالمهمة المعاكسة التي يمكنك استخدامها على الواجهة الخلفية إذا كنت تستخدمNode.js.


المزيد من دروس js: