SvelteKit 和适配器节点 -> 生产
SvelteKit and adapter-node -> production
想知道其他人正在使用 SvelteKit 适配器节点构建将它们投入生产。
例如...
- 提供预压缩文件
- 设置缓存 TTL
- 可能是
helmet
像这样实现 polka/express/connect 的 server.js 适配器定义入口点是否更好...
// src/server.js
import { assetsMiddleware, prerenderedMiddleware, kitMiddleware } from '../build/middlewares.js'
import polka from 'polka'
import compression from 'compression'
import helmet from 'helmet'
const app = polka()
app.use(helmet())
app.use(assetsMiddleware, prerenderedMiddleware, kitMiddleware)
app.use(compression())
app.listen(3000)
还是在hooks.js的handler()方法中实现类似的功能更好?
有兴趣了解人们正在做什么以通过适配器节点从构建到生产。
检查 adapter-node 在构建文件夹中生成的内容后,我决定为 entryPoint 属性 设置svelte.config.js 到 ./src/server.mjs
中的适配器选项被添加到构建中。钩子中的 handle() 方法。js/ts 不允许对静态内容进行任何控制。
在下面的代码中,我为非 https 设置了重定向并使用头盔来增强安全性。
// /src/server.mjs
import polka from 'polka'
import helmet from 'helmet'
import { assetsMiddleware, prerenderedMiddleware, kitMiddleware } from '../build/middlewares.js'
const { PORT = 3000, DOMAIN } = process.env
const isHttpPerHeroku = (req) =>
req.headers['x-forwarded-proto'] &&
req.headers['x-forwarded-proto'] !== 'https'
polka()
// On Heroku (only), redirect http to https
.use((req, res, next) => {
if (isHttpPerHeroku(req)) {
let url = `${DOMAIN}${req.url}`
let str = `Redirecting to ${url}`
res.writeHead(302, {
Location: url,
'Content-Type': 'text/plain',
'Content-Length': str.length
})
res.end(str)
} else next()
})
// Apply all but two helmet protections
.use(helmet({
contentSecurityPolicy: false, // override below
referrerPolicy: false // breaks "Sign in with Gooogle"
}))
// Set the Content Security Policy on top of defaults
.use(helmet.contentSecurityPolicy({
useDefaults: true,
directives: {
scriptSrc: [
"'self'",
`'unsafe-inline'`,
'https://accounts.google.com/gsi/',
'https://assets.braintreegateway.com/web/',
'https://platform.twitter.com/',
'https://www.google-analytics.com/',
'https://www.google.com/recaptcha/',
'https://www.googletagmanager.com/',
'https://www.gstatic.com/recaptcha/'
],
connectSrc: [
"'self'",
'https://accounts.google.com/gsi/',
'https://api.sandbox.braintreegateway.com/merchants/',
'https://api.braintreegateway.com/merchants/',
'https://origin-analytics-sand.sandbox.braintree-api.com/',
'https://payments.sandbox.braintree-api.com/',
'https://payments.braintree-api.com/',
'https://stats.g.doubleclick.net/',
'https://www.google-analytics.com/',
'https://platform.twitter.com/',
'https://assets.braintreegateway.com/web/',
'https://www.googletagmanager.com/',
'https://www.google.com/recaptcha/',
'https://www.gstatic.com/recaptcha/',
'https://fonts.gstatic.com/',
'https://client-analytics.braintreegateway.com/'
],
childSrc: [
"'self'",
'https://accounts.google.com/gsi/',
'https://assets.braintreegateway.com/web/',
'https://platform.twitter.com/',
'https://syndication.twitter.com/i/jot',
'https://www.google.com/maps/',
'https://www.google.com/recaptcha/'
],
fontSrc: [
"'self'",
'https:',
'data:',
'https://fonts.gstatic.com'
],
imgSrc: [
"'self'",
'data:',
'https://www.google-analytics.com/',
'https://www.googletagmanager.com/',
'www.w3.org/2000/svg',
],
frameSrc: [
'https://accounts.google.com/gsi/',
'https://www.google.com/recaptcha/',
'https://platform.twitter.com/',
'https://assets.braintreegateway.com/web/',
'https://www.google.com/maps/',
'https://syndication.twitter.com/i/jot'
],
workerSrc: [
"'self'"
]
}
}))
// Load the SvelteKit build
.use(assetsMiddleware, prerenderedMiddleware, kitMiddleware)
// Listen on the appropriate port
.listen(PORT)
想知道其他人正在使用 SvelteKit 适配器节点构建将它们投入生产。
例如...
- 提供预压缩文件
- 设置缓存 TTL
- 可能是
helmet
像这样实现 polka/express/connect 的 server.js 适配器定义入口点是否更好...
// src/server.js
import { assetsMiddleware, prerenderedMiddleware, kitMiddleware } from '../build/middlewares.js'
import polka from 'polka'
import compression from 'compression'
import helmet from 'helmet'
const app = polka()
app.use(helmet())
app.use(assetsMiddleware, prerenderedMiddleware, kitMiddleware)
app.use(compression())
app.listen(3000)
还是在hooks.js的handler()方法中实现类似的功能更好?
有兴趣了解人们正在做什么以通过适配器节点从构建到生产。
检查 adapter-node 在构建文件夹中生成的内容后,我决定为 entryPoint 属性 设置svelte.config.js 到 ./src/server.mjs
中的适配器选项被添加到构建中。钩子中的 handle() 方法。js/ts 不允许对静态内容进行任何控制。
在下面的代码中,我为非 https 设置了重定向并使用头盔来增强安全性。
// /src/server.mjs
import polka from 'polka'
import helmet from 'helmet'
import { assetsMiddleware, prerenderedMiddleware, kitMiddleware } from '../build/middlewares.js'
const { PORT = 3000, DOMAIN } = process.env
const isHttpPerHeroku = (req) =>
req.headers['x-forwarded-proto'] &&
req.headers['x-forwarded-proto'] !== 'https'
polka()
// On Heroku (only), redirect http to https
.use((req, res, next) => {
if (isHttpPerHeroku(req)) {
let url = `${DOMAIN}${req.url}`
let str = `Redirecting to ${url}`
res.writeHead(302, {
Location: url,
'Content-Type': 'text/plain',
'Content-Length': str.length
})
res.end(str)
} else next()
})
// Apply all but two helmet protections
.use(helmet({
contentSecurityPolicy: false, // override below
referrerPolicy: false // breaks "Sign in with Gooogle"
}))
// Set the Content Security Policy on top of defaults
.use(helmet.contentSecurityPolicy({
useDefaults: true,
directives: {
scriptSrc: [
"'self'",
`'unsafe-inline'`,
'https://accounts.google.com/gsi/',
'https://assets.braintreegateway.com/web/',
'https://platform.twitter.com/',
'https://www.google-analytics.com/',
'https://www.google.com/recaptcha/',
'https://www.googletagmanager.com/',
'https://www.gstatic.com/recaptcha/'
],
connectSrc: [
"'self'",
'https://accounts.google.com/gsi/',
'https://api.sandbox.braintreegateway.com/merchants/',
'https://api.braintreegateway.com/merchants/',
'https://origin-analytics-sand.sandbox.braintree-api.com/',
'https://payments.sandbox.braintree-api.com/',
'https://payments.braintree-api.com/',
'https://stats.g.doubleclick.net/',
'https://www.google-analytics.com/',
'https://platform.twitter.com/',
'https://assets.braintreegateway.com/web/',
'https://www.googletagmanager.com/',
'https://www.google.com/recaptcha/',
'https://www.gstatic.com/recaptcha/',
'https://fonts.gstatic.com/',
'https://client-analytics.braintreegateway.com/'
],
childSrc: [
"'self'",
'https://accounts.google.com/gsi/',
'https://assets.braintreegateway.com/web/',
'https://platform.twitter.com/',
'https://syndication.twitter.com/i/jot',
'https://www.google.com/maps/',
'https://www.google.com/recaptcha/'
],
fontSrc: [
"'self'",
'https:',
'data:',
'https://fonts.gstatic.com'
],
imgSrc: [
"'self'",
'data:',
'https://www.google-analytics.com/',
'https://www.googletagmanager.com/',
'www.w3.org/2000/svg',
],
frameSrc: [
'https://accounts.google.com/gsi/',
'https://www.google.com/recaptcha/',
'https://platform.twitter.com/',
'https://assets.braintreegateway.com/web/',
'https://www.google.com/maps/',
'https://syndication.twitter.com/i/jot'
],
workerSrc: [
"'self'"
]
}
}))
// Load the SvelteKit build
.use(assetsMiddleware, prerenderedMiddleware, kitMiddleware)
// Listen on the appropriate port
.listen(PORT)