Kaip naudoti perrašymo direktyvą iš „Nginx“ modulio

Kiekviena naršyklė turi savo antspaudąDėl šios priežasties mūsų svetainėje galėsime nustatyti, iš kur gaunama užklausa ir iš kurios naršyklės ji buvo pateikta, kaip žinome, „Internet Explorer“ naršyklė visada kėlė galvos skausmą žiniatinklio kūrėjams (nors pastaruoju metu patobulintas), nes mes galėsime jus identifikuoti ir parodysime alternatyvias taisykles, kaip išspręsti šias mažas problemas.

Už tai, kad tarnaujate mums?Įsivaizduokite, kad turime tokią svetainę kaip „Facebook“, į kurią kasdien įeina milijonai žmonių, tačiau ne visi tai daro iš to paties tipo įrenginių, yra žmonių, kurie įeina iš savo stalinio kompiuterio, kiti iš planšetinio kompiuterio, kiti iš savo mobiliojo telefono, ir kt. Kiekvienas įrenginys turi naršyklę (arba kelias) ir turi agentą, jei galime jį identifikuoti, galime tinkamai pateikti turinį, nes ekranas ne visiems vienodas, kiekvienas įrenginys bus matomas vienaip, ir kiekviena naršyklė gali skirtingai interpretuoti taisykles (nors tai vis mažėja).

Aptarėme, kad kiekviena naršyklė turi agentą, kuris leidžia mums jį identifikuoti, žemiau pateikiame trumpą informaciją „JavaScript“ kodas naršyklės agentui gauti kur jis naudojamas:

 Gaukite vartotojo agentą 

Dėl patogumo scenarijaus kodas buvo įterptas į HTML. Jei atidarome ankstesnį kodą „Google Chrome“ naršyklėje, matome tai:

DIDELIS

O jei dabar tai padarysime „Internet Explorer“:

DIDELIS

Patvirtinote, kad jis buvo atidarytas iš „Windows“, kad būtų galima nufotografuoti 2 ankstesnius vaizdus. Jei atidarysime jį iš „Mozilla Firefox“ „Linux“, matysime šiuos dalykus:

Jei norite kodo serverio kalba, toliau pateikiamas kodas kaip gauti agentą PHP, atminkite, kad „JavaScript“ vartotojas gali ją išjungti:

Dabar pereisime prie to, kas mus labiausiai domina, todėl pradėsime žiūrėdami pavyzdį to, ką iki šiol aptarėme su savo puslapiu: „Solvetic“.

„Solvetic“ tikrinimas

Jei įvesime „Solvetic“ iš savo kompiuterio, naudodami „Google Chrome“ naršyklę pamatysime šį aspektą, užbaigtą, iš pirmo žvilgsnio matome viską plačiai, sritį prisijungti ir užsiregistruoti:

Bet jei įeiname iš „Google Chrome“ į „Android“ mobilųjį telefoną, žinoma, ne visas turinys patenka į ekraną, į tai reikia atsižvelgti, nėra labai malonu slinkti pirštu, kad pamatytumėte ekranas (šiandien, laimei, keletas svetainių yra tokios), žemiau palieku vaizdą, kaip „Solvetic“ atrodo mobiliajame telefone:

Kaip matome, jis prisitaiko prie ekrano, dabar meniu turime viršuje, jei spustelėsime kairę pusę (3 juostas), pamatysime parinktis pereiti prie straipsnių, vadovėlių ir kt.

Ir jei spustelėsime dešinėje esančią piktogramą (įjungimo / išjungimo mygtuko aspektas), turėsime galimybę prisijungti arba užsiregistruoti.

Dabar mes pamatysime būdą, kaip būtų galima pateikti puslapį, atsižvelgiant į mus aplankantį įrenginį.

Kaip pasiekti rezultatą?

Yra keletas būdų, kaip pasiekti šį rezultatą, yra scenarijų, kurie dedami tiesiai į programą, arba mes taip pat turime sistemas, tokias kaip „Bootstrap“, tačiau taip pat galime pasiekti panašų rezultatą iš „Nginx“, nes atpažinę naršyklės agentą galime atlikti perrašymą ir nusiųskite vartotojui į kitą programos dalį, nepakeisdami jo matomo URL.

Jei norite sužinoti „Nginx“, paliekame žemiau esančią nuorodą, kur taip pat galite ją atsisiųsti:

Norėdami tai pasiekti, pirmiausia turime identifikuoti naršyklės agentą, jei norime įvesti taisyklę, mes naudojame paprastą sąlygą ir jai taikome taisyklę, visa tai darome savo vietos bloke.

Norėdami tai pasiekti, pažvelkime į šį kodo pavyzdį, kad pamatytumėte, kaip jis trumpas:

 vieta/{if ($ http_user_agent ~ * '(iPhone | iPod)') {perrašyti ^. + http://m.example.com/$uri; }}}

Kaip matome kode, mes identifikuojame naršyklės agentą, jei jis atitinka tą, kurį mes paskyrėme (šiuo atveju „iPhone“ ar „iPod“), mes perrašome, tai galima padaryti taip plačiai ar konkrečiai, kaip to reikalauja mūsų logika. pavyzdį lengviau suprasti tik su viena sąlyga.

Kaip matome, naršyklės agentą atpažinti yra gana paprasta ir dar lengviau tai panaudoti savo naudai, kaip jau minėjome anksčiau, kad turėtume aiškiai įsivaizduoti, ką norime padaryti, kad galėtume naudoti įrankius ir gauti norimą naudą.

Baigdami pamoką, pakomentuokite, kad naudodami interaktyvų dizainą pasieksite, kad jūsų tinklalapio išvaizda prisitaikys prie įrenginių ekrano be jokių papildomų komplikacijų.