een statische website maken met Amazon S3

Amazon Simple Storage Service (S3) is een webdienst die door Amazon Web Services (AWS) wordt aangeboden voor de opslag van en toegang tot objecten via het internet. S3 biedt websites, webdiensten en mobiele toepassingen de mogelijkheid om gegevens te uploaden en op te slaan op zijn servers in de Verenigde Staten. Het werkt over HTTP/S met op TCP gebaseerde protocollen. Het gebruik van S3 is gratis voor zowel put-operaties (opslag) als GET-verzoeken (ophalen).

Het openen van een emmer om voorwerpen te ontvangen of op te slaan vereist niet alleen een speciale encryptiesleutel, maar ook een gedeelde sleutel die door Amazon wordt verstrekt nadat het account is aangemaakt. Gebruikers kunnen zich gratis aanmelden voor een account dat elke maand 5 GB opslagruimte biedt, zonder limiet op de hoeveelheid die in emmers kan worden opgeslagen.

Amazon S3 biedt 99.999999999% duurzaamheid, waarbij de gegevens over meerdere faciliteiten worden opgeslagen voor redundantie. Amazon S3 gebruikt dezelfde replicatietechnologie die Amazon gebruikt om de beschikbaarheid van gegevens van zijn eigen site te garanderen. De dienst probeert de doorvoer en de kosten te optimaliseren op basis van de gebruikte toepassing en de hoeveelheid opgeslagen gegevens, terwijl bescherming wordt geboden tegen verlies van gegevens.

Er zijn ook functies waarmee gebruikers analyses kunnen bekijken over hoeveel gegevens via S3 worden geüpload of gedownload, kunnen controleren hoeveel bandbreedte wordt gebruikt, of gebruik kunnen maken van oplossingen voor mobiele toepassingen. Amazon S3 is via het Internet gratis beschikbaar voor de gebruikers. De gegevensoverdrachtsnelheden zijn onbeperkt. Gegevens kunnen overal vandaan worden opgehaald in minder dan 1 seconde met lage latentie, wat bijna real-time toegang tot bronnen mogelijk maakt. Het elimineert ook hostingkosten en capaciteitsplanning door een alternatieve cloud opslagmogelijkheid te bieden die geen voortdurende kapitaalinvestering vereist om bronnen te hosten.

Amazon S3 ondersteunt objecten van elk type, grootte en formaat. Objecten kunnen in elke emmer opgeslagen worden maar moeten toegankelijk zijn via de naam van het object. Gebruikers kunnen bestanden en mappen van eigen en openbare systemen uploaden via HTTP of HTTPS naar emmers die de integratie van NFS (Network File System) of POSIX bestandssysteem functies ondersteunen. Gebruikers hebben directe controle over wie toegang heeft tot hun emmers door tot 70 GB opslagruimte te delen met een andere gebruiker (aangemaakt via AWS) die een account op Amazon S3 heeft.

Het maken van een website kan een ontmoedigende taak zijn. Er zijn zoveel opties en keuzes te maken dat je gemakkelijk overweldigd raakt. Maar wat als je een website kon maken zonder je zorgen te hoeven maken over hosting, domeinnamen, of het opzetten van een server? Met Amazon S3 kun je gemakkelijk een statische website maken met niets anders dan je computer en een internetverbinding. In dit blogbericht laten we je zien hoe je je eigen statische website kunt opzetten met Amazon S3. We bespreken ook enkele van de voordelen van Amazon S3 voor je website. Dus laten we aan de slag gaan!

Vereisten

Om een statische website te maken met behulp van Amazon S3 heb je nodig:

  • Een Amazon AWS account om je website op Amazon S3 te configureren. Deze demo gebruikt de Free tiered Amazon account, die gratis is en alleen de enorme voordelen heeft in combinatie met een Amazon S3 statische website.

Wat zullen we doen?

In deze gids maken en configureren we een eenvoudige statische website met Amazon S3. We doorlopen ook de configuratie van die statische website met een aangepaste foutpagina. Deze gids laat je zien hoe je een HTML, CSS, JavaScript website kunt maken die gemakkelijk te onderhouden en zeer kosteneffectief is.

Een statische website is een website die alleen uit statische pagina’s bestaat. Hij bevat geen server-side scripting taal zoals php, asp of nodejs. Hij bestaat slechts uit één html bestand waarin alle webpagina’s worden opgeslagen. Statische website hosting is niet nieuw, het bestaat al heel lang.

Door een statische site te gebruiken, heb je geen last van hackers en hoef je alleen maar webpagina’s te kunnen serveren. In combinatie met Amazon S3 zijn de kosten minuscuul, zo’n een of twee dollar per site. Je kunt dan van daaruit je webpagina’s schalen om aan de behoeften van je publiek met miljoenen lezers te voldoen.

Wat zullen we doen?

Om een statische website te hosten, maak je een Amazon S3 emmer aan.

Wat zullen we doen

En upload dan je inhoud naar die emmer.

