يعد استخدام http://localhost للتطوير المحلي أمرًا جيدًا في معظم الأوقات، باستثناء بعض الحالات الخاصة. توضّح هذه المشاركة الحالات التي تحتاج فيها إلى تشغيل موقعك الإلكتروني للتطوير المحلي باستخدام بروتوكول HTTPS.
يمكنك أيضًا الاطّلاع على: كيفية استخدام HTTPS في التطوير المحلي.
في هذه المشاركة، تكون البيانات حول localhost صالحة لكل من 127.0.0.1 و[::1] أيضًا، لأنّهما يصفان عنوان الكمبيوتر المحلي، والذي يُسمى أيضًا "عنوان حلقة الاسترجاع". ولتبسيط الأمر أيضًا، لم يتم تحديد رقم المنفذ.
لذلك عند ظهور http://localhost، اقرأه على النحو التالي: http://localhost:{PORT} أو http://127.0.0.1:{PORT}.
ملخّص
عند التطوير محليًا، استخدِم http://localhost تلقائيًا. سيعمل مشغِّلو الخدمات وWeb Authentication API والمزيد.
ومع ذلك، في الحالات التالية، ستحتاج إلى HTTPS للتطوير المحلي:
- إعداد ملفات تعريف الارتباط الآمنة بطريقة متسقة عبر المتصفحات
- تصحيح الأخطاء المرتبطة بالمحتوى المختلَط
- استخدام HTTP/2 والإصدارات الأحدث
- استخدام مكتبات أو واجهات برمجة تطبيقات تابعة لجهات خارجية تتطلّب HTTPS
استخدام اسم مضيف مخصّص
حالات استخدام بروتوكول HTTPS في عمليات التطوير المحلية
✨ هذا كل ما تحتاج إلى معرفته. لمزيد من التفاصيل، يُرجى متابعة القراءة.
لماذا يجب أن يعمل موقع التطوير الخاص بك بشكل آمن؟
لتجنُّب الوقوع في مشاكل غير متوقعة، يجب أن يحرص موقع التطوير المحلي على أن يتصرف بأكبر قدر ممكن مثل موقع الإنتاج الإلكتروني. لذلك، إذا كان موقع الإنتاج الإلكتروني يستخدم بروتوكول HTTPS، يجب أن يعمل موقع التطوير المحلي الخاص بك مثل موقع ويب يستخدم HTTPS.
استخدام http://localhost تلقائيًا
تتعامل المتصفحات مع http://localhost بطريقة خاصة: على الرغم من أنّه يستخدم بروتوكول HTTP، فإنّه يعمل غالبًا مثل موقع إلكتروني يستخدم بروتوكول HTTPS.
على http://localhost، تتم إتاحة عمال الخدمة وواجهات برمجة تطبيقات أدوات الاستشعار وواجهات برمجة تطبيقات المصادقة وعمليات الدفع والميزات الأخرى التي تتطلب ضمانات أمان معيّنة، ويتصرفون تمامًا كما هو الحال على موقع إلكتروني يستخدم بروتوكول HTTPS.
حالات استخدام HTTPS في التطوير المحلي
قد تواجه حالات خاصة حيث لا يتصرف http://localhost مثل موقع إلكتروني يستخدم بروتوكول HTTPS، أو يمكنك ببساطة استخدام اسم موقع إلكتروني مخصّص ليس http://localhost.
تحتاج إلى استخدام HTTPS للتطوير المحلي في الحالات التالية:
يجب ضبط ملف تعريف ارتباط على الجهاز يكون باسم
SecureأوSameSite:noneأو يتضمّن البادئة__Host. يتم ضبط ملفات تعريف الارتباطSecureعلى HTTPS فقط، وليس علىhttp://localhostلجميع المتصفحات. ونظرًا لأنّSameSite:noneو__Hostيتطلبان أيضًا أن يكون ملف تعريف الارتباطSecure، يتطلب ضبط ملفات تعريف الارتباط هذه على موقع التطوير المحلي توفّر HTTPS أيضًا.عليك تصحيح الأخطاء على المستوى المحلي لمشكلة لا تحدث إلا على موقع إلكتروني يستخدم بروتوكول HTTPS وليس على موقع يستخدم بروتوكول HTTP، ولا حتى على
http://localhost، مثل مشكلة محتوى مختلط.تحتاج إلى اختبار أو إعادة إنتاج سلوك خاص ببروتوكول HTTP/2 أو الإصدارات الأحدث. على سبيل المثال، إذا كنت تريد اختبار أداء التحميل على HTTP/2 أو الإصدارات الأحدث. لا يتوافق بروتوكول HTTP/2 غير الآمن أو الإصدارات الأحدث، ولا حتى على
localhost.عليك اختبار المكتبات التابعة لجهات خارجية أو واجهات برمجة التطبيقات التي تتطلّب HTTPS محليًا (مثلاً OAuth).
أنت لا تستخدم
localhost، وإنما تستخدم اسم مضيف مخصصًا للتطوير المحلي، على سبيل المثالmysite.example. يعني ذلك عادةً أنّك تجاوزت ملف المضيفين المحليين:
تعديل ملف المضيفين لإضافة اسم مضيف مخصص. في هذه الحالة، لا يعتبر Chrome وEdge وSafari وFirefox بشكل تلقائي أنّ
mysite.exampleآمن، حتى إذا كان موقعًا محليًا. لذلك لن يعمل مثل موقع إلكتروني يستخدم HTTPS.حالات أخرى هذه ليست قائمة شاملة، ولكن إذا واجهت حالة غير مُدرَجة هنا، لا شكّ في ذلك: ستتوقف الأمور عن العمل في
http://localhost، أو لن يسير سلوك الموقع الإلكتروني على موقع الإنتاج الإلكتروني. 🙃
في كل هذه الحالات، عليك استخدام HTTPS في عمليات التطوير المحلي.
كيفية استخدام HTTPS في التطوير المحلي
إذا كنت بحاجة إلى استخدام HTTPS في التطوير المحلي، يمكنك الانتقال إلى كيفية استخدام HTTPS في التطوير المحلي.
نصائح في حال استخدام اسم مضيف مخصّص
إذا كنت تستخدم اسم مضيف مخصصًا، مثل تعديل ملف المضيفين:
- ويجب عدم استخدام اسم مضيف مجرد مثل
mysite، لأنّه إذا كان هناك نطاق مستوى أعلى (TLD) يحمل الاسم نفسه (mysite)، ستواجهك مشاكل. وهذا الأمر ليس مستبعَدًا: ففي عام 2020، أصبح هناك أكثر من 1,500 نطاق من المستوى الأعلى، وهذه القائمة في تزايد.coffeeوmuseumوtravelوالعديد من أسماء الشركات الكبيرة (وربما الشركة التي تعمل بها!) هي نطاقات TLD. القائمة الكاملة هنا - استخدِم فقط النطاقات التي تملكها أو محجوزة لهذا الغرض. إذا لم يكن لديك نطاق خاص بك، يمكنك استخدام
testأوlocalhost(mysite.localhost). لا يعالجtestمعالجة خاصة في المتصفحات، على عكسlocalhostلأنّ Chrome وEdge يتيحان استخدامhttp://<name>.localhostبشكل تلقائي، وسيتم العمل بشكل آمن عند استخدام المضيف المحلي. جرّب هذه الميزة: شغِّل أي موقع إلكتروني على مضيف محلي والوصول إلىhttp://<whatever name you like>.localhost:<your port>في Chrome أو Edge. وقد يصبح ذلك ممكنًا قريبًا في Firefox وSafari أيضًا. يمكنك إجراء ذلك (مع توفّر نطاقات فرعية مثلmysite.localhost) لأنّlocalhostليس اسم مضيف فقط، بل هو أيضًا نطاق مستوى أعلى كامل، مثلcom.
مزيد من المعلومات
نتوجّه بالشكر إلى جميع المراجعين وعلى المساهمات والملاحظات، وبالأخص "راين سليفي" و"فيليبو فالسوردا" و"ميليكا ميهاجليجا" و"روان ميروود" و"جيك أرشيبالد". 🙌
صورة رئيسية من إنشاء @moses_lee في صفحة Unلمحة،