记一次nginx部署前端代码的坑

最新推荐文章于 2025-01-17 20:28:16 发布
原创 最新推荐文章于 2025-01-17 20:28:16 发布 · 665 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#nginx

本文详细介绍了在内网环境中部署前端项目的过程，包括手动下载并安装NG所需的rpm包，以及解决依赖环境和编译器的问题。文章还分享了如何配置nginx.conf，确保正确监听端口，并解决了访问不到index页面的常见问题。

 最近公司需要通过ng部署一个前端项目，于是在服务器上下咋了ng，但是安装时候又发现依赖一些环境和编译器。但是公司又是内网环境无法直接yum进行下载，只好手动现在rpm并且安装。需要的依赖如下所示

点击此处下载rpm

然后执行 rpm -ivh example.rpm进行安装，后续就可以进行ng的编译。

编译命令如下(在编译ng前也需要同理编译pcre)

cd nginx目录

./configur

make

make install

最后进行nginx.conf的配置

监听的端口默认为80，需要修改为没有被占用，且被防火墙开放了的端口。当配置好后一直访问不到index页面。最后尝试添加try_file $uri $uri $uri/ /index.html于是就能成功访问到了

 

使用docker-compose使用Nginx镜像部署前端代码常见问题
洛阳泰山的博客
10-28 1182
在使用 docker-compose 部署 Nginx 镜像运行前端代码时，开发者常遇到配置文件错误、端口映射冲突、静态文件加载失败等问题。本文总结了常见的部署问题及其解决方法，包括：确保 Dockerfile 和 docker-compose.yml 文件正确配置、检查 Nginx 配置文件路径与权限、避免端口占用冲突、以及正确挂载前端静态资源目录。此外，还强调了调试技巧，如通过 docker logs 查看容器日志，使用 docker exec 进入容器排查问题。遵循这些最佳实践，可以有效提升部署效率并
【前端 22】使用Nginx部署前端项目
delepaste的博客
08-03 1692
在前端开发中，将项目打包并部署到服务器上是一个常见的需求。下面，我将详细介绍如何使用Nginx部署一个前端项目，并展开讲解Nginx的目录结构以及如何处理端口占用问题。文件部署到Nginx之前，了解Nginx的目录结构是非常有帮助的。通过这些步骤，你可以轻松地将前端项目打包并部署到Nginx服务器上，同时处理可能遇到的端口占用问题。目录会包含所有构建后的文件，这些文件是浏览器可以直接访问的静态资源。等）将项目打包成静态文件，并输出到指定的目录，通常是。（或你设置的任何其他端口）来访问你的前端项目了。
测试 Nginx 作为前端下各种模式的性能
04-27 148
测试环境： 1：Nginx 独立处理静态面页请求 5000,开了60个线程 2：Nginx作为前端请求转给 Weblogic 12c 处理 (Spring 4.0平台下的动态面页效果如图) 3：Nginx作为前端请求转给 2个Tomcat+Terracotta集群 处理 (Spring 4.0平台下的动态面<和weblogic 12c同一应用>页效果如图) ...
nginx 解决css、js请求路径无法加载问题
wangchaoqi1985的博客
10-18 1590
nginx 解决css、js请求路径无法加载问题
前端nginx部署 以及遇到的问题
qq_42479987的博客
07-01 748
配置nginx的时候，启动的时候报错1067 检查logs日志信息发现是root的目录有问题，目录信息不能有空格 nginx命令： start nginx 启动 nginx -s stop 停止 nginx -s quit 安全退出 nginx -s reload 重新加载配置文件 如果链接不成功，要查看服务器端口是否开放 在指定端口启动jar包 java -jar XXXXX.jar --server.port=8081 反向代理负载均衡配置 upstream test
Nginx部署Vue项目css文件能加载但是不生效
彭世瑜的博客
06-13 848
Nginx部署打包后的Vue项目css文件能加载但是不生效，所以在nginx配置文件上引入一个类型文件就可以。重启nginx后，css文件生效，显示正常了。查看响应标头，发现不对劲，
nginx部署前端代码出现的问题
weixin_43011230的博客
04-22 333
/api不生效，两三天没找到问题，最后发现vue.config.js 文件里的关键字写错了：module.exports 少写了个s，server少写了个r 。
使用nginx部署前端项目（超详细教程）.pdf
04-29
【使用Nginx部署前端项目】的教程是一个详尽的指南，主要面向初学者，旨在教会读者如何利用Nginx高效地部署前端应用。Nginx是一个高性能的Web服务器和反向代理，因其高并发处理能力和低内存占用而受到广泛青睐。 ...
【Nginx 】Nginx 部署前端 vue 项目
m0_74825746的博客
01-17 1745
在两种系统中，安装Nginx的过程都相对简单，主要区别在于使用的软件包管理器不同。这包括访问Vue应用的主页，以及尝试访问应用中的各个路由，确保它们都能正确加载。文件中列出的依赖项进行下载和安装，这个过程通常需要联网操作，并且依赖于npm仓库的响应速度。在网络状况良好的情况下，安装过程可以顺利完成。在CentOS或RHEL系统上安装Nginx的过程与Ubuntu/Debian略有不同，主要体现在软件包管理器的使用上。在项目部署之前，确保开发环境中已安装Node.js和npm，这是运行Vue项目的基础。
使用 Nginx部署前端项目
blue_121的博客
05-23 3353
windows系统右键我们下方任务栏的黑色部分，打开任务管理器，看下nginx是否启动。，这是一个非常重要的文件，用来配置nginx服务器，默认的配置也存放在此。以windows版为例，下载后，将其解压到 本地的任一目录下；，把解压的文件放在里面，此时我们可以看到有如下目录。然后用vscode代码编辑器打开解压文件夹下的。
nginx部署后常见问题解决办法
weixin_33840661的博客
09-13 326
问题1：后台程序存在线程的时候跑不起来 uwsgi 默认one thread one processor ,所以在没有请求的时候，导致部分进程被挂起。 解决方法： 在uwsgi配置中添加--**enable-threads = true** ，问题解决 问题2：nginx部署后静态资源不加载 首先到nginx目录下 找到配置文件（...
Nginx断点续传功能代码浅析-Range模块
11-15 9303
HTTP 的Content-Range支持对于一般的网页处理没啥重要的作用，但是对于大文件的下载，CDN回源，点续传功能的作用是非常重要的。 Content-Range允许一次只下载一个文件的一部分，后面再分批次下载文件的其他部分，或者并发下载，提高下载速度，这样如果在下载一个文件的过程中，网络断开了，恢复后不需要重新下载。 nginx 对Content-Range的支持包括header处理和
最简单的语言讲清楚chmod和Linux权限以及Vue项目如何部署在nginx的子目录下
♀我爱摇滚，更爱金属乐♀
02-08 746
切记：每一次yarn build完了之后上传到服务器，都要执行一次chmod -R 755 test。现在给本尊全部权限(rwx)，算出第一位数：rwx 就是 4+2+1 = 7。给用户组读写（rw）权限，算出第二位数：rw-就是：4+2+0 = 6。给其他用户读权限®，算出第三位数：r–就是：4+0+0 = 4。(本人：读+写+执行 组：读+执行 其他用户：读+执行）好了，现在回到vue部署在服务器子目录下无法访问的问题。【-R表示将某个子目录的全部文件改成764权限】
前端项目快速部署到 Nginx 服务器 及 常见问题
zic_liu的博客
07-12 1767
知识点 什么是 Nginx? Nginx 是一个高性能的http服务器及反向代理服务器 Nginx 的特点？ 热部署；可以高并发连接；cpu、内存等资源消耗却非常低；运行非常稳定；处理响应请求很快等 应用场景？ http服务器。Nginx是一个http服务可以独立提供http服务。可以做网页静态服务器。（本文重点） 虚拟主机。可以实现在一台服务器虚拟出多个网站。例如个人网站使用的虚拟主机。 反向代理，负载均衡。当网站的访问量达到一定程度后，单台服务器不能满足用户的请求时，需要用多台服务器集群可以使用ng
web前端nginx部署项目
wsj1156912876的博客
02-27 249
nginx -s reload 修改完后 :wq 保存文件配置，输入命令重启nginx。# vi nginx.conf 修改nginx.conf配置文件中的项目目录。# whereis nginx //查看是否有nginx路径。# nginx -v //查看nginx版本。8.重新输入命令启动nginx服务，并查看nginx服务状态。# cd /etc/nginx 进入nginx文件夹。3.重新输入命令安装nginx。
配置nigix之后页面静态资源加载不到报错： This request has been blocked; the content must be served over HTTPS...
banglai2981的博客
03-15 1490
问题抛出：如何在HTTPS 网页中引入HTTP资源： Mixed Content？ 问题原因：HTTPS页面里动态的引入HTTP资源，比如引入一个js文件，会被直接block掉的.在HTTPS页面里通过AJAX的方式请求HTTP资源，也会被直接block掉的。 解决方案：<meta http-equiv="Content-Security-Policy" content="up...
centos 部署前端文件后出现访问403的情况
cheng_ji的专栏
07-25 1217
2. 检查 Apache 或 Nginx 配置：如果你正在使用 Apache 或 Nginx 作为 Web 服务器，在相应的配置文件中检查是否设置了正确的文档根目录（Document Root）以及允许访问的权限选项。如果仍然遇到问题，建议查看服务器的错误日志文件，通常位于 `/var/log/httpd/error_log` 或 `/var/log/nginx/error.log`，以获取更详细的错误信息，有助于进一步排除问题。1. 确认文件权限：确保所部署的前端文件和文件夹具有正确的权限。
解决 把前端端口 用Nginx 暴露出来一直无效
qq_30346433的博客
05-21 930
情况： 今天遇到一个问题。我用nginx 暴露了 8080 端口 lemon-web-8080.conf 文件如下 我执行 命令： nginx -t 再执行：nginx -s reload 都是正常的。 问题 我查看监听端口：netstat -luntp|grep nginx 就是没有监听 8080 端口。 解决 是因为 conf.d 文件夹下面 有一个official-web-8001.conf 配置文件，同时，我在 lemon-web-8080.conf 中 重定向到 80...
Nginx项目代码改了但是内容没变化（Nginx项目重启）
qq_36256190的博客
11-21 6761
解决办法 今年暑假的时候开始接触做项目，其中要用到nginx搭建web服务器，遇到一点小问题----项目代码改了但是内容没变化，折腾了很久结果发现是没有重启造成的，下面说一下要怎么重启。 step1:启动自己的虚拟环境； source activate step2:杀掉所有进程（如果你的服务器有超过一个项目最好去网上找别的方法，killall太强势了，你懂得。。。）； killall -...
阿里云服务器nginx部署前端代码
最新发布
04-02
要在阿里云服务器上使用 Nginx 部署前端项目，可以按照以下方法操作： #### 1. 登录并连接到阿里云服务器 首先需要登录到阿里云管理控制台，找到对应的 ECS 实例，并通过 SSH 或其他工具进行远程连接。 #### 2. ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值