انا اصمم موقع لأتعلم و اثناء التصميم احاول ان امنع المستخدم يعرف id او طريقة تنسيق style مثل color red width 100px يعني لا اريده معرفة ماذا افعل في الصور او القائمة او تنسيق الموقع من اجل ان امنع المستخدم من تخريب تصميم الموقع و هذا لا يؤثر على حماية الموقع. لكن اتسائل هذا الشيء صحيح ام انا ابالغ لان احاول تصحيح هذا الشيء لساعات.
هل انا ابالغ في تصميم الواجهة الامامية
ما الحاجة إلى ذلك؟ لا يوجد داعي لما تفعله فلن يعود بفائدة ولا أحد يقوم به، فأي شيء يُعرض في المتصفح من كود HTML, CSS, JavaScript يستطيع المستخدم رؤيته، وحتى لو حاولت تشفيره أو إخفاءه، فيمكن الوصول إليه عبر أدوات المطور في المتصفح، ما يتم حمايته هو الكود الخاص بالواجهة الخلفية Back-End.
ما يتم في المشاريع الفعلية للـ Front-End عند نشرها على الإنترنت، هو تنفيذ Minification و Bundling بالإضافة إلى Compression لكود HTML, CSS, JS بحيث يتم تجميع كل الكود في ملف واحد فقط وحذف أية مسافات لتقليص عدد السطور وأيضًا ضغط الكود ليصبح صعب القراءة ولتوفير أداء أفضل.
بمعنى الكود التالي:
<!DOCTYPE html>
<html lang="ar">
<head>
<meta charset="UTF-8">
<title>موقعي</title>
<!-- تعليق -->
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="container">
<h1>مرحباً بك</h1>
<p>نص تجريبي</p>
</div>
</body>
</html>
يصبح:
<!DOCTYPE html><html lang="ar"><head><meta charset="UTF-8"><title>موقعي</title><link rel="stylesheet" href="styles.min.css"></head><body><div class="container"><h1>مرحباً بك</h1><p>هذا نص تجريبي</p></div></body></html>
وكود جافاسكريبت التالي:
function calculateTotal(price, quantity) {
const subtotal = price * quantity;
const tax = subtotal * 0.15;
return subtotal + tax;
}
يصبح:
function a(b,c){const d=b*c;return d+d*.15}
وكذلك في بعض المشاريع يتم الكود إلى إصدار ES5 من جافاسكريبت لكي يتوافق مع المتصفحات القديمة، بالتالي الكود يتم تحويله وذلك يُعرف باسم transpiling حيث يتم استخدام أدوات مثل Babel.
ولكن ذلك لا يعني أنّه لا يُمكن الوصول للكود في المتصفح، بل هو مُتاح للجميع.
وهناك تقنية أخرى تتم وهي Obfuscation لتشويش الكود لكن ذلك أمر متقدم تستطيع البحث والقراءة عنه، وحتى ذلك يمكن فك تشفيره.
التعليقات