当前位置: 首页 > news >正文

nuxt3项目打包部署到服务器后配置端口号和开启https

nuxt3打包后的项目部署相对于一般vite打包的静态文件部署要稍微麻烦一些,还有一个主要的问题是开发环境配置的.env环境变量在打包后部署时获取不到,具体的解决方案可以参考我之前文章 nuxt3项目打包后获取.env设置的环境变量无效的解决办法。
这里使用的方法是在部署时的项目根目录增加.env文件,并在server/index.mjs修改代码读取。网上搜索到的通过更改./server/chunks/_/nitro.mjs定义的port这种方法在现版本已不适用。

本文是只使用node的部署方案,未用nginx反向代理。

本次项目使用的主要依赖版本如下:

"node":"22.12.0",
"nuxt":"3.15.2",
"vue":"3.5.13",
"vue-router":"4.5.0"

部署项目的服务器版本为:

Windows Server 2022 Datacenter

我们先将项目执行打包,在成功打包后,会有一行代码提示:

✔ You can preview this build using node .output/server/index.mjs   

也就是说只要执行node .output/server/index.mjs,我们的项目就能跑起来了,执行后终端输出:

Listening on http://[::]:3000

可以看到默认使用的是http并且端口号是3000,那如何修改到使用https和目标端口号呢,这时需要打开.output/server/index.mjs文件,看看代码是如何执行的,主要是这段代码:

