Hoe het Hosten van een Website van S3

0
212

De kans is groot, dat u er waarschijnlijk geen behoefte aan een volledige web-server, zoals NGINX uitgevoerd op EC2 om uw website up and running. Als je gewoon op zoek bent voor het hosten van een statische website, kunt u de inhoud van alle S3, en host van daar.

Wacht, ik heb het niet Nodig is een Server?

Als uw website maakt geen gebruik van server-side processing (zoals PHP), het eenvoudig opslaan van de bestanden op de S3, het configureren van de emmer naar de host van de site, en wijzen met de DNS om de emmer wordt vervangen door het gebruik van NGINX of Apache.

“Server-side processing” is een veel minder breed dan het klinkt. Alleen maar omdat van uw website is het “statische” betekent niet dat het eruit ziet als een jaren 1990 GeoCities pagina, met geen JavaScript. Al die “statische” betekent is dat alle activa (HTML-pagina ‘ s, JS code, CSS stylesheets) niet veranderen in reactie op verzoeken. Met talen als PHP, alle de verwerking wordt gedaan aan de server-kant; als twee gebruikers hun profiel pagina van de server sturen ze naar verschillende pagina ‘ s. Dit kan niet worden gedaan op de S3, dus als je met behulp van PHP, je hebt om een echte web-server. Dit met name geldt voor WordPress, die gebruik maakt van PHP om inhoud.

Echter, het steeds vaker voor dat websites worden groot JavaScript-toepassingen. Met een framework zoals Reageren, dat alles moet worden geleverd, is een bundle.js -bestand. Het is de taak van de client, niet op de server, het uitvoeren van dit bestand en start de applicatie. Apps zoals deze kunnen worden gehost op S3 met geen problemen. Dit niet ontdoen van de backend-of—je kunt nog steeds uw app communiceren met een API-server en vraag een database, je hoeft alleen te verifiëren, verzoeken die afkomstig zijn van de opdrachtgever. Gecombineerd met AWS API Gateway en Lambda, u zou het niet zijn voor het uitvoeren van een enkele EC2 server.

Laat u niet misleiden door de eenvoudige installatie—voor kleine sites, S3 kunt knippen uw kosten naar beneden te pence op de dollar, en omdat er geen servers zorgen over te maken, het schalen perfect tot miljoenen gebruikers. U betaalt gewoon een vast bedrag voor de bandbreedte in en uit, evenals de eventuele kosten voor Lambda, RDS, of enige andere diensten die u met uw app. Zelfs voor grotere bedrijven de implementatie van productie-applicaties, hosting van S3 is een zeer haalbare en kostenbesparende optie als uw app kan ondersteunen.

S3 ondersteunt geen HTTPS voor statische websites, dat zou een dealbreaker, maar je kunt het achter CloudFront (AWS CDN), die, naast verbeterde caching en prestaties, kan gebruiken in een aangepast domein gebruiken met HTTPS. Het heeft zelfs een meer genereuze gratis tier voor het overdragen van gegevens—50 GB in plaats S3 is 1 GB.

Instellen

Voor deze tutorial, eerder dan het implementeren van eenvoudige HTML-pagina, we zullen het implementeren van de starter project van maken-reageren-app, als het beter laat S3 de ware potentieel.

Na het uitvoeren van garen bouwen, zitten we met de volgende activa in de /build map:

Deze hele map worden gekopieerd naar S3. Ga dan naar de S3 Management-Console en klik op “Maak een Emmer.”

Geef het een naam (moet uniek onder alle AWS rekeningen) in en klik op “Volgende”. U kunt op versiebeheer in de opties, maar er is niet veel anders te overwegen. Klik op “Next”.

Op het volgende scherm je wilt vinkje voor “Blokkeren van Alle Toegang van het Publiek.” Deze optie is standaard ingeschakeld om te voorkomen dat objecten in emmers wordt zichtbaar op het open internet, welke zou je emmer onbereikbaar. AWS zal een pop-up met een waarschuwing die zegt dat deze weer aan te zetten, tenzij je met “specifieke en gecontroleerd use cases”, zoals statische website hosting. Want dat is precies wat wij aan het doen bent, kunt u dit negeren.

Klik op “Create” op de emmer, en open ze.

U kunt handmatig sleep de inhoud van uw HTML map in de emmer, maar een betere methode is het gebruik van de AWS CLI te synchroniseren van de gehele map omhoog naar je emmer. De opdracht is vrij simpel:

aws s3 sync . s3://emmer-naam

Nu, ziet u de map met inhoud in de emmer:

Zodra alles is gesynchroniseerd, kunt u de emmer te laten hosting van de website. Op het tabblad eigenschappen, gebruik maken van de “Statische Website Hosting” optie, en selecteer je index bestand. U kunt ook kiezen voor een fout bestand te zien gebruikers een meer gepersonaliseerde 404.

Deze draait op statische website hosting, maar niet expliciet verlenen lees-toegang. Om dat te doen, moet u deze toevoegen in de volgende emmer beleid onder Machtigingen > Bucket-Beleid:

{
“Versie”:”2012-10-17″,
“Verklaring”:[{
“Sid”:”PublicReadGetObject”,
“Effect”:”Toestaan”,
“Opdrachtgever”: “*”,
“Actie”:[“s3:GetObject”],
“Bron”:[“arn:aws:s3:::voorbeeld-emmer/*”
]
}
]
}

Dit zal pop-up een waarschuwing vertelt u dat de publieke toegang is ingeschakeld. Kan je weer negeren dit.

De emmer wordt nu zichtbaar vanaf het volgende eindpunt:

http://BUCKET-NAME.s3-website.REGION.amazonaws.com/

Geweldig! Alles werkt goed. De klant vraagt de emmer, die dient de index.html bestand downloaden van alle benodigde JS en CSS-activa, en maakt dat de spinnen Reageren logo.

Echter, dit eindpunt duidelijk niet zo gebruiksvriendelijk, waardoor u waarschijnlijk wilt configureren van een eigen domein voor uw S3 site. De eenvoudigste methode is het gebruik van CloudFront te verzoeken, dat is de enige manier om de ondersteuning van HTTPS hoe dan ook. Als u geen gebruik wilt maken van CloudFront, kunt u een aangepast domein gebruiken Route 53 alias aan uw emmer standaard eindpunt.

Ga dan naar de CloudFront Console. Selecteer dan “Distributie” en kies “Internet” als type. Op het volgende scherm onder “Oorsprong van de Domeinnaam,” selecteer je S3 bucket uit de vervolgkeuzelijst. Zorg ervoor dat je ook ‘ Omleiden van HTTP naar HTTPS.”

Verder naar beneden, je wilt configureren voor uw domein. Voer je alternatieve domein naam, en selecteer “Aangepaste SSL.” Verzoek van één van ACM; het kan tot een half uur om te controleren afhankelijk van uw DNS-provider, maar als je met Route 53, kunt u controleren of de record automatisch binnen een paar minuten.

Klik daarna op “Maak Distributie” aan de onderkant, en wacht u ongeveer 15 minuten voor CloudFront om alles geregeld. Eenmaal gedaan, u zult in staat zijn om een bezoek aan uw eigen domeinnaam, en zie je de app geserveerd, rechtstreeks uit de S3.

Als u wilt maken van versie beheer te vergemakkelijken, kunt u een automatische implementatie pijplijn met AWS CodePipeline. Kies simpelweg de implementatie tot de S3, en AWS zal het implementeren van de broncode updates automatisch, waaronder het bouwen van artefacten.