Hoe om CloudFlare Gebruiken Werknemers JavaScript uit te Voeren Op De Rand

0
157

De dichter bij de rand die u kunt uitvoeren code of data terug van een bezoeker, hoe sneller de ervaring van de gebruiker zal worden. Met dat in het achterhoofd, CloudFlare uitgebracht op een product met de naam CloudFlare Werknemers, die het mogelijk maakt draait JavaScript-code op edge-servers. Dit kunt u het onderscheppen van een aanvraag, act op dat verzoek, en het resultaat terug alle op de rand, met de potentie om nooit raak je origin server.

Dit opent een wereld van mogelijkheden, niet alleen wat betreft prestaties, maar unieke toepassingen draait bijna geheel op de rand. Het voordeel van CloudFlare de enorme infrastructuur, capaciteit en edge locaties betekent dat dit type product is een van een soort.

Natuurlijk, met een nieuwe oplossing, zoals deze, is het moeilijk om te komen met potentiële toepassingen. Hoewel er veel, wat zijn de praktische toepassingen? In dit artikel kijken we naar een mogelijke toepassing geval, dat van het uitvoeren van omleidingen direct aan de rand.

Het configureren van de CloudFlare Werknemer

Ervan uitgaande dat u al een domein dat wordt geproxied via CloudFlare, kunnen wij stellen werknemers in en start met het testen van onze code, zelfs voordat we het implementeren in de productie. Zodra u in te loggen op de CloudFlare Dashboard, ziet u een pictogram voor de Werknemers. Wat heel handig over deze omgeving is dat CloudFlare biedt u een omgeving voor de ontwikkeling van test alles uit voordat u met de implementatie van uw werknemer uw live site.

Klik op “Maak een Werknemer” voor het genereren van een ontwikkelomgeving wees naar een willekeurig gegenereerd werknemer sub-domein toe te staan om te testen.

Laten we een kijkje nemen op de development omgeving om te begrijpen hoe dit ons kan helpen. Er zijn drie grote afdelingen. Aan de linker kant, we hebben een code-editor en aan de rechterkant, we hebben twee weergaven. De ene is de HTTP bekijken waar we kunnen bouwen van specifieke vragen aan onze medewerkers en zien de reactie, en de tweede is het tabblad Voorbeeld waar we kunnen zien hoe de pagina er uit zou zien.

Nu hebben we een code-omgeving opgezet, maken we een eenvoudige redirect die we kunnen uitbreiden op later.

De ontwikkeling van de Redirect Code

Er is een boilerplate code die zal dienen als een goede start van onze redirect code. In de eerste sectie, de addEventListener is wat het eerste onderschept de binnenkomende aanvraag. Die aanvraag wordt dan verzonden naar de handleRequest functie voor de verwerking.

addEventListener(‘halen’, event => {
evenement.respondWith(handleRequest(event.aanvraag))
})

/**
* Te reageren op de aanvraag
* @param {Verzoek} aanvraag
*/
asynchrone functie handleRequest(aanvraag) {
// Redirect logica om hier te gaan
}

Het basisidee is dat we de padnaam van de binnenkomende aanvraag-URL en beslissen waar u wilt omleiden. Met behulp van de URL van het type, kunnen we gemakkelijk onze kaart inkomende padnaam naar een locatie. In dit onderstaande voorbeeld maken we gebruik van een switch statement instellen van de locatie op basis van het pad en het retourneren van een 301 permanent redirect.

addEventListener(‘halen’, async event => {
evenement.respondWith(handleRequest(event.aanvraag))
})

asynchrone functie handleRequest(aanvraag) {
laat requestURL = new URL(aanvraag.de url)
laat path = requestURL.padnaam.split(‘/redirect’)[1]

switch (pad) {
‘/test1’ {
laat location = ‘https://mysite.com/newlocation1’
breken
}
‘/test2’ {
laat location = ‘https://mysite.com/newlocation2’
breken
}
}

als (locatie) {
terug Antwoord.redirect(locatie, 301)
}

terug halen(verzoek)
}

Het verbeteren van de Redirect Script

Dit werkt goed, maar er is een efficiënter en eenvoudiger te beheren op de manier van het in kaart brengen van de omleidingen. Met behulp van de JavaScript-Kaart bouwen, creëren we een gemakkelijk te verwijzen naar de lijst van de omleidingen. We verplaatsen ons doorverwijst naar een Kaart construct en refactor onze code om het werk een beetje beter.

const redirectMap = nieuwe Kaart([
[‘/test1’, ‘https://mysite.com/newlocation1’],
[‘/test2’, ‘https://mysite.com/newlocation2’],
[‘/test3’, ‘https://mysite.com/newlocation3’],
[‘/test4’, ‘https://mysite.com/newlocation4’],
])

addEventListener(‘halen’, async event => {
evenement.respondWith(handleRequest(event.aanvraag))
})

asynchrone functie handleRequest(aanvraag) {
laat requestURL = new URL(aanvraag.de url)
laat path = requestURL.padnaam.split(‘/redirect’)[1]
laten locatie = redirectMap.krijgen(pad)

als (locatie) {
terug Antwoord.redirect(locatie, 301)
}

terug halen(verzoek)
}

Implementatie

Nu dat ons script is functioneel, we moeten dit toewijzen aan een domein. Na het klikken op Opslaan en Implementeren we nodig hebben om terug te gaan naar ons dashboard en vinden het domein dat we in kaart brengen van dit script ook.

Selecteer de domeinnaam die we willen toepassen van deze werknemer aan, ga vervolgens naar de “Werknemers” tabblad. Selecteer de “Route Toevoegen” knop, en je bent in staat om te definiëren van het script en de route. Wat dit ook betekent is dat u kunt meerdere scripts en de routes die zij toepassen.

Onder de “Route” item, die we nodig hebben om te bepalen waar de link gaat. Waarschijnlijk gaan we een route zoals:

*.mysite.com/*

De bovenstaande route komt overeen met alle Url ‘s en schema’ s voor de site. Omdat we op zoek zijn naar het einde pad, kijken we bij elk verzoek komen door en de test voor die. Uiteindelijk kiezen we voor de Werknemer die wij hebben gemaakt voor het implementeren van deze zone.

Iets om in gedachten te houden is dat het toewijzen van een CloudFlare Werknemer een script en de route zal maken dat de werknemer onmiddellijk van kracht. Dit betekent ook dat wijzigingen, fouten en al, van kracht onmiddellijk als goed.

Toekomstige Mogelijkheden

CloudFlare heeft een aantal andere tools en mogelijkheden die het gebruik van of de integratie van CloudFlare Werknemers. Er is een sleutel-waarde te slaan, dat zorgt uiteindelijk voor een consistente data-opslag, toegankelijk door een CloudFlare Werknemer op elke edge-server.

Met behulp van Wrangler, een commando-regel gereedschap, kunt u nog bepaling een hele statische site met de bestanden die zijn opgeslagen in de KV Winkel en geserveerd met CloudFlare Werknemers scripts. Er zijn veel mogelijkheden die dit oproept, en wat kan worden gemaakt met behulp van CloudFlare Werknemers.

Conclusie

CloudFlare de Werknemers is een zeer krachtig hulpmiddel dat het mogelijk maakt voor de unieke mogelijkheid om snel te handelen op de rand van de aanvragen. Met behulp van deze te verplaatsen ons normale toepassing van de logica en de rand, wij zijn niet alleen een daling van de responstijd, maar ook voorkomen dat de belastingheffing over onze oorsprong servers.