Wat zullen we doen

Openbare leestoegang van je S3 emmer moet opzettelijk zijn. Het is belangrijk dat iedereen overal de emmer kan lezen. En we bespreken dit later in deze gids, waar we het emmerbeleid bekijken.

Wat zullen we doen

De website is dan beschikbaar op het AWS S3 eindpunt, dat er ongeveer zo uit zal zien als de URL hieronder.

Wat zullen we doen

We hebben een link naar de GitHub repository waar je alle bestanden zult downloaden en gebruiken die nodig zijn om deze stap-voor-stap gids te voltooien. Ben je er klaar voor? Goed. Je kunt verder gaan en inloggen op je AWS Console.

Wat zullen we doen

Een S3 emmer maken

Voor je je statische website kunt maken, moet je eerst een S3 emmer maken en configureren. Als je je statische website maakt met Amazon S3, wordt je site in die emmer opgeslagen.

1.Navigeerop jeAWS Console naar S3 dashboard —> Emmermaken.

navigeer naar S3

Een S3 emmer maken

2. Geef een unieke emmernaam(my-howtoforge-bucket-7Vftzchzw). Zorg ervoor dat je emmernaam uniek is. Emmernamen mogen alleen kleine letters, cijfers en koppeltekens bevatten. De S3 emmernaam moet uniek zijn over heel Amazon S3 om te voorkomen dat iemand anders een emmer met dezelfde naam maakt en je website overschrijft. Ook moet je pad DNS-compliant zijn, want geen twee domeinen mogen dezelfde naam hebben.

Een S3 emmer maken

3. Schakel het selectievakjeBlokkeer alle publieke toeganguit . Als je je website privé wilt houden, selecteer je dit selectievakje. Als het geselecteerd is, kunnen alleen geauthenticeerde AWS accounts je website benaderen.In dit geval zullen we dit selectievakje uitzetten om ons voorbeeld openbaar te maken. Zo kan iedereen onze html bestanden uit de S3 emmer halen, en onze webpagina bekijken. Schakel het selectievakjeI acknowledge that the current settings… in.

Een S3 emmer maken

4. Klik onderaan de pagina op Emmer maken.

Maak emmer

5. Je krijgt een groen bericht met de tekst“Successfully created bucket” met de gegevens van je nieuwe S3 emmer. Klik op je emmernaam —> ARN kopiëren. Amazon Resource Name (ARN) is een unieke identificatie voor een AWS bron. Wanneer je een S3 emmer maakt, genereert Amazon een unieke ARN voor de nieuwe emmer. Om er zeker van te zijn dat je AWS bronnen veilig zijn, vereist Amazon dat je ofwel je eigen unieke identifiers gebruikt, ofwel door Amazon gegenereerde identifiers bij het maken of wijzigen van bronnen. Je zult deze ARN gebruiken om je emmer bij te houden en je statische website te maken.

Een S3 emmer maken

6. Klik opUpload —> Bestanden toevoegen —> Selecteer de bestanden die je eerder hebt gedownload —> Upload.

Een S3 emmer maken

Het uploaden van je website is het gemakkelijkste deel van het opzetten van een statische site met Amazon S3. Het kan een paar minuten duren voor het uploadproces klaar is. Als het klaar is, zie je de groene melding Succeeded.

Een S3 emmer maken

Inschakelen van je statische website hosting

Nu je website naar Amazon S3 geüpload is, moet je je website inschakelen zodat hij bekeken kan worden. Met statische website hosting kun je statische HTML, CSS en JavaScript pagina’s serveren vanaf een webserver die voor statische inhoud ontworpen is. Het is kostenefficiënter dan dynamische webpagina’s (b.v. PHP of ASP).

Statische website hosting kan gebruikt worden om verschillende soorten bestanden te serveren, zoals afbeeldingen, CSS, JS en andere statische bestanden. Deze bestanden veranderen niet zo vaak en kunnen gemakkelijk en tegen lage kosten geserveerd worden.

1. Klik opEigenschappen —>Statische website hosting —> Bewerken —> Inschakelen.

Een S3 emmer maken

Schakel Statische Website Hosting in

2. Klik opInschakelen —>KiesHosting type als Host een statische website. Vul hetIndex document in alsindex.html, Fout document als error.html.Scroll naar beneden, en klik op Wijzigingen opslaan.

Als je website hosting inschakelt, moet je een index document uploaden. Het index document is het eerste bestand dat gebruikers zien als ze je website benaderen via de hoofddomeinnaam, bijvoorbeeld http://my-bucket.s3.amazonaws.com/.

Als je geen indexdocument aanmaakt, of het later verwijdert, geeft Amazon S3 ofwel een 404 foutpagina of een standaard indexbestand. Het standaard indexbestand kan de emmernaam weergeven, de datum van laatste toegang, en andere algemene informatie. De naam van het indexdocument is hoofdlettergevoelig en moet precies overeenkomen met de naam van het indexdocument dat je naar de site root uploadt, dus zorg ervoor dat de naam van je indexdocument correct gespeld is.

