本地 TLS

本指南目前仅在使用经典 Remix 编译器时相关。

在本地使用 HTTP 更简单，但如果您确实需要在本地使用 HTTPS，以下是如何操作。

remix-serve 不支持本地 HTTPS，因为它旨在成为一个帮助您起步的最小服务器。remix-serve 是 Express 的一个简单包装器，因此如果您想在本地使用 HTTPS，可以直接使用 Express。

如果您在没有 -c 标志的情况下运行 remix dev，则表示您隐式地使用 remix-serve 作为您的应用程序服务器。

使用本地 TLS 运行您的应用程序服务器

第一步是在不运行 remix dev 的情况下，使用本地 TLS 运行您的应用程序服务器。这将在下一节中设置使用本地 TLS 设置 remix dev 的成功基础。

👉 安装 mkcert

👉 创建本地证书颁发机构

mkcert -install

👉 告知 Node 使用我们的本地 CA

export NODE_EXTRA_CA_CERTS="$(mkcert -CAROOT)/rootCA.pem"

👉 创建 TLS 密钥和证书

mkcert -key-file key.pem -cert-file cert.pem localhost

如果您使用自定义主机名，则可以在生成 TLS 密钥和证书时将 localhost 更改为其他内容。

👉 使用 key.pem 和 cert.pem 使 HTTPS 在本地与您的应用程序服务器一起工作。

操作方法取决于您使用的应用程序服务器。例如，以下是如何在 Express 服务器上使用 HTTPS

import fs from "node:fs";
import https from "node:https";
import path from "node:path";

import express from "express";

const BUILD_DIR = path.resolve(__dirname, "build");
const build = require(BUILD_DIR);

const app = express();

// ... code setting up your express app goes here ...

const server = https.createServer(
  {
    key: fs.readFileSync("path/to/key.pem"),
    cert: fs.readFileSync("path/to/cert.pem"),
  },
  app
);

const port = 3000;
server.listen(port, () => {
  // ... code to run after your server is running goes here ...
});

👉 使用本地 TLS 运行您的应用程序服务器

例如，使用上面的 Express 服务器，您可以这样运行它

remix build
node ./server.js

使用本地 TLS 运行 `remix dev`

请确保您可以在不使用 remix dev 的情况下使用本地 TLS 运行您的应用程序！如果您尚未执行此操作，请查看上一节。

👉 为 remix dev 启用 TLS

通过配置

/** @type {import('@remix-run/dev').AppConfig} */
module.exports = {
  dev: {
    tlsKey: "key.pem", // relative to cwd
    tlsCert: "cert.pem", // relative to cwd
  },
};

或通过标志

remix dev --tls-key=key.pem --tls-cert=cert.pem -c "node ./server.js"

您的应用程序现在应该正在使用本地 TLS 运行了！

本地 TLS

使用本地 TLS 运行您的应用程序服务器

使用本地 TLS 运行 remix dev

使用本地 TLS 运行 `remix dev`