Недавно я толкнул длинную просроченную функцию для Чемодано : SSL для общественных приборных панелей клиентов. Это было вроде, вроде, совершенно не хватает, когда я запустил, и многие клиенты просили об этом.
Настройка бесплатного SSL оказалась довольно гладкой из-за
- Давайте шифровать Отказ
- Большой пакет NPM называется Гринлок Отказ
- Некоторые DNS на маршруте AWS Transe 53 и EC2.
- Некоторые маршрутизатор Vue.js Magic.
Большинство принципов, объясненных здесь, полностью передаются на любой слой, который вы используете. Есть некоторые довольно важные чтены, поэтому давайте погрузимся в.
Клиенты Checkly могут создавать публичные панели мозолей и размещать их на пользовательском домене. Таким образом, они могут показывать состояние конечных точек API и щелкнуть потоки на большом экране телевизора или в качестве страницы состояния для своих клиентов, сохраняя знакомство о своем собственном доменном имени.
Вот наша собственная публичная приборная панель: https://status.checklyhq.com/
Уверенно публичная приборная панель для моих клиентов я хотел, чтобы установка SSL была максимально легкой.
- Клиент создает приборную панель.
- Клиент настраивает их DNS с записью CNAME, которые указывают на
Dashboards.Checklyhq.com.. - Клиент попадает на настроенный CNAME и BOOM 💥 SSL!
Вот как мы объясняем это в наших документах. Имеет смысл верно? Далее!
Давайте шифрование невероятно. Я помню дни висит на телефоне с VeriSign в Женеве, чтобы получить SSL-сертификаты и выпученные более 400 долларов за то, что в основном строку трудно угадать персонажей. Это было дерьмо. Я хотел бы изобрести это 🤑.
Гринлок также довольно невероятный. Это Node.js, давайте шифровать клиента, который заботится обо всех грязных битах при включении с шифрованием. Его сестра проект — Greenlock-Express Что, как вы, наверное догадались, делает Greenlock Vanilla легко использовать из Express.
Я не собираюсь регулировать DREALLOCK и DREARLOCK-EXPRESS DOCS. Они отлично. Просто посмотрите на полный пример конфигурации ниже. Это почти на 100% буквально код, который мы проводим.
const axios = require('axios')
const path = require('path')
const http01 = require('le-challenge-fs').create({ webrootPath: '/tmp/acme-challenges' })
const S3 = { bucketName: 'some-fantastic-private-bucket' }
const store = require('le-store-s3').create({ S3 })
const greenlock = require('greenlock-express').create({
server: 'https://acme-v02.api.letsencrypt.org/directory',
version: 'draft-11',
configDir: path.join(__dirname, 'acme'),
approveDomains,
app: require('./app.js'),
communityMember: true,
store,
debug: process.env.NODE_ENV === 'development',
renewBy: 10 * 24 * 60 * 60 * 1000,
renewWithin: 14 * 24 * 60 * 60 * 1000
})
function approveDomains (opts, certs, cb) {
opts.challenges = { 'http-01': http01 }
opts.email = config.email
if (certs) {
opts.domains = [certs.subject].concat(certs.altnames)
}
checkDomain(opts.domains, (err, agree) => {
if (err) { cb(err); return }
opts.agreeTos = agree
cb(null, { options: opts, certs: certs })
})
}
function checkDomain (domains, cb) {
const userAgrees = true
if (domains[0]) {
axios.get('https://your.application.com/check-this-domain/ + domains[0]')
.then(res => {
cb(null, userAgrees)
})
.catch(err => {
cb(err)
})
} else {
cb(new Error('No domain found'))
}
}
greenlock.listen(80, 443)
ОК, поэтому обратите внимание на следующие вещи:
Сертификаты, выданные за шифрование, должны быть «физически», хранятся где-то. Вы можете хранить их на диске, но что, если ваш сервер взрывается? Вот почему мы используем адаптер S3. Просто настройте ведро на AWS S3 и передайте его.
Давайте шифрем есть удобный разрыв между
ПостановкаиПроизводствопройти в правом URL, прежде чем ставить эту жизнь.утвержденоКрюк позволяет определить пользовательскую функцию, чтобы сделать все, что вам нужно, чтобы одобрить домен, имеет право на бесплатный сертификат SSL.
Это Super, Super Nice, так как он позволяет вам поместить процесс запроса на сертификат на автопилоте. Если вы на nginx, LUA-RESTY-AUTO-SSL Проект имеет очень похожую вещь. Хорошая запись от readme.io люди здесь Отказ
Для проверки я сделал простую конечную точку RPC в нашем приложении, который принимает доменное имя и выплесняет Правда/ложь Принадлежит ли домен клиенту Checkly Paying. Я не собираюсь показать этот код здесь. Это просто простой запрос PostgreSQL. Легко делает это.
app.js Ссылка «Файл» — это мертвое простое приложение Express, которое использует промежуточное программное обеспечение прокси, чтобы пройти ваш запрос — через промежуточное программное обеспечение Greenlock — к своей цели.
const express = require('express')
const proxy = require('http-proxy-middleware')
const app = express()
app.use('/',
proxy({
target: 'http://your.application.com/some-endpoint',
changeOrigin: true
})
)
module.exports = app
Эта конфигурация позаботится о выдаче и продлении сертификатов SSL. прореживание и Rewwwithin Опция управлять окном для продления. Это в значительной степени это.
Вы знаете, что орехи? Для приборных панелей Checkboy цель на самом деле является просто ведром S3 с нашим приложением Vue.js. Да, все эти хлопоты для толкания некоторых статических файлов JavaScript клиенту.
Вышеуказанное приложение является довольно мертвым приложением Node.js. Я завернул его в контейнер докеров и настроил PM2 Чтобы запустить экспресс-сервер в режиме производства.
Хорошо! Развертывание Героку и сделано правильно?
Нет. Мы управляем нашим API на Heroku, но в этом случае это не работает. На самом деле ни один из Пааа/контейнера-ААС я смотрел, может сделать это. Почему? Потому что почти все эти услуги хостинга уже угоняют Хозяин Заголовок в каждом HTTP-запросе, чтобы определить, на какой арендатор должен идти трафик.
Это Хозяин Заголовок имеет решающее значение, потому что он содержит уникальный токен — доменное имя — к которому проверяемое приложение может определить какую приборную панель. Мы посмотрим, как это работает в следующем абзаце.
Это означает, что вам необходимо иметь «чистый» IP-адрес и экземпляр EC2 или другой VM, подключенный к этому IP. Затем вы запускаете приложение на основе GreenLock на этой коробке и свяжитесь с портом 80 и 443. Теперь вы можете указать DNS рекорд к этому IP и получить трафик напрямую, без некоторого решения маршрутизации других поставщиков между вмешательством со своими заголовками.
Запись, указывающая на Enterprypt/GreenLocker Server
Последний бит.
Полностью зашифрованный запрос SSL для Status.example.com закреплен через DashBoards.Checklyhq.com к нашему ведрю S3, который содержит одностраничное приложение Vue.js. Приложение Vue загружает его/маршрут, и он определяет, какой компонент загружать. Эта магия происходит в Vue Router.
// router.js
{
path: '/',
name: 'dashboard',
component: (function () {
return isCustomSub(window.location.hostname) ? PubDashboard : Dashboard
}()),
}
Определите Vue Component в Vue Router. Функция iscustomsub () довольно специфична для вашей ситуации. В нашем случае мы просто используем Regex, чтобы определить, что делать.
function isCustomSub (host) {
const reg = new RegExp('app|app-test|www')
const parts = host.split('.')
return !reg.test(parts[0])
}
Pubdashboard Компонент использует точную же логику для отправки запроса API на проверку, и вытесните все, что настроен для приборной панели, связанной с этим определенным именем хоста. Всякий раз, когда и вененые имена хостов не совпадают, или клиент не оплачен, планируем, что мы просто служим ошибкой.
Это то, к чему выглядит конечный результат для моих клиентов. Они настраивают пользовательский домен и как только это работает, это сделано!
Оригинал: «https://dev.to/checkly/how-i-set-up-ssl-with-let-s-encrypt-for-my-saas-customers-dashboards-58f1»