یکی از ویژگی‌های جذاب و کاربردی که در دنیای برنامه‌نویسی وب و شبکه وجود دارد، توانایی دسترسی و استفاده از HTTP Headers است. این هدرها به ما امکان می‌دهند تا اطلاعات خاص و مفیدی را درباره درخواست و پاسخ‌های وب بدست آوریم. یکی از مهم‌ترین کاربردهای این‌ها، شخصی‌سازی محتوا براساس اطلاعات دریافت شده از کلاینت می‌باشد.
یکی از این هدرها Sec-CH-UA-Mobile نام دارد که به ما می‌گوید آیا دسکتاپ کلاینت در حال استفاده از دستگاه موبایل است یا خیر. این اطلاعات می‌تواند در طراحی و نمایش آسانتر صفحات وب بر روی دستگاه‌های مختلف بسیار مفید باشد.
به طور کلی، هدرهای Client Hints به مرورگرها و کلاینت‌های وب کمک می‌کنند تا تجربه بهتری از استفاده از وب داشته باشند. با این هدر خاص، می‌توانید به راحتی تشخیص دهید که آیا کاربران شما از دستگاه‌های تلفن همراه استفاده می‌کنند یا خیر و بر این اساس، نحوه نمایش سایت خود را تغییر دهید.
مثلاً، ممکن است بخواهید برای کاربران موبایل از طرح‌بندی‌های متفاوت یا اندازه فونت خاصی استفاده کنید. همچنین، می‌توانید اطلاعات آنالیز بهتری برای بهینه‌سازی سایت خود داشته باشید.
در کد زیر، نشانه‌ای از استفاده از این هدر را در یک پروژه ساده Node.js مشاهده می‌کنید که بررسی می‌کند آیا کلاینت در حال استفاده از دستگاه موبایل است یا خیر:
const http = require('http');
const server = http.createServer((req, res) => {
const isMobile = req.headers['sec-ch-ua-mobile'];
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end(isMobile ? 'User is on a mobile device.' : 'User is not on a mobile device.');
});
server.listen(3000, () => {
console.log('Server running at http://localhost:3000/');
});
اجازه دهید نگاهی عمیق‌تر به این کد داشته باشیم:
const http = require('http'); این خط ماژول HTTP را برای ساخت یک سرور ساده بارگذاری می‌کند.
const server = http.createServer((req, res) => { ... }); با این خط، سروری ایجاد می‌شود که درخواست‌های ورودی و پاسخ به آن‌ها را مدیریت می‌کند.
const isMobile = req.headers['sec-ch-ua-mobile']; این خط مشخص می‌کند که آیا کاربر از یک دستگاه موبایل استفاده می‌کند یا خیر.
res.writeHead(200, {'Content-Type': 'text/plain'}); این خط سرآیند پاسخ را تنظیم می‌کند و نوع پاسخ را به متن ساده مشخص می‌کند.
res.end(...); پاسخ کامل به کاربر ارسال می‌شود و تعیین می‌کند آیا کاربر از دستگاه موبایل استفاده می‌کند یا خیر.
server.listen(3000, ...); سرور به پورت ۳۰۰۰ گوش می‌دهد و آماده پذیرش درخواست‌ها است.