نوشته شده توسط
hamidrezawd
سلام و خسته نباشید
الان وقتی با مرورگر کامپیوتر وارد دیجی کالا میشی و هر چقدر هم اندازه مرورگر رو تغییر میدی و سایز مرورگر رو پایین میاری قالب دیجی کالا اصلا حالت ریسپانسیو رو به خودش نمیگیره
ولی
وقتی با گوشی وارد سایت میشی کاملا ریسپانسیو هستش و کد ها مختص موبایل هستش .
من میخوام بدونم این رو چطوری تشخیص میده ؟
وقتی با مرورگر کامپیوتر وارد سایت های ریسپانسیو دیگه میشی و اندازه مرورگر رو تغییر میدی و سایز مرورگر رو پایین میاری قالب سایت حالت ریسپانسیو رو به خودش میگیره.
ولی دیجی کالا اینطور نیست.
دیجی کالا از کجا میفهمه که تو کامپیوتری یا موبایل ؟
اینو چطوری تشخیص میده؟
ممنون از لطفتون
زمانی که یک صفحه یا فایل وب رو میخواهیم دریاقت کنیم یکسری اطلاعات که بهشون Header میگن به همراه درخواست ارسال میشه.
یکی از این Header ها که اسمش User-Agent ئه مشخصاتی از سیستم عامل، نوع و نسخه مرورگر، سخت افزار و ... کاربر رو شامل میشه.
فرضا این یکسری User-Agent های شناخته شده است که بصورت یک رشته (string) توسط مرورگر ها ارسال میشه، در سطر قبلی هر کدوم مشخص کردم که ارسال کننده چیه :
Samsung Galaxy S9
Mozilla/5.0 (Linux; Android 8.0.0; SM-G960F Build/R16NW) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.84 Mobile Safari/537.36
Samsung Galaxy S8
Mozilla/5.0 (Linux; Android 7.0; SM-G892A Build/NRD90M; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/60.0.3112.107 Mobile Safari/537.36
Nexus 6P
Mozilla/5.0 (Linux; Android 6.0.1; Nexus 6P Build/MMB29P) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.83 Mobile Safari/537.36
Sony Xperia XZ
Mozilla/5.0 (Linux; Android 7.1.1; G8231 Build/41.2.A.0.219; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/59.0.3071.125 Mobile Safari/537.36
HTC One X10
Mozilla/5.0 (Linux; Android 6.0; HTC One X10 Build/MRA58K; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/61.0.3163.98 Mobile Safari/537.36
Apple iPhone XR (Safari)
Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0 Mobile/15E148 Safari/604.1
Apple iPhone XS (Chrome)
Mozilla/5.0 (iPhone; CPU iPhone OS 12_0 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) CriOS/69.0.3497.105 Mobile/15E148 Safari/605.1
Apple iPhone X
Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1
Apple iPhone 8
Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.34 (KHTML, like Gecko) Version/11.0 Mobile/15A5341f Safari/604.1
Microsoft Lumia 650
Mozilla/5.0 (Windows Phone 10.0; Android 6.0.1; Microsoft; RM-1152) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Mobile Safari/537.36 Edge/15.15254
Samsung Galaxy Tab S3
Mozilla/5.0 (Linux; Android 7.0; SM-T827R4 Build/NRD90M) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.116 Safari/537.36
Windows 10 (Edge)
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.135 Safari/537.36 Edge/12.246
Mac OS (Safari)
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_2) AppleWebKit/601.3.9 (KHTML, like Gecko) Version/9.0.2 Safari/601.3.9
Windows 7 (Chrome)
Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.111 Safari/537.36
Linux (Firefox)
Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:15.0) Gecko/20100101 Firefox/15.0.1
هر سروری از هر نوع پلتفرمی که باشه میتونه این User-Agent رو بخونه و متن داخلش رو پردازش کنه، فرضا بفهمه چه نرم افزاری است یا سیستم عاملش چیه، نسخه اش قدیمی است یا جدید و ...
نیازی هم نیست در سمت سرور باشه، در کد سمت کلاینت هم همینکار رو میشه کرد.
فرضا در Javascript با navigator.userAgent میشه این رشته رو دریافت کنیم :
<script> document.write(navigator.userAgent); </script>
هر مرورگر اینترنتی متعارفی در مشخصاتی که موقع درخواست میفرسته این User-Agent رو میفرسته، مگر اینکه فرضا ازش بخواهید که نسخه Desktop رو نشون بده که اون موقع مرورگر وانمود میکنه که یک مرورگر تحت Desktop ئه، یعنی User-Agent تقلبی میفرسته.
دیدید که بعضی سایت ها وقتی با یک مرورگر خاص یا نسخه قدیمی واردشون میشید بهتون پیام میدن که مرورگر تون رو تغییر بدید؟ اونها هم معمولا به همین ترتیب با کد JavaScript محتویات User-Agent رو بررسی می کنند تا دنبال کلمات کلیدی خاصی که مربوط به اون مرورگر ئه بگردند.
اونها بعد پردازش User-Agent تصمیم میگیرند که در صفحه چه JavaScript هایی اجرا بشه، چه CSS هایی اعمال بشه و ... به این ترتیب میتونند وضعیت صفحه وب رو برای پلتفرم های مختلف تغییر بدن.