const cert = process.env.NITRO_SSL_CERT;
const key = process.env.NITRO_SSL_KEY;
const nitroApp = useNitroApp();
const server =cert && key? new Server({ key, cert }, toNodeListener(nitroApp.h3App)): new Server$1(toNodeListener(nitroApp.h3App));
const port = destr(process.env.NITRO_PORT || process.env.PORT) || 3e3;
const host = process.env.NITRO_HOST || process.env.HOST;
const path = process.env.NITRO_UNIX_SOCKET;
const listener = server.listen(path ? { path } : { port, host }, (err) => {if (err) {console.error(err);process.exit(1);}
const protocol = cert && key ? "https" : "http";

很明显,它都是通过环境变量来判断是开启http还是https,以及是否有定义端口号,那我们只需要这里定义的环境变量能正常获取就行了。

需要注意的是:开启https还需要提供相应的SSL/TLS证书

假如项目部署的根目录是:D:\server-project

  1. 先将.output下的全部文件复制到server-project文件夹下,然后新建ssl文件夹,将证书文件放入;
  2. 新建.env文件,定义环境变量,添加如下内容:
NITRO_PORT=443 //端口号
NITRO_SSL_KEY="./ssl/demo.key" //相对于根目录的路径
NITRO_SSL_CERT="./ssl/demo.crt" //相对于根目录的路径,也可以是.pem文件

结果如图:
在这里插入图片描述

  1. 修改server-project/server/index.mjs,修改处已加注释说明,全文如下:
import process from "node:process";
globalThis._importMeta_ = { url: import.meta.url, env: process.env };
import { Server as Server$1 } from "node:http";
import { Server } from "node:https";
import {t as toNodeListener,d as destr,u as useRuntimeConfig,a as trapUnhandledNodeErrors,s as setupGracefulShutdown,b as useNitroApp,
} from "./chunks/_/nitro.mjs";
import "node:crypto";
import "node:buffer";
import "node:fs";
import "node:url";
import "uuid";
import "node:path";
/*  新增加的代码--start */
import { resolve } from "node:path";
import { loadEnvFile } from "node:process";
import { readFileSync } from "node:fs";
loadEnvFile(resolve(process.cwd(), "./.env"));
/*  新增加的代码--end */
const cert = process.env.NITRO_SSL_CERT;
const key = process.env.NITRO_SSL_KEY;
const nitroApp = useNitroApp();/* server更改前const server =cert && key? new Server({ key, cert }, toNodeListener(nitroApp.h3App)): new Server$1(toNodeListener(nitroApp.h3App));
*/// server修改后,主要是将cert和key的值读取后返回给Server
const server =cert && key? new Server({key: readFileSync(resolve(process.cwd(), key)),cert: readFileSync(resolve(process.cwd(), cert)),},toNodeListener(nitroApp.h3App)): new Server$1(toNodeListener(nitroApp.h3App));
// 修改代码结束
const port = destr(process.env.NITRO_PORT || process.env.PORT) || 3e3;
const host = process.env.NITRO_HOST || process.env.HOST;
const path = process.env.NITRO_UNIX_SOCKET;
const listener = server.listen(path ? { path } : { port, host }, (err) => {if (err) {console.error(err);process.exit(1);}const protocol = cert && key ? "https" : "http";const addressInfo = listener.address();if (typeof addressInfo === "string") {console.log(`Listening on unix socket ${addressInfo}`);return;}const baseURL = (useRuntimeConfig().app.baseURL || "").replace(/\/$/, "");const url = `${protocol}://${addressInfo.family === "IPv6"? `[${addressInfo.address}]`: addressInfo.address}:${addressInfo.port}${baseURL}`;console.log(`Listening on ${url}`);
});
trapUnhandledNodeErrors();
setupGracefulShutdown(listener, nitroApp);
const nodeServer = {};export { nodeServer as default };
//# sourceMappingURL=index.mjs.map

代码修改完成后,在server-project目录下执行:

node ./server/index.mjs

到这一步,输入域名后网站就能正常访问了。

本次项目使用的是pm2部署,那么就还需要在server-project目录下新建一个pm2的配置文件ecosystem.config.json(也可以是ecosystem.config.js)和logs文件夹,这个按自己的部署需求配置就可以了,我的配置如下:

{"apps": [{"script": "./server/index.mjs","name": "web","instances": 1,"error_file": "./logs/err.log","out_file": "./logs/out.log","log_date_format": "YYYY-MM-DD HH:mm:ss","log_type": "json","ignore_watch": ["node_modules", "ssl", "logs"],"port": 443}]
}

配置完成后执行:

pm2 start ecosystem.config.json

对于NITRO_HOST这个环境变量不建议设置,让其自行分配,除非是必须,经过自己的实测,如果设置了这个值,比如:127.0.0.1,在服务器的浏览器上输入https://127.0.0.1,可以正常访问,但在外网通过域名则不能访问。

这种方法也有弊端,就是如果每打包一次,就得按以上方法修改一次,有些繁琐,如果有更好的方案,也欢迎大家多多推荐。

相关文章:

nuxt3项目打包部署到服务器后配置端口号和开启https

nuxt3打包后的项目部署相对于一般vite打包的静态文件部署要稍微麻烦一些,还有一个主要的问题是开发环境配置的.env环境变量在打包后部署时获取不到,具体的解决方案可以参考我之前文章 nuxt3项目打包后获取.env设置的环境变量无效的解决办法。 这里使用的…...

MongoDB文档查询

一、实验目的 1. 理解MongoDB文档数据库的基本概念和特性。 2. 掌握在MongoDB中创建集合和插入文档数据的方法。 3. 学习使用MongoDB进行文档查询操作,包括查询、过滤和排序等。 二、实验环境准备 1. JAVA环境准备:确保Java Development Kit (J…...

【GORM】初探gorm模型,字段标签与go案例

GORM是什么? GORM 是一个Go 语言 ORM(对象关系映射)库,它让我们可以使用结构体来操作数据库,而无需编写SQL 语句 GORM 模型与字段标签详解 在 GORM 中,模型是数据库表的抽象表示,字段标签&am…...

Windows下的Milvus安装秘籍:向量数据库轻松上手

目录 一、简介 二、dockers的安装 1.介绍 2.环境准备 1.启动WSL 的功能。 2.安装并启动Hyper-V Windows10下的安装办法: Windows11下的安装办法: 启动Hyper-V 3.Docker的安装 4、验证是否安装成功 三、安装Milvus 1.Milvus下载 2.Milvus启动…...

在GUI中添加一个Label

标签是一种非常简单的小部件,它可以为我们的图形用户界面(GUI)增添价值。它可以阐释其他组件的用途,提供一些额外的信息,这可以引导用户理解输入框组件的含义,也能够解释那些无需用户输入数据的组件所显示数据的含义。 准备就绪 我们将扩展第一个应用案例,即《创建第一…...

hive连接mysql报错:Unknown version specified for initialization: 3.1.0

分享下一些报错的可能原因吧 1.要开启hadoop 命令&#xff1a;start-all.sh 2.检查 hive-site.xml 和 hive-env.sh。 hive-site.xml中应设置自己mysql的用户名和密码 我的hive-site.xml如下&#xff1a; <configuration><property><name>javax.jdo.opt…...

Unity Shader学习日记 part5 CG基础

在了解完Shader的基本结构之后&#xff0c;我们再来看看编写着色器的语言。 Shader编写语言有CG&#xff0c;HLSL两种&#xff0c;我们主要学习CG的写法。 数据类型 CG的基础变量类型 uint a12;//无符号32位整形 int b12;//32位整形float f1.2f;//32位浮点型 half h1.2h;//…...

第7章:Python TDD测试Franc对象乘法功能

写在前面 这本书是我们老板推荐过的&#xff0c;我在《价值心法》的推荐书单里也看到了它。用了一段时间 Cursor 软件后&#xff0c;我突然思考&#xff0c;对于测试开发工程师来说&#xff0c;什么才更有价值呢&#xff1f;如何让 AI 工具更好地辅助自己写代码&#xff0c;或许…...

两级式三相光伏并网逆变器Matlab/Simulink仿真模型

忘记更新最经典的光伏并网仿真模型了&#xff0c;作为包含经典的MPPT和并网恒功率因素的双闭环控制模型&#xff0c;也是很多相关专业学生的入门研究内容&#xff0c;光伏并网模型三相的和单相都有。 其中三相光伏并网逆变器有大功率和小功率的两种&#xff0c;之前早在硕士期…...

redis性能优化参考——筑梦之路

基准性能测试 redis响应延迟耗时多长判定为慢&#xff1f; 比如机器硬件配置比较差&#xff0c;响应延迟10毫秒&#xff0c;就认为是慢&#xff0c;机器硬件配置比较高&#xff0c;响应延迟0.5毫秒&#xff0c;就认为是慢。这个没有固定的标准&#xff0c;只有了解了你的 Red…...

Ubuntu 22.04 TLS 忘记root密码,重启修改的解决办法

1.想办法进入这个界面&#xff0c;我这里是BIOS引导的是按Esc按一下就行&#xff0c;UEFI的貌似是按Shift不得而知&#xff0c;没操作过。下移到Advanced options for Ubuntu&#xff0c;按enter 2.根据使用的内核版本&#xff0c;选择带「recovery mode」字样的内核版本&#…...

HTML<bdo>标签

例子 指定文本方向&#xff1a; <bdo dir"rtl"> This text will go right-to-left. </bdo> <!DOCTYPE html> <html> <body> <h1>The bdo element</h1> <p>This paragraph will go left-to-right.</p> …...

STM32+W5500+以太网应用开发+003_TCP服务器添加OLED(u8g2)显示状态

STM32W5500以太网应用开发003_TCP服务器添加OLED&#xff08;u8g2&#xff09;显示状态 实验效果3-TCP服务器OLED1 拷贝显示驱动代码1.1 拷贝源代码1.2 将源代码添加到工程1.3 修改代码优化等级1.4 添加头文件路径1.5 修改STM32CubeMX工程 2 修改源代码2.1 添加头文件2.2 main函…...

【机器学习实战中阶】使用SARIMAX,ARIMA预测比特币价格,时间序列预测

数据集说明 比特币价格预测&#xff08;轻量级CSV&#xff09;关于数据集 致谢 这些数据来自CoinMarketCap&#xff0c;并且可以免费使用该数据。 https://coinmarketcap.com/ 数据集:链接: 价格预测器 源代码与数据集 算法说明 SARIMAX&#xff08;Seasonal AutoRegressive …...

各语言镜像配置汇总

镜像配置汇总 Nodejs [ npm ]Python [ pip ] Nodejs [ npm ] // # 记录日期&#xff1a;2025-01-20// 查询当前使用的镜像 npm get registry// 设置淘宝镜像 npm config set registry https://registry.npmmirror.com/// 恢复为官方镜像 npm config set registry https://regi…...

细说STM32F407单片机电源低功耗StopMode模式及应用示例

目录 一、停止模式基础知识 1、进入停止模式 2、停止模式的状态 3、退出停止模式 4、SysTick定时器的影响 二、停止模式应用示例 1、示例功能和CubeMX项目配置 &#xff08;1&#xff09;时钟 &#xff08;2&#xff09;RTC &#xff08;3&#xff09;ADC1 &#xf…...

PHP语言的循环实现

PHP语言的循环实现详解 在当今的编程世界中&#xff0c;循环是一种不可或缺的基本构造&#xff0c;它使得我们能够重复执行某些操作&#xff0c;极大地提高了代码的复用性和可读性。在PHP语言中&#xff0c;循环的种类以及使用方式繁多&#xff0c;本文将全面探讨PHP中的循环实…...

求两个矩阵的乘积

求两个矩阵的乘积 分数 15 全屏浏览 切换布局 作者 C课程组-hwr-zy 单位 浙江大学 输入三个正整数m&#xff0c;l&#xff0c;n(0<m&#xff0c;n&#xff0c;l<10)&#xff0c;再输入两个的矩阵a&#xff08;mxl&#xff09;和b&#xff08;lxn&#xff09;。要求把a和…...

警惕IDEA 2024版重大Bug问题:LomBok失效、Gradle冲突、Spring Boot启动错误

一直以来我认为工具类的软件是越新越好&#xff0c;因为工具代表着一定的先进性&#xff1b;但是IDEA 2024好好的给我上了一课&#xff0c;比如lombok 不起作用、比如Spring Boot 3.4.x 启动报错、再比如MyBatis log plus冲突、再比如Gradle插件冲突. 一、Lombok 失效问题 请不…...

Go语言的正则表达式

Go语言的正则表达式&#xff1a;深度解析与应用实例 引言 正则表达式&#xff08;Regular Expression&#xff0c;简称 regex&#xff09;是一种用于匹配字符串的强大工具&#xff0c;广泛应用于文本处理、数据验证、解析和提取等场景。Go语言作为一种现代编程语言&#xff0…...

AI圈神秘领袖Ilya一幅画引爆全网,OpenAI三件大事暗示AGI时代将至?

AI圈神秘精神领袖Ilya在Instagram上传一幅画引发疯狂解读&#xff0c;与此同时&#xff0c;OpenAI连续公布数学成果、升级Codex、筹备IPO&#xff0c;释放AGI到来的强烈信号。Ilya画作引猜测Ilya上传的画中&#xff0c;罗丹的「思考者」踩在芯片Die Shot上&#xff0c;右下角签…...

PCB的常规机械通孔与HDI工艺钻孔差异

结合常规 4 层通孔 PCB&#xff08;非 HDI&#xff09; 标准制程&#xff0c;分步骤讲清钻孔时机、先后顺序&#xff0c;区分机械通孔与板件结构&#xff0c;专业且贴合工厂实际流程。一、先明确 4 层通孔板基础结构4 层板结构&#xff1a;L1 → PP 半固化片 → L2/L3&#xff…...

告别Postman!用APIfox搞定接口测试+自动化,这份保姆级教程带你从环境配置到报告生成

从Postman到APIfox&#xff1a;接口测试自动化的高效迁移指南如果你还在为接口测试中的重复劳动和多环境切换头疼&#xff0c;是时候考虑从Postman迁移到APIfox了。作为一名经历过这个转型过程的开发者&#xff0c;我想分享一些实战经验&#xff0c;帮助你平滑过渡并最大化利用…...

氘可来昔替尼常见副作用为鼻咽炎头痛及腹泻,如何应对?

任何口服药物的临床价值&#xff0c;都必须在疗效与安全性的天平上找到精准的平衡点。氘可来昔替尼以PASI 75应答率的全面胜出证明了自己在银屑病治疗中的卓越地位&#xff0c;而其不良反应谱同样经过了严苛的临床验证。鼻咽炎、头痛和腹泻构成了这款药物最需关注的三大安全信号…...

【DeepSeek灰度发布黄金法则】:20年SRE亲授7步零故障上线实战框架

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;DeepSeek灰度发布策略全景图 DeepSeek模型服务的灰度发布并非简单的流量切分&#xff0c;而是一套融合可观测性、渐进式验证与多维熔断机制的工程化闭环体系。其核心目标是在保障线上推理稳定性的同时&…...

3分钟告别英文恐惧:Android Studio中文界面轻松切换指南

3分钟告别英文恐惧&#xff1a;Android Studio中文界面轻松切换指南 【免费下载链接】AndroidStudioChineseLanguagePack AndroidStudio中文插件(官方修改版本&#xff09; 项目地址: https://gitcode.com/gh_mirrors/an/AndroidStudioChineseLanguagePack 你是否曾经因…...

LPCM框架:大模型驱动的计算机架构设计革命

1. LPCM框架&#xff1a;计算机系统架构设计的范式革命计算机系统架构设计正站在历史性的转折点上。过去八十年来&#xff0c;从ENIAC的真空管到现代7纳米制程的异构计算芯片&#xff0c;架构设计始终遵循着"专家经验EDA工具"的传统范式。但随着摩尔定律逼近物理极限…...

用ESP32-C3的PWM做个RGB呼吸灯吧:从配置结构体到色彩渐变(乐鑫ESP-IDF实战)

ESP32-C3 RGB呼吸灯实战&#xff1a;从PWM配置到色彩渐变算法 当智能家居的灯光不再只是简单的开关控制&#xff0c;而是能像呼吸般自然渐变时&#xff0c;整个空间的氛围立刻变得生动起来。ESP32-C3凭借其出色的LED PWM控制器&#xff08;LEDC&#xff09;外设&#xff0c;为开…...

如何快速无损转换B站m4s视频:完整工具使用指南

如何快速无损转换B站m4s视频&#xff1a;完整工具使用指南 【免费下载链接】m4s-converter 一个跨平台小工具&#xff0c;将bilibili缓存的m4s格式音视频文件合并成mp4 项目地址: https://gitcode.com/gh_mirrors/m4/m4s-converter 你是否曾为B站缓存视频无法在其他设备…...

绝了!原来毕业论文还能这样写?2026降AIGC工具推荐合集

还在为查重率爆红、AI痕迹太明显、格式乱成一团而发愁&#xff1f;2026 年的 AI 论文工具早已不只是写文章那么简单&#xff0c;从选题构思到降AIGC率、去AI痕迹、查重优化&#xff0c;全流程智能辅助&#xff0c;帮你把论文写作变得简单高效&#xff0c;告别熬夜改稿的焦虑&am…...