使用Tomcat和Nginx部署前端项目
最近在准备一个小项目来着,使用tomcat部署后端的SpringBoot项目,然后使用Nginx部署前端界面并转发后端请求到相应的tomcat集群时,发生了跨域问题,解决过程欲仙欲死,特在此记录一下。
Nginx和Tomcat结合方式 :WEB-INF WEB-INF是Java的WEB应用的安全目录。所谓安全就是客户端无法访问, 只有服务端可以访问的目录 。
前期准备 nginx 安装成功 tomcat 安装成功 更改nginx的配置文件 更改nginx.conf文件,在http/server/location层次结构下,添加proxy_pass ; 一句话即可。注意不要放了;结尾。
可以使用集群方式来部署。集群方式可以采用nginx+tomcat方式来部署两个或者多个Java web项目。原理:nginx作为集群,能够通过给出多个端口号来配合tomcat一起使用。
nginx部署多个前端项目
1、首先我们看一下nginx.conf配置文件 为了方便管理,在/usr/local/nginx/conf.d/ 创建自己的*.conf配置文件。没有conf.d目录,直接mkdir 创建conf.d .conf 详细可参考:这种方式只需要开放80端口,然后访问二级域名。
2、使用 nginx -s reload 重新载入配置文件,打开浏览器输入 域名/miniprogram 成功访问到小程序服务,接下来只需要统一修改小程序的请求前缀为 /miniprogram 就可以了,而博客项目,仍然可以通过域名直接访问。
3、发现有很多设置项,设置则设置罢了,还有限制。如下图,业务域名限制3个,JS接口安全域名限制5个。如果一个项目一个域名再加上正式测试这些环境,那完全的不够用啊。所以需要使用一个域名来搞定多个前端项目。接入方案如下。
Nginx本地部署Vue项目
1、.conf 详细可参考:这种方式只需要开放80端口,然后访问二级域名。这种方式的好处是只有一个server ,而且不需要二级域名、用路径location就能实现。但是这种方式的一个缺点,就是vue项目前端需要改配置。
2、vue项目部署必须用nginx。vue项目部署使用的是webpack提供的proxyTable做的代理从而解决了开发环境的跨域请求问题,需要使用Nginx做反向代理,因此vue项目部署必须用nginx。vue是一个构建数据驱动的web界面的渐进式框架。
3、一般项目前后端分离得话,都会用nginx作为反向代理转发的。
4、vue如果是在本地启动并且访问本地的后台方法,就需要本地代理,vue提供了vue.confug.js文件给我们配置,vue项目启动的时候都会去找到process.env(启动环境),然后再代理到后台地址。
5、Vue项目:使用docker启动nginx服务器方式代理部署。项目使用mysql0作为数据源,所以部署时需要使用docker构建mysql环境及项目自身环境。
6、Nginx配置错误。请检查Nginx配置文件中的proxy_pass配置项是否正确,确保代理到正确的服务器地址和端口。这个配置项的作用是将所有请求转发到index.html页面,以便Vue路由在前端进行处理。
nginx部署前端纯页面
进入nginx配置文件vim .../nginx-12/conf/nginx.conf。如上图所示:第一个红框中的内容就是应用服务器的地址;第二个红框中的内容就是前端包的位置。此时,配置文件已经准备完毕。这个包和端口可以存在多个。
首先我们看一下nginx.conf配置文件 为了方便管理,在/usr/local/nginx/conf.d/ 创建自己的*.conf配置文件。没有conf.d目录,直接mkdir 创建conf.d .conf 详细可参考:这种方式只需要开放80端口,然后访问二级域名。
一个前端页面,在本地直接打开就能访问。另外如果是要放到服务器下的话,可以装个nginx,或者apache,或者tomcat,直接放到网页路径下,就行。
nginx是一种功能强大且广泛应用于Web服务器的工具。它还用作多个Web应用程序服务器的前端代理服务器。本篇文章将介绍关于将Nginx服务器设置为Node.js应用程序的前端代理服务器。
现在我们只需要启动一个nginx服务器,将 server_name 设置为 fe.server.com ,然后设置相应的location以拦截前端需要跨域的请求,最后将请求代理回 dev.server.com 。
nginx前端常用配置
1、现在我们只需要启动一个nginx服务器,将 server_name 设置为 fe.server.com ,然后设置相应的location以拦截前端需要跨域的请求,最后将请求代理回 dev.server.com 。
2、进入nginx配置文件vim .../nginx-12/conf/nginx.conf。如上图所示:第一个红框中的内容就是应用服务器的地址;第二个红框中的内容就是前端包的位置。此时,配置文件已经准备完毕。这个包和端口可以存在多个。
3、首先我们看一下nginx.conf配置文件 为了方便管理,在/usr/local/nginx/conf.d/ 创建自己的*.conf配置文件。没有conf.d目录,直接mkdir 创建conf.d .conf 详细可参考:这种方式只需要开放80端口,然后访问二级域名。
4、安装node.js首先安装node.js安装所需的软件包,并在启动板上添加可用的nodejs的PPA。之后使用以下命令安装nodejs。
5、一般的配置简便,比如增加一个二级域名,只需配置一个指向。增加的nginx可扩展功能,增加对应用服务的负载均衡等。
6、PS:nginx需要安装ssl模块,如果使用docker启动的nginx则已经有了不需要安装。
nginx启动之后打不开前端页面
1、大概率就是nginx的用户权限与配置文件的用户不是一个,导致权限不足,你可以去配置文件看一下 user group 用户与nginx的用户是不是一致,不一致就改成一致,重启一下就可以了。
2、受到限制。nginx配置跨域问题本地前端起服务不生效是因为浏览器同源策略的存在使得一个源中加载来自其它源中资源的行为受到了限制导致的,只需要进行更改浏览器即可。浏览器是用来检索、展示以及传递Web信息资源的应用程序。
3、,首先提示404可能是网页本身的原因。或者是您在浏览器中插件被阻拦导致的。2,建议您可以换一个浏览器进行尝试。
4、\x0d\x0a这个与你nginx设置有关,通常是nginx设置的访问路径下没有相应的网页。!最好给出你nginx的配置文件。
5、方法2 (临时用) :首先就是直接在终端输入ulimit -n 8192,然后按回车就可以了。Error错误补充:硬盘空间满了 。使用 df -k ,然后查看硬盘空间是否满了。清理硬盘空间就可以解决500错误。