QR-koder är roliga, eller hur? Vi älskar dem, sedan hatar vi dem, sedan älskar vi dem igen. Hur som helst, de har på sistone dykt upp igen och det fick mig att tänka på hur de är gjorda. Det finns som en gazillion QR-kodgeneratorer där ute, men säg att det är något du behöver göra på din egen webbplats. Detta paket kan göra det. Men den väger också rejäla 180 KB för allt den behöver för att generera saker. Du skulle inte vilja tjäna allt det tillsammans med resten av dina skript.
Nu är jag relativt ny på konceptet med molnfunktioner, men jag hör att det är biets knän för något som det här. På så sätt bor funktionen någonstans på en server som kan anropas när det behövs. Lite som ett litet API för att köra funktionen.
Vissa värdar erbjuder någon form av molnfunktionsfunktion. DigitalOcean råkar vara en av dem! Och precis som Droplets är funktionerna ganska lätta att distribuera.
Skapa en funktionsmapp lokalt
DigitalOcean har en CLI som med ett kommando som ställer upp saker åt oss, så cd
var du än vill ställa in saker och köra:
doctl serverless init --language js qr-generator
Observera att språket är uttryckligen deklarerat. DigitalOcean-funktioner stöder även PHP och Python.
Vi får ett fint rent projekt som heter qr-generator
med en /packages
mapp som innehåller alla projektets funktioner. Det finns en exempelfunktion där, men vi kan förbise den för tillfället och skapa en qr
mappen bredvid:
Den mappen är där både qrcode
paket och vårt qr.js
funktion kommer att leva. Så, låt oss cd
in packages/sample/qr
och installera paketet:
npm install --save qrcode
Nu kan vi skriva funktionen i en ny qr.js
fil:
const qrcode = require('qrcode') exports.main = (args) => { return qrcode.toDataURL(args.text).then(res => ({ headers: { 'content-type': 'text/html; charset=UTF-8' }, body: args.img == undefined ? res : `<img src="${res}">` }))
} if (process.env.TEST) exports.main({text:"hello"}).then(console.log)
Allt som gör är att kräva den qrcode
paketera och exportera en funktion som i princip genererar en <img>
taggen med a base64 PNG för källan. Vi kan till och med testa det i terminalen:
doctl serverless functions invoke sample/qr -p "text:css-tricks.com"
Kontrollera konfigurationsfilen
Det är ett extra steg vi behöver här. När projektet byggdes upp fick vi det här lilla project.yml
fil och den konfigurerar funktionen med lite information om den. Detta är vad som finns där som standard:
targetNamespace: ''
parameters: {}
packages: - name: sample environment: {} parameters: {} annotations: {} actions: - name: hello binary: false main: '' runtime: 'nodejs:default' web: true parameters: {} environment: {} annotations: {} limits: {}
Ser du de markerade raderna? De packages: name
egendom är var i packages
mapp funktionen lives, vilket är en mapp som heter sample
I detta fall. De actions/ name
egenskap är namnet på själva funktionen, vilket är namnet på filen. Dess hello
som standard när vi snurrar upp projektet, men vi döpte vårt qr.js
, så vi borde ändra den linjen från hello
till qr
innan du går vidare.
Distribuera funktionen
Vi kan göra det direkt från kommandoraden! Först ansluter vi till DigitalOcean-sandlådemiljön så att vi har en live-URL för testning:
## You will need an DO API key handy
doctl sandbox connect
Nu kan vi distribuera funktionen:
doctl sandbox deploy qr-generator
När den väl har implementerats kan vi komma åt funktionen på en URL. Vad är webbadressen? Det finns ett kommando för det:
doctl sbx fn get sample/qr --url
https://faas-nyc1-2ef2e6cc.doserverless.co/api/v1/web/fn-10a937cb-1f12-427b-aadd-f43d0b08d64a/sample/qr
Fan ja! Du behöver inte längre skicka hela paketet med resten av skripten! Vi kan träffa den webbadressen och generera QR-koden därifrån.
demo
We fetch
API:et och det är verkligen allt som finns!
Låt oss skapa en QR-kodgenerator med en serverlös funktion! ursprungligen publicerad på CSS-tricks. Du borde få nyhetsbrevet.
- '
- "
- 9
- a
- Om oss
- tillgång
- åtgärder
- Alla
- api
- I grund och botten
- innan
- kropp
- byta
- cloud
- koda
- begrepp
- Kontakta
- Konsol
- skapa
- distribuera
- utplacerade
- Miljö
- allt
- Leverans
- Förnamn
- från
- fungera
- funktioner
- rolig
- generera
- Generatorn
- kommer
- här.
- Markerad
- innehar
- Hur ser din drömresa ut
- HTTPS
- informationen
- installera
- IT
- sig
- JavaScript
- Nyckel
- språk
- linje
- rader
- liten
- lever
- älskar
- gjord
- göra
- mer
- rörliga
- behov
- erbjudanden
- egen
- paket
- pretty
- process
- projektet
- egenskapen
- QR code
- RE
- REST
- avkastning
- Körning
- sandlåda
- Server
- in
- So
- några
- något
- någonstans
- Snurra
- stödja
- terminal
- testa
- Testning
- Smakämnen
- källan
- saker
- Tänkande
- us
- webb
- Webbplats
- Din