如何通过 HTTPS/SSL 运行 Svelte/Sapper 应用程序？

Question

我似乎找不到有关通过 https 运行 Svelte 应用程序的任何信息。我想在 https 上为 dev 和 prod 运行。我可以--port在 package.json 中的脚本中使用参数更改端口，但显然这不会将协议从 http 更改为 https。

Answer 1

您需要从某处创建 SSL 证书（如ZeroSSL）。如果您已经有certificate.crt&private.key文件，请编辑您的server.js文件。

的原始源代码<sapper project directory>/src/server.js是：

import sirv from 'sirv';
import polka from 'polka';
import compression from 'compression';
import * as sapper from '@sapper/server';

const { PORT, NODE_ENV } = process.env;
const dev = NODE_ENV === 'development';

polka() // You can also use Express
    .use(
        compression({ threshold: 0 }),
        sirv('static', { dev }),
        sapper.middleware()
    )
    .listen(PORT, err => {
        if (err) console.log('error', err);
    });

您可以server.js像这样添加和更改此文件（）的一些代码：

import sirv from 'sirv';
import polka from 'polka';
import compression from 'compression';
import * as sapper from '@sapper/server';

const { PORT, NODE_ENV } = process.env;
const dev = NODE_ENV === 'development';

const { createServer } = require('https');
const { readFileSync } = require('fs');
const ssl_port = 443;

const options = {
  // The path & file names could be different.
  key: readFileSync('/home/ubuntu/ssl/private.key'),
  cert: readFileSync('/home/ubuntu/ssl/certificate.crt')
};

const { handler } = polka()
    .use(
        compression({ threshold: 0 }),
        sirv('static', { dev }),
        sapper.middleware()
    )
    .get('*', (req, res) => {
        res.end(`POLKA: Hello from ${req.pathname}`);
    });

// Mount Polka to HTTPS server
createServer(options, handler).listen(ssl_port, _ => {
    console.log(`> Running on https://localhost:${ssl_port}`);
});

添加的代码是：

const { createServer } = require('https');
const { readFileSync } = require('fs');
const ssl_port = 443;

const options = {
  // The path & file names could be different.
  key: readFileSync('/home/ubuntu/ssl/private.key'),
  cert: readFileSync('/home/ubuntu/ssl/certificate.crt')
};

更改后的代码是：

const { handler } = polka()
    .use(
        compression({ threshold: 0 }),
        sirv('static', { dev }),
        sapper.middleware()
    )
    .get('*', (req, res) => {
        res.end(`POLKA: Hello from ${req.pathname}`);
    });

// Mount Polka to HTTPS server
createServer(options, handler).listen(ssl_port, _ => {
    console.log(`> Running on https://localhost:${ssl_port}`);
});

然后你必须运行你的 Svelte/Sapper 应用程序，sudo因为端口 443 的许可。（像这样：sudo npm run dev或sudo npm run start）

运行后sudo npm run dev，您可能会看到以下消息：

$ sudo npm run dev

> TODO@0.0.1 dev /home/ubuntu/ensayar-sapper
> sapper dev

? server (2.1s)
? client (2.1s)
> Running on https://localhost:443
? service worker (42ms)
> Server is not listening on port 3000

您可以忽略该消息Server is not listening on port 3000。