Ας φτιάξουμε μια γεννήτρια κωδικών QR με λειτουργία χωρίς διακομιστή!

Οι κωδικοί QR είναι αστείοι, σωστά; Τους αγαπάμε, μετά τους μισούμε και μετά τους αγαπάμε ξανά. Τέλος πάντων, τον τελευταίο καιρό εμφανίστηκαν ξανά και με έκανε να σκεφτώ πώς φτιάχνονται. Υπάρχουν σαν μια gazillion γεννήτριες κωδικών QR εκεί έξω, αλλά πείτε ότι είναι κάτι που πρέπει να κάνετε στον δικό σας ιστότοπο. Αυτό το πακέτο μπορεί να το κάνει. Αλλά έχει επίσης βάρος 180 KB για όλα όσα χρειάζεται για να δημιουργήσει πράγματα. Δεν θα θέλατε να τα σερβίρετε όλα αυτά μαζί με τα υπόλοιπα σενάρια σας.

Τώρα, είμαι σχετικά νέος στην έννοια των συναρτήσεων σύννεφων, αλλά ακούω ότι είναι τα γόνατα της μέλισσας για κάτι σαν αυτό. Με αυτόν τον τρόπο, η συνάρτηση ζει κάπου σε έναν διακομιστή που μπορεί να κληθεί όταν χρειάζεται. Ταξινομήστε σαν ένα μικρό API για να εκτελέσετε τη λειτουργία.

Ορισμένοι οικοδεσπότες προσφέρουν κάποιο είδος λειτουργίας cloud. Το DigitalOcean τυχαίνει να είναι ένα από αυτά! Και, όπως το Droplets, οι λειτουργίες είναι αρκετά εύκολο να αναπτυχθούν.

Δημιουργήστε έναν φάκελο συναρτήσεων τοπικά

Η DigitalOcean έχει ένα CLI που με μια εντολή που θα μας σκαλώσει τα πράγματα, έτσι cd όπου θέλετε να ρυθμίσετε και να εκτελέσετε τα πράγματα:

doctl serverless init --language js qr-generator

Σημειώστε ότι η γλώσσα δηλώνεται ρητά. Οι λειτουργίες DigitalOcean υποστηρίζουν επίσης PHP και Python.

Παίρνουμε ένα ωραίο καθαρό έργο που ονομάζεται qr-generator με /packages φάκελο που περιέχει όλες τις λειτουργίες του έργου. Υπάρχει μια συνάρτηση δείγματος εκεί, αλλά μπορούμε να την παραβλέψουμε προς το παρόν και να δημιουργήσουμε ένα qr φάκελο ακριβώς δίπλα του:

Αυτός ο φάκελος είναι όπου και τα δύο qrcode πακέτο και μας qr.js λειτουργία πρόκειται να ζήσουν. Λοιπόν ας cd σε packages/sample/qr και εγκαταστήστε το πακέτο:

npm install --save qrcode

Τώρα μπορούμε να γράψουμε τη συνάρτηση σε μια νέα qr.js αρχείο:

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)

Το μόνο που κάνει είναι να απαιτεί το qrcode πακέτο και εξαγωγή μιας συνάρτησης που βασικά δημιουργεί ένα <img> ετικέτα με το a base64 PNG για την πηγή. Μπορούμε ακόμη και να το δοκιμάσουμε στο τερματικό:

doctl serverless functions invoke sample/qr -p "text:css-tricks.com"

Ελέγξτε το αρχείο διαμόρφωσης

Υπάρχει ένα επιπλέον βήμα που χρειαζόμαστε εδώ. Όταν το έργο ήταν σκαλωσιά, πήραμε αυτό το λίγο project.yml αρχείο και διαμορφώνει τη συνάρτηση με κάποιες πληροφορίες σχετικά με αυτήν. Αυτό είναι αυτό που υπάρχει εκεί από προεπιλογή:

targetNamespace: ''
parameters: {}
packages: - name: sample environment: {} parameters: {} annotations: {} actions: - name: hello binary: false main: '' runtime: 'nodejs:default' web: true parameters: {} environment: {} annotations: {} limits: {}

Βλέπετε αυτές τις επισημασμένες γραμμές; ο packages: name ιδιοκτησία είναι όπου στο packages φάκελο η συνάρτηση lives, που είναι ένας φάκελος που ονομάζεται sample σε αυτήν την περίπτωση. ο actions/ name ιδιοκτησία είναι το όνομα της ίδιας της συνάρτησης, που είναι το όνομα του αρχείου. Του hello από προεπιλογή όταν περιστρέφουμε το έργο, αλλά ονομάσαμε το δικό μας qr.js, οπότε πρέπει να αλλάξουμε αυτή τη γραμμή από hello προς την qr πριν προχωρήσουμε.

Αναπτύξτε τη λειτουργία

Μπορούμε να το κάνουμε απευθείας από τη γραμμή εντολών! Αρχικά, συνδεόμαστε στο περιβάλλον sandbox του DigitalOcean, ώστε να έχουμε μια ζωντανή διεύθυνση URL για δοκιμή:

## You will need an DO API key handy
doctl sandbox connect

Τώρα μπορούμε να αναπτύξουμε τη συνάρτηση:

doctl sandbox deploy qr-generator

Μόλις αναπτυχθεί, μπορούμε να έχουμε πρόσβαση στη συνάρτηση σε μια διεύθυνση URL. Τι είναι το URL; Υπάρχει μια εντολή για αυτό:

doctl sbx fn get sample/qr --url
https://faas-nyc1-2ef2e6cc.doserverless.co/api/v1/web/fn-10a937cb-1f12-427b-aadd-f43d0b08d64a/sample/qr

Ναι! Δεν χρειάζεται πλέον να στείλετε ολόκληρο το πακέτο με τα υπόλοιπα σενάρια! Μπορούμε να χτυπήσουμε αυτό το URL και να δημιουργήσουμε τον κωδικό QR από εκεί.

Διαδήλωση

We fetch το API και αυτό είναι πραγματικά το μόνο που υπάρχει σε αυτό!

---

Ας φτιάξουμε μια γεννήτρια κωδικών QR με λειτουργία χωρίς διακομιστή! δημοσιεύθηκε αρχικά στις CSS-Κόλπα. Θα έπρεπε λάβετε το ενημερωτικό δελτίο.

• Coinsmart. Το καλύτερο ανταλλακτήριο Bitcoin και Crypto στην Ευρώπη.
• Platoblockchain. Web3 Metaverse Intelligence. Ενισχύθηκε η γνώση. ΕΛΕΥΘΕΡΗ ΠΡΟΣΒΑΣΗ.
• CryptoHawk. Ραντάρ Altcoin. Δωρεάν δοκιμή.
• Πηγή: https://css-tricks.com/lets-make-a-qr-code-generator-with-a-serverless-function/