Давайте створимо генератор QR-коду з безсерверною функцією!

QR-коди смішні, правда? Ми любимо їх, потім ненавидимо, потім знову любимо. У будь-якому випадку, останнім часом вони знову з’явилися, і це змусило мене задуматися про те, як вони зроблені. Існує величезна кількість генераторів QR-кодів, але скажіть, що це те, що вам потрібно зробити на власному веб-сайті. Цей пакет може це зробити. Але він також важить величезні 180 КБ для всього, що потрібно для створення матеріалів. Ви б не хотіли подавати все це разом із рештою ваших сценаріїв.

Тепер я відносно новачок у концепції функцій хмари, але я чув, що це коліна бджоли для чогось подібного. Таким чином, функція живе десь на сервері, який можна викликати, коли це потрібно. Схоже на невеликий API для запуску функції.

Деякі хости пропонують якусь функцію хмарних функцій. DigitalOcean є одним із них! І, як і Droplets, функції досить легко розгорнути.

Створіть локально папку функцій

У DigitalOcean є інтерфейс командної команди, який задає нам усе 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> тег із тегом 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: {}

Бачите ці виділені рядки? The packages: name власність де в packages папка, в якій функція живе, яка називається папкою sample в цьому випадку. The actions/ name Властивість — це ім'я самої функції, яке є ім'ям файлу. Його hello за замовчуванням, коли ми розгортаємо проект, але ми назвали свій qr.js, тож ми повинні змінити цей рядок з hello до qr перед тим, як рухатись далі.

Розгорніть функцію

Ми можемо зробити це прямо з командного рядка! Спочатку ми підключаємось до середовища пісочниці 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-трюки. Ти повинен отримати інформаційний бюлетень.