Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Hæ Habr!

Í þessari grein mun ég segja þér hvernig þú getur auðveldlega og einfaldlega hýst kyrrstæða vefsíðu með Yandex tækni, þ.e Object Bílskúr.

Að lokum munt þú hafa vefhýst vefsíðu sem verður aðgengileg með ytri hlekk.

Þessi grein mun vera gagnleg ef þú

  • Byrjandi verktaki sem er bara að læra að forrita;
  • Framkvæmdaraðili sem hefur búið til eignasafn og vill setja það í almenning til að sýna það vinum og vinnuveitendum.

Um mig

Nýlega var ég að þróa SaaS þjónustu, eins konar markaðstorg þar sem fólk finnur sér íþróttaþjálfara fyrir einkaþjálfun. Notaði Amazon Web Services stafla (hér eftir nefndur AWS). En því dýpra sem ég kafaði í verkefnið, því fleiri blæbrigði lærði ég um mismunandi ferla við að skipuleggja gangsetningu.

Ég lenti í eftirfarandi vandamálum:

  • AWS var að eyða miklum peningum. Eftir að hafa unnið í 3 ár í Enterprise fyrirtækjum, venst ég gleði eins og Docker, Kubernetes, CI/CD, blágrænan uppsetningu og, sem upprennandi gangsetning forritari, vildi ég innleiða það sama. Fyrir vikið komst ég að þeirri niðurstöðu að AWS neytt 300-400 dollara á mánuði. Kubernetes reyndust dýrust, um 100 kall, með lágmarkslaun einn klasa og einn hnút.
    PS Það er engin þörf á að gera þetta í byrjun.
  • Næst, þegar ég hugsaði um lagalegu hliðina, lærði ég um lög 152-FZ, sem sagði eitthvað á borð við eftirfarandi: "Persónuupplýsingar ríkisborgara Rússlands verða að vera geymdar á yfirráðasvæði Rússlands", annars sektir, sem ég vildi ekki. Ég ákvað að taka á þessum málum áður en það kæmi til mín að ofan :).

Innblásin greinar um að flytja innviði frá Amazon Web Services til Yandex.Cloud, ákvað ég að rannsaka Yandex stafla nánar.

Fyrir mig voru helstu eiginleikar Yandex.Cloud eftirfarandi:

Ég rannsakaði aðra keppendur þessarar þjónustu, en á þeim tíma var Yandex að vinna.

Ég hef sagt þér frá sjálfum mér, svo við getum byrjað á málum.

Skref 0. Undirbúðu síðuna

Í fyrsta lagi þurfum við vefsíðu sem við viljum setja á internetið. Þar sem ég er Angular forritari mun ég búa til einfalt SPA forritasniðmát sem ég mun síðan setja á netið.

PS Hver skilur Angular eða veit um skjöl þess https://angular.io/guide/setup-local, fara til Skref 1.

Við skulum setja upp Angular-CLI til að búa til SPA síður í Angular:

npm install -g @angular/cli

Við skulum búa til Angular forrit með eftirfarandi skipun:

ng new angular-habr-object-storage

Næst skaltu fara í forritamöppuna og ræsa hana til að athuga virkni þess:

cd angular-habr-object-storage
ng serve --open

Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Forritið hefur verið búið til en er ekki enn tilbúið til hýsingar. Við skulum setja forritið saman í litla byggingu (framleiðsla) til að fjarlægja alla óþarfa hluti og skilja aðeins eftir nauðsynlegar skrár.
Í Angular geturðu gert þetta með eftirfarandi skipun:

ng build --prod

Sem afleiðing af þessari skipun birtist mappa í rót forritsins dist með heimasíðunni okkar.

Virkar. Nú skulum við halda áfram að hýsingu.

Skref 1.

Við skulum fara á síðuna https://console.cloud.yandex.ru/ og smelltu á hnappinn „Tengjast“.

Ath:

  • Til að nota Yandex þjónustuna gætir þú þurft Yandex póst (en þetta er ekki víst)
  • Fyrir sumar aðgerðir þarftu að leggja peninga inn á reikninginn þinn á persónulegum reikningi þínum (að lágmarki 500 rúblur).

