发布简单的前后端项目到 liunx系统上 通过nginx 代理

最新推荐文章于 2024-02-26 00:52:04 发布
原创 最新推荐文章于 2024-02-26 00:52:04 发布 · 217 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文详细介绍如何在Linux服务器上使用Nginx部署Vue项目，包括Node.js与Nginx的安装、Vue前端文件的放置及nginx.conf配置，解决静态文件访问问题。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

第一次是window 上直接启动的所以没有用到nginx 后来发布到liunx 所以才用 nginx
在服务器上安装node.js
安装 nginx
将vue前端文件放在目录下面
然后在配置 nginx。conf 文件

静态文件找不到的原因是因为
在打包的时候在这里插入图片描述
这里默认的就没有 “./” 所以就不需要去动 这个配置
之前在这里面加了 。/ 静态文件 比如照片 等背景图

如果是上传到服务器上面的 的文件 要能访问的话可以采用一个 路径去指定
详情请看 https://mp.youkuaiyun.com/mdeditor/93852256# 这条博客 nginx 的相关配置里面都有

Linux搭建nginx，在window环境中访问。
Junit的博客
08-27 1470
Linux搭建nginx，在window环境中访问。 一、搭建前提： 1、安装Linux，并配置nginx支持的环境，配置ip。 2、准备nginx安装软件包或者配置外网使用yum安装。 3、win环境能访问Linux ，注意防火墙设置。 二、服务启动/停止 在Linux中不同版本的系统命令有区别，当前使用（本人）centos启动命令： ./nginx 停止服务：./ng...
Linux/openEuler系统部署spring boot+vue前后端分离项目（nginx均衡代理）
qq_45149926的博客
03-20 799
配置 Nginx，配置文件位于 /etc/nginx/nginx.conf。或 /usr/local/nginx/conf/nginx.conf。查看Nginx路径 whereis nginx。打包成功后在项目文件路径下出现。（如果从源码编译安装）。
如何用nginx在linux上部署项目
weixin_42929948的博客
05-18 1103
1.将项目打包 在项目的根目录输入命令ng build -prod；会在根目录下生成一个dist文件夹，就是打包的文件 2.安装nginx（如果linux服务器上有则跳过） 自行安装即可 3.将打包文件复制到linux的/usr/local/ngWeb下 百度搜xftp，下载后打开软件输入连接的机器ip，用户名和密码，直接复制到相关目录下 4.配置nginx，在conf/nginx.conf目录里面配置 #user nobody; worker_processes 1; #error_log
如何在windows上通过nginx反向代理部署前后端项目
杜盟恩的博客
02-24 1653
我们一般是在linux上部署项目，但是公司内出现测试的linux服务器被征用，测试人员又要登录系统测试。我们的研发网络测试人员无法ping 通（他没有权限连接研发网络）。我想了一下，我的办公电脑和他在同一个网络，之前又安装了jdk8，redis开发环境，故灵机一动，就在办公环境暂时部署了。 基础环境：windows jdk8并配置系统变量 redis(看你系统需不需要) nginx 后端jar包文件 前端文件等 在此说明一下，我的后端是jar包，如果你的是class文件，可以放to
windows7及以上系统千万别用nginx做代理,性能不升反降
Stand by
08-16 1万+
上周末在家闲的没事干,突然想对nginx做个性能测试,看看到底比tomcat快多少.. 然而...结果是....快了-200%.... 注意是前面有个负号.. 当时的测试是100个线程*100次请求 大概数据是这样的,平均响应tomcat是28ms左右,nginx是80ms左右... 然后百思不得其解...故找了个QQ群交流了一下... 得到的答案是,由于windows不支持nginx
liunx前后端分离项目部署
weixin_74454158的博客
02-25 630
文章目录1、nginx的安装和自启动 1、nginx的安装和自启动
Linux之安装Nginx、前后端分离项目部署
2301_81825749的博客
02-26 1377
服务器1 weight是权重的意思，权重越大，分配的概率越大。#服务器2 weight是权重的意思，权重越大，分配的概率越大。#^~/api/表示匹配前缀是api的请求，proxy_pass的结尾有/， 则会把/api/*后面的路径直接拼接到后面，即移除api。然后去刚刚复制好的8081跟8082端口的tomcat，改一下端口，端口不能重复最简单的方法就是+1。首先去到Nginx的目录cd /usr/local/nginx/conf/# 安装编译一下，一般我们编译完后/usr/local/
Liunx--nginx负载均衡--前后端分离项目部署
2201_75455485的博客
02-25 1609
Nginx是一个，它以其轻量级、占用资源少、并发能力强而广受欢迎。详细介绍。
将前后端项目部署到Linux服务器上后，前端无法访问到后端解决方式（vue+SpringBoot）
热门推荐
qq_44089649的博客
05-04 1万+
问题一：https跨域问题 下面举了三个前后端分离项目的例子，配置都差不多，只不过我想写详细一些给你们看，因为我配置第一个项目的时候还好，但是配置第二个项目遇到了一些问题。所以多写几个例子，方便大家看的明白一些。 修改vue项目中 config 下的 index.js 配置文件，加上代理 dev: { assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: { '/api': { //代理标识 tar
Linux系统中Nginx实现前后端分离
hzhahsz的博客
06-30 1434
一、linux安装nginx 安装nginx 1 yum install -y openssl openssl-devel 2 yum install gcc-c++ 3 yum install -y pcre pcre-devel 4 yum install -y zlib zlib-devel 5 cd /usr/local/ 6 ...
服务器通过nginx传输文件,nginx将文件类型传递给后端服务器
weixin_42619742的博客
08-04 2076
我正在尝试设置Nginx来处理文件上传,并在完成后将文件信息传递到后端服务器.我在https://coderwall.com/p/swgfvw发现了一个帖子,显示了如何执行此操作,我能够看到一个文件被上传到/ tmp目录.但是,我还想将文件名和类型(Content-Disposition和Content-Type)传递给后端服务器.我尝试捕获在http服务器端口收到的内容并查看下面的内容,POST...
大数据之nginx+js点击流日志采集服务部署详解
我壮壮壮的博客
12-30 2380
点击流日志采集服务部署 1、服务器中安装依赖 yum -y install gcc perl pcre-devel openssl openssl-devel   2、上传LuaJIT-2.0.4.tar.gz并安装LuaJIT tar -zxvf LuaJIT-2.0.4.tar.gz -C /usr/local/src/ cd /usr/local/src/LuaJIT-2.0.4
Java项目部署到服务器-Nginx
越过山丘
11-23 6317
Java项目部署到服务器-Nginx 打包 设置pom.xml中bulid标签的finalName，设置为工程名，eg：<finalName>comi_single_blog</finalName> 使用idea的侧边栏的maven快捷命令1.maven-clean 2.maven-install 随后在工程文件下下出现target文件夹，其中*.war就是我们已经打包好了...
前后端分离的项目如何部署发布到Linux
zcxbd的博客
05-30 6509
前后端分离的项目如何部署发布到Linux 前期准备 1、服务器的基本配置信息 2、本机远程连接服务器的工具（xshell、xftp或者mobaXterm等等，看你自己喜欢） 第一步：部署环境 1、安装jdk 2、安装tomcat 3、安装数据库（MySQL、Oracle） 4、安装redis（如果项目用到的话） 5、安装apache2（用于前端部署） 第二步：打包项目 1、打包前端（npm run...
使用nginx前后台项目打包发布
无知者无畏
05-14 1202
使用nginx前后台项目打包发布： 进入前端项目：cd client 打包文件：npm run build 打包完成，生成dist目录（复制dist目录下的所有文件） 下载nginx http://nginx.org/en/download.html 然后在nginx下载的目录中，运行：.\nginx.exe 在浏览器测试：http://localhost:80，提示：Welcome to nginx! 然后在nginx下载目录下，新建www目录 / 新建movie-info文件夹（dist目录中的
linux上安装nginx 并配置前后端
小菜鸟--成长之路的博客
07-23 5413
环境准备： 1.因为Nginx依赖于gcc的编译环境，所以，需要安装编译环境来使Nginx能够编译起来。 命令：yum install gcc-c++ 2.Nginx的http模块需要使用pcre来解析正则表达式，需要安装pcre。 命令：yum install -y pcre pcre-devel 3.安装依赖的解压包。 命令：yum install -y zlib zlib-devel 4.ssl 功能需要 openssl 库，安装 openssl。 命令：yum install -y
中孚密保卫士是由中孚信息股份有限公司开发的一款信息安全产品，主要用于终端计算机的保密管理和数据防泄漏 它主要面向政府机关、军工单位、科研院所等对信息安全有较高要求的涉密单位，帮助其实现对涉密信息的全
最新发布
08-14
终端保密管理：对计算机终端的操作行为进行监控和审计，防止违规外联、非法拷贝、打印、截屏等行为。 数据防泄漏（DLP）：通过内容识别、加密、权限控制等手段，防止敏感或涉密数据通过U盘、网络、邮件等途径泄露。 文件加密与权限控制：对涉密文件进行透明加密，确保文件在授权范围内使用，防止未授权人员查看或传播。 行为审计与日志记录：详细记录用户的操作行为（如文件访问、外发、打印等），便于事后追溯和审计。 违规外联监控：防止涉密计算机违规连接互联网或其他非授权网络，保障网络边界安全。 移动存储介质管理：对U盘、移动硬盘等设备进行授权管理，区分普通盘和专用盘，防止非法数据拷贝。
Python批量发送短信验证码的实现方法.doc
08-14
Python批量发送短信验证码的实现方法.doc
vue spring前后端分离项目部署到liunx虚拟机
03-23
### 部署 Vue 和 Spring 构成的前后端分离项目的教程 以下是将 Vue 和 Spring 构建的前后端分离项目部署到 Linux 虚拟机的具体流程： #### 1. 准备工作 确保已经准备好以下资源： - 已经开发完成并打包好的前端 (Vue) 和后端 (Spring Boot) 项目文件。 - 可访问的 Ubuntu 或其他 Linux 发行版虚拟机。 --- #### 2. 后端项目部署 ##### a. 连接服务器 通过工具 FinalShell 或者 SSH 命令连接至目标 Linux 虚拟机[^3]。 ##### b. 安装 Java 环境 如果尚未安装 JDK，可以通过以下命令安装 OpenJDK： ```bash sudo apt update && sudo apt install default-jdk -y ``` 验证安装成功： ```bash java -version ``` ##### c. 配置 Spring Boot 应用程序 上传已构建好的 `.jar` 文件到服务器指定目录（如 `/home/springboot/`），并通过以下命令启动应用程序： ```bash nohup java -jar your-spring-boot-app.jar > app.log 2>&1 & ``` 其中 `your-spring-boot-app.jar` 是实际的应用名称。日志会保存在当前路径下的 `app.log` 中以便后续排查问题[^1]。 调整配置文件中的 IP 地址为服务器公网地址或者本地回环地址 (`0.0.0.0`)，使得外部可以正常访问 API 接口。 --- #### 3. 前端项目部署 ##### a. 安装 Nginx Nginx 将作为反向代理来处理静态资源请求以及转发给后端接口调用。执行如下操作安装 Nginx： ```bash sudo apt update && sudo apt install nginx -y ``` 检查状态确认运行无误： ```bash systemctl status nginx ``` ##### b. 静态资源配置 将编译后的 Vue 项目文件夹复制到默认网站根目录 `/var/www/html/` 下面，并修改其权限允许读取内容： ```bash cp -r dist/* /var/www/html/ chmod -R 755 /var/www/html/ ``` 编辑站点配置文件以支持 SPA 单页面应用模式，在 `/etc/nginx/sites-available/default` 添加重写规则： ```nginx location / { try_files $uri /index.html; } ``` 最后重启服务使更改生效： ```bash sudo systemctl restart nginx ``` 对于更复杂的场景可能还需要设置跨域资源共享 CORS 头部信息或其他安全措施[^4]。 --- #### 4. 测试与优化 打开浏览器输入域名或 IP 访问首页查看效果；同时利用 Postman 等工具测试 RESTful APIs 是否能够正确返回数据。若有异常则查阅后台打印的日志定位错误原因。 --- ### 注意事项 - **防火墙开放必要端口**：确保 HTTP(80)/HTTPS(443)，还有自定义的服务监听端口号未被屏蔽掉。 - **性能监控与扩展能力规划**：随着业务增长考虑引入负载均衡器、缓存机制等手段提升用户体验质量。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值