Katrai pārlūkprogrammai ir savs zīmogsPateicoties tam, mūsu vietnē mēs varēsim noteikt, no kurienes nāk pieprasījums un no kuras pārlūkprogrammas tas ir veikts, kā mēs labi zinām, pārlūkprogramma Internet Explorer vienmēr ir radījusi galvassāpes tīmekļa izstrādātājiem (lai gan pēdējā laikā uzlabota), jo mēs varēsim jūs identificēt un parādīt alternatīvus noteikumus šo mazo problēmu risināšanai.
Par kalpošanu mums?Iedomājieties, ka mums ir tāda vietne kā Facebook, kur katru dienu ienāk miljoniem cilvēku, tomēr ne visi to dara no viena veida ierīcēm, ir cilvēki, kuri ienāk no sava galddatora, citi no planšetdatora, citi no mobilā, utt. Katrai ierīcei ir pārlūkprogramma (vai vairākas), un tai ir aģents, ja mēs to varam identificēt, mēs varam apkalpot saturu atbilstošā veidā, jo displejs nav vienāds visiem, katra ierīce būs redzama vienā veidā, un katrs pārlūks var interpretēt noteikumus atšķirīgi (lai gan tas kļūst arvien zemāks).
Mēs esam apsprieduši, ka katrai pārlūkprogrammai ir aģents, kas ļauj mums to identificēt, zemāk ir īss JavaScript kods, lai iegūtu pārlūkprogrammas aģentu kur to lieto:
Iegūstiet lietotāja aģentuĒrtības labad skripta kods ir ievietots HTML. Atverot iepriekšējo kodu pārlūkprogrammā Google Chrome, mēs redzam sekojošo:
PALIELINĀT
Un ja mēs to tagad darām pārlūkprogrammā Internet Explorer:
PALIELINĀT
Jūs esat pārliecinājies, ka tas tika atvērts no Windows, lai uzņemtu 2 iepriekšējos attēlus. Ja mēs to atveram no pārlūkprogrammas Mozilla Firefox operētājsistēmā Linux, mēs redzam sekojošo:
Ja vēlaties kodu servera valodā, tālāk ir redzams kods kā iegūt aģentu PHP, atcerieties, ka lietotājs JavaScript var to atspējot:
Tagad mēs pāriesim pie tā, kas mūs visvairāk interesē, un vispirms mēs apskatīsim piemēru tam, ko līdz šim esam apsprieduši ar mūsu lapu: Solvetic.
Solvetic pārbaude
Ja ievadīsim Solvetic no sava datora, izmantojot pārlūkprogrammu Google Chrome, mēs redzēsim šādu aspektu, pilnīgu, īsumā redzēsim visu plašo, apgabalu, kurā pieteikties un reģistrēties:
Bet, ja mēs ieejam pārlūkprogrammā Google Chrome, izmantojot Android mobilo tālruni, protams, ne viss saturs tiek parādīts ekrānā, tas ir jāņem vērā, nav ļoti patīkami slīdēt ar pirkstu, lai redzētu ekrāna daļas. ekrānā (mūsdienās, par laimi, dažas vietnes ir šādas), zemāk es atstāju attēlu, kā Solvetic izskatās mobilajā ierīcē:
Kā redzam, tas pielāgojas ekrānam, tagad mums ir izvēlnes augšpusē, noklikšķinot uz kreisās puses (3 joslas), mēs redzēsim iespējas pāriet uz rakstiem, apmācībām utt.
Un, ja mēs noklikšķinām uz ikonas labajā pusē (ieslēgšanas / izslēgšanas pogas aspekts), mums ir iespējas pieteikties vai reģistrēties.
Tagad mēs redzēsim veidu, kā panākt lapas apkalpošanu atkarībā no ierīces, kas mūs apmeklē.
Kā sasniegt rezultātu?
Ir vairāki veidi, kā sasniegt šo rezultātu, ir skripti, kas tiek ievietoti tieši lietojumprogrammā, vai arī mums ir sistēmas, piemēram, Bootstrap, taču mēs varam sasniegt līdzīgu rezultātu arī no Nginx, jo, atpazīstot pārlūkprogrammas aģentu, mēs varam pārrakstīt un nosūtīt lietotājam uz citu lietojumprogrammas daļu, nemainot redzamo URL.
Ja vēlaties uzzināt Nginx, mēs atstājam saiti zemāk, kur to arī varat lejupielādēt:
Lai to panāktu, mums vispirms ir jāidentificē pārlūkprogrammas aģents, ja mēs vēlamies ievadīt kārtulu, mēs izmantojam vienkāršu nosacījumu un piemērojam noteikumu, mēs to visu darām savā atrašanās vietas blokā.
Apskatīsim šādu koda piemēra piemēru, lai to sasniegtu, un jūs varat redzēt, cik īss tas ir:
location/{if ($ http_user_agent ~ * '(iPhone | iPod)') {pārrakstīt ^. + http://m.example.com/$uri; }}}Kā mēs redzam kodā, mēs identificējam pārlūkprogrammas aģentu, ja tas atbilst mūsu izraudzītajam (šajā gadījumā iPhone vai iPod), mēs to pārrakstām, to var izdarīt tik plaši vai specifiski, cik to prasa mūsu loģika. Piemērs ir vieglāk saprotams tikai ar vienu nosacījumu.
Kā redzam, pārlūka aģentu ir diezgan viegli identificēt, un to ir vēl vieglāk izmantot mūsu labā, kā jau iepriekš minējām, mums ir jābūt skaidram priekšstatam par to, ko mēs vēlamies darīt, lai izmantotu rīkus un iegūstiet vēlamo labumu.
Lai pabeigtu apmācību, komentējiet, ka, izmantojot adaptīvu dizainu, jūs sasniegsit, ka jūsu tīmekļa lapas izskats pielāgojas ierīču ekrānam bez papildu sarežģījumiem.