Het Error document is de pagina die gebruikers te zien krijgen als er een fout optreedt terwijl ze je website proberen te bezoeken. Dit bestand is optioneel maar aanbevolen. Als je geen eigen foutdocument uploadt, geeft Amazon S3 ofwel een standaard 404 foutpagina of het index document, als dat bestaat. De naam van het foutdocument is ook hoofdlettergevoelig, dus zorg ervoor dat de naam van het foutdocument dat je uploadt correct gespeld is.

Schakel Statische Website Hosting in

Schakel Statische Website Hosting in

3. Je krijgt een groen Bewerkte statische website hosting in het AWS S3 paneel als je statische website hosting voor je emmer met succes inschakelt. Je ziet ook het emmereindpunt van je site. Het is je emmernaam, gevolgd door s3.website.yourregion.amazonaws.com.

Schakel Statische Website Hosting in

4.Open die URL in je favoriete browser, je krijgt een 403 Forbidden boodschap. Dat komt omdat het juiste beleid niet is toegewezen. We zullen een juist beleid instellen voor toegang tot je emmer in de volgende stap.

Schakel Statische Website Hosting in

Instellen van het juiste emmerbeleid

Nu je je website hosting op Amazon S3 hebt ingeschakeld, moet je een bucket policy instellen om er toegang toe te krijgen. Een Bucket Policy is een set toestemmingen voor toegang tot een Amazon S3 emmer. Om je website vanuit het publiek te kunnen benaderen, moet je een Bucket Policy toevoegen om het publiek toegang te geven tot je emmer.

1. Klik in je S3 dashboard op het tabblad Machtigingen —> Bewerken.

Een juist emmerbeleid instellen

2. Kopieer en plak de regels uit dit JSON bestand in de JSON editor. Vervang<BUCKET_ARN> door de eigenlijke ARN die je eerder bewaarde.

  • Versie: 2012-10-17 is de versie van het emmerbeleid.
  • Verklaring: PublicReadGetObject is de actie die uitgevoerd moet worden op alle objecten in de opgegeven emmer.
  • Principal: Het Principal element specificeert de AWS account, IAM gebruiker, of groep die de gespecificeerde actie op het object mag uitvoeren. Als er meerdere principals in de verklaring zijn geïdentificeerd, dan moet je specificeren welke principals ‘Actie mogen uitvoeren’ door het Action element op Allow of Deny te zetten.
  • Actie: Het Actie element specificeert de soort toegang die is toegestaan.
  • Resource: Het Resource element specificeert het object waarop de toestemmingen worden toegepast.
  • In dit geval stellen we een PublicReadGetObject regel in die iedereen toegang geeft tot je emmer en elk object(s3:GetObject) in de emmer kan oppikken. Vandaar de asterisk * in de Hoofdregel. De sterretjes * in de Hulpbron geven aan dat het S3 Bucket Policy geldt voor alle objecten in de emmer. Zorg ervoor dat na het bewerken van het beleid de asterisk aan het eind staat zoals getoond.

Een juist emmerbeleid instellen

3. Klik op Save Changes als je klaar bent.

Een juist emmerbeleid instellen

Nu is je emmer openbaar toegankelijk, zoals hieronder te zien is. Je ziet dat je beleid onmiddellijk van kracht wordt.

Een juist emmerbeleid instellen

Je statische webpagina testen

Nu je je Bucket Policy ingesteld hebt, kun je je statische webpagina’s bekijken door deEndpoint URL in je browser te openen.

1. Navigeer terug naar je browser waar je eerder de S3 Bucket Endpoint URL opende. Herlaad de S3 emmer eindpunt URL, en deze keer zou je moeten zien dat de 404 Fout verdwenen is. Als je de 404 fout ziet betekent dit dat er iets mis is met je emmerbeleid. Je statische webpagina’s worden in de browser getoond, zoals hieronder. Je zou nu een mooi opgemaakte HTML versie van je pagina moeten zien.

Je statische webpagina testen

2. Je kunt de fout webpagina ook testen door naar een niet-bestaande URL te gaan, de eerder geüploade fout webpagina zou nu moeten verschijnen, zoals hieronder.

Je statische webpagina testen

Conclusie

In deze gids hebben we behandeld hoe je je statische websites gratis kunt hosten op Amazon S3. Deze gids behandelde ook het hele proces van het uploaden van de website, het instellen van het juiste emmerbeleid en het inschakelen van statische website hosting. Deze gids is een eenvoudige manier om gratis en tegen lage kosten een website te hosten. De kosten die Amazon S3 rekent zijn erg laag in vergelijking met andere diensten.

Heeft dit artikel je geholpen? Was het gemakkelijk te begrijpen? Je kunt je mening delen door hieronder een reactie achter te laten. Met deze pas opgedane kennis onder de knie kun je nu het inzetten van statische websites op Amazon S3 automatiseren.