宝哥软件园

Vue项目部署的实现(阿里云Nginx代理PM2)

编辑:宝哥软件园 来源:互联网 时间:2021-08-26

最近部署一个某视频剪辑软件项目到阿里云精英公司上,因为项目涉及一些跨域请求,所以采用了Nginx代理请求本地的结节服务(利用pm2做进程管理)。结节服务借助爱可信设置头球的推荐人、主持人转发请求,解决跨域请求问题。

先交代下在阿里云精英公司里安装的部署环境:phpstudy(php调试运行大礼包,里面包含nginx、mysql等,还能监控端口占用情况)、pm2(节点服务进程管理工具)、节点git等等。

部署过程

拉去开源代码库项目代码至根目录下(找到安装简体中文版的万维网目录),构建项目修改nginx-conf的代理配置、根项配置(指向项目项目的距离目录下)启动pm2(项目中,事先已写好服务端逻辑prod.server.js)启动简体中文版访问项目构建项目

构建项目前,要修改项目确认目录下的index.js,主要是建设部分的端口、目录,具体如下:

build: { port: 9001,//因为我是用简体中文版做网服务器的,此时php.cgi会占9000端口,所以改用9001//index.html索引:路径的模板。解析(__dirname,)./dist/index.html '),//path asset rot : path。resolve(_ _ dirname ',/dist '),assets子目录: '静态,资产公共路径: ' ',}主要有两部分

修改端口,跟代理端口一致

端口: 9001修改assetsPublicPath

assetpublipath : ' ' nginx-conf配置

利用博士研究,可以很方便的进行服务器相关设置、主机修改、端口监控等等。先来说说nginx-conf的配置。

先找到nginx-conf配置入口

修改ngin-conf

上游my _ project {服务器127。0 .0 .1:9001;keepalive 64}服务器{监听80server_name我的项目;# charset koi 8-r;# access _ log日志/主机。进入。log mainroot ' c :/phpStudy/phpttorial/WWW/project/dist ';位置/{索引index.phpindex.htmlindex.htm;proxy _ set _ header _ X-forward-For $ proxy _ add _ X _ forward _ For;proxy _ set _ header Host $ http _ Host;代理集头X-NgInx-代理为真;proxy _ http _ version 1.1 proxy _ set _ header Upgrade $ http _ Upgrade;代理集头连接"升级";proxy _ max _ temp _ file _ size 0;proxy _ pass http://my _ project/;代理重定向关闭;proxy _ read _ timeout 240s}}注意事项

根配置,指向构建后目录

root ' c :/phpStudy/phpttorial/WWW/project/dist ';设置代理端口时,避免端口占用!

上游my _ project {服务器127。0 .0 .1:9001;keepalive 64}开始部署时,使用的是9000端口,一直运行不起来,后面发现简体中文版启动是php-cgi.exe默认就使用了9000端口。关于端口使用情况,phpstudy也提供了工具。

启动pm2

关于pm2的介绍、常规使用自行了解。在项目目录下事先已经写好了转发请求的逻辑。

pro.server.js

var axios=require(' axios ')const body parser=require(' body-parser ')var config=require(' ./config/index ')var express=require(' express ')var app=express()var API路由=express .路由器()。阿皮亚路。get('/API/getdata ',function(req,RES){ var URL=' https://a.com ' axios。get(URL,{ header RS : { refer : ' https://b.com ',host: 'b.com' },params: req.query }).然后((响应)={ 0.}).catch((e)={ console。log(e)})})app。使用('/',apiRoads)应用程序。使用(快递。静态(')./dist '))var port=process。环境。端口| |配置。建造。端口模块。exports=app。listen(端口,函数(err){ if(err){ console。日志(错误)返回}控制台。日志('监听http://本地主机: '端口' n ')})这里只是简单的借助爱可信可以设置推荐人和主持人,实现代理转发的功能。

运行prod.server.js

prod.server.js是在根目录下,所以运行命令如下:

PM2开始生产。服务器。js

进程列表:

pm2开始列表

查看进程详情

pm2显示0

总结

整个部署过程涉及很多知识点,如nginx agent、节点开发部署、端口管理等。我在港口被占领的这一点上停留了一段时间。然而,目前它只实现了构建、部署和访问。但是维护成本还是比较高的,所以必须从GitHub中拉代码,在本地构建。项目完成后,研究持续集成过程。

以上就是本文的全部内容。希望对大家的学习有帮助,支持我们。

更多资讯
游戏推荐
更多+