Eftir árangursríka skráningu og heimild erum við á persónulegum reikningi þínum.

Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Næst til vinstri í valmyndinni þarftu að finna „Object Storage“ þjónustuna sem við munum nota til að hýsa síðuna.

Í stuttu máli sagt:

  • Object Storage er skráageymsla sem er samhæf við svipaða AWS S3 tækni Amazon, sem hefur einnig sitt eigið API til að stjórna geymslu úr kóða og, eins og AWS S3, er hægt að nota til að hýsa kyrrstæða síðu.
  • Í Object Storage búum við til „fötu“ (fötur), sem eru aðskilin geymslusvæði fyrir skrárnar okkar.

Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Við skulum búa til einn af þeim. Til að gera þetta skaltu smella á hnappinn „Búa til fötu“ í þjónustuborðinu.

Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Eyðublaðið til að búa til fötu hefur eftirfarandi reiti, við skulum fara í gegnum þá:

  • Nafn fötu. Til einföldunar skulum við kalla verkefnið það sama og Angular - angular-habr-object-storage
  • Hámark stærð. Við veðjum eins mikið og síðan okkar vegur, þar sem síðan er ekki geymd ókeypis og fyrir hvert úthlutað gígabæti munum við greiða Yandex ansi eyri.
  • Aðgangur að leshlutum. Við stillum það á „Public“, þar sem notandinn verður að fá hverja skrá af kyrrstæðu síðunni okkar svo hægt sé að teikna útlitið rétt á hana, vinna úr skriftum o.s.frv.
  • Aðgangur að lista yfir hluti og Aðgangur til að lesa stillingar. Skildu það eftir sem "takmarkað". Þetta er nauðsynlegt til að nota fötuna sem innri skráargeymslu fyrir forrit.
  • Geymsluflokkur. Skildu það eftir sem "Staðlað". Þetta þýðir að síða okkar verður oft heimsótt og því verða skrárnar sem mynda síðuna oft sóttar. Auk þess hefur hluturinn áhrif á frammistöðu og greiðslu (setja inn tengil).

Smelltu á „Búa til fötu“ og fötuna er búin til.

Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Nú þurfum við að setja síðuna okkar í fötuna. Auðveldasta leiðin er að opna möppu í nágrenninu dist síðuna okkar og dragðu hana beint á síðuna með því að nota handföng. Þetta er þægilegra en að smella á hnappinn „Hlaða hlutum“, því í þessu tilfelli eru möppurnar ekki fluttar og þú verður að búa þær til handvirkt í réttri röð.

Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Þannig að síðan er hlaðið inn í geymsluna, svo við getum veitt notendum tækifæri til að fá aðgang að geymslunni sem vefsíðu.
Til að gera þetta, vinstra megin í valmyndinni, smelltu á flipann „Vefsíða“.

Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Á síðunni til að setja upp fötu sem síðu skaltu velja flipann „Hýsing“. Hér tilgreinum við aðalsíðu síðunnar, venjulega index.html. Ef þú ert með SPA umsókn, þá eru líklega allar villur einnig unnar á aðalsíðunni, svo við munum einnig gefa til kynna index.html á villusíðunni.

Við sjáum strax hvaða hlekk vefsíðan okkar verður aðgengileg í gegnum. Smelltu á vista.

Eftir um það bil 5 mínútur, með því að smella á hlekkinn, sjáum við að síðan okkar er nú aðgengileg öllum.

Hvernig á að hýsa kyrrstæða vefsíðu með Yandex.Cloud Object Storage

Takk allir sem lásu til enda! Þetta er fyrsta greinin mín; Ég ætla að lýsa frekari Yandex þjónustu og samþættingu þeirra við framenda- og bakendatækni.

Skrifaðu í athugasemdirnar hversu áhugasamur þú hefur um að fræðast um aðra Yandex þjónustu eða um notkun Angular í nútímaþróun.

Heimild: www.habr.com

Bæta við athugasemd