网站首页 > 技术教程 正文
说明
现在的Java Web项目好多都使用前后端分离的开发部署方式,这样的好处有很多,比如:可以实现真正的前后端解耦,可以减少后端服务器的并发/负载压力,方便实现多端应用(网页端、移动端共用一个后台服务)、增加代码的维护性&易读性。一般我们会采用Nginx来部署前端代码,使用Tomcat来部署后台服务。最近在Windows系统中使用Nginx部署前端代码时调用后台服务时出现了跨域的报错,通过对Nginx的一些代理配置可以解决这个问题,下面给大家分享一下在Nginx中部署前端代码并解决跨域问题的方法步骤。
解决跨域问题的思路:出现跨域问题的原因在于静态资源的访问地址是Nginx服务器的地址,比如http://ip1:port1,然后我们在静态页面中通过ajax请求后台服务获取数据,后台服务的地址是http://ip2:port2,这两个地址的ip端口不同,就导致了跨域问题的出现,那我们就需要访问一个和前端页面具有相同地址的后台服务才会避免跨越问题,可以设置一个代理,比如我们把后台服务访问地址换成http://ip1:port1/api/,然后通过一定的配置将http://ip1:port1/api/地址收到的请求转发到真正的后台服务地址http://ip2:port2,这样就可以避免跨域问题的出现。
在html目录下面放静态资源
把我们要部署的静态资源文件夹放到Nginx的html目录下面,例如testpage文件夹下面有一个index.html页面,直接把testpage文件夹放到Nginx的目录下面。
配置反向代理
打开Nginx conf目录下面的nginx.conf文件,在第一个server里面添加一个location对前端发送的服务调用请求地址进行过滤,配置如下:
location /api/ {
rewrite ^/api/(.*)$ /$1 break; #所有对后端的请求加一个api前缀方便区分,真正访问的时候移除这个前缀
# API Server
proxy_pass http://127.0.0.1:8092; #将真正的请求代理到真实的服务器地址,ajax的url为/api/user/1的请求将会访问http://127.0.0.1:8092/user/1
}
经过上面的配置以后,我们的前端资源访问地址和ajax请求的后台服务地址就可以保持一致,从而避免了跨域问题的出现。
启动Nginx
首先在cmd命令窗口中切换到nginx所在的目录,然后输入命令:
start nginx.exe
停止Nginx
在cmd命令窗口中输入:
nginx.exe -s stop
注意事项
1、有时候使用命令nginx.exe -s stop停不掉Nginx,可以使用命令taskkill /f /t /im nginx.exe强制关闭Nginx进程。
- 上一篇: nginx允许IP访问不生效问题「原创」
- 下一篇: 本地开发时 windows启动和关闭nginx
猜你喜欢
- 2024-10-10 vue项目如何打包部署并用Nginx做代理访问
- 2024-10-10 WINDOW下Nginx反向代理相关设置(nginx做反向代理配置)
- 2024-10-10 window下配置nginx的坑(nginx windows环境配置)
- 2024-09-16 windows 10 下docker布置nginx+php环境,用宿主WEB目录负载均衡
- 2024-09-16 宝塔面板开启反向代理后,怎么自动续签Let's Encrypt免费SSL证书
- 2024-09-16 Window上部署Nginx 出现error log太大导致磁盘空间占满
- 2024-09-16 一文理清负载均衡(nginx,LVS)的工作原理
- 2024-09-16 Nginx+Tomcat集群实现负载均衡(windows版)
- 2024-09-16 聊聊CDN与高性能流媒体服务器的关键技术设计
- 2024-09-16 nginx 配置服务启动的教程详解(nginx启动时指定配置文件)
你 发表评论:
欢迎- 最近发表
-
- Linux新手必看:几种方法帮你查看CPU核心数量
- linux基础命令之lscpu命令(linux中ls命令的用法)
- Linux lscpu 命令使用详解(linux常用ls命令)
- 如何查询 Linux 中 CPU 的数量?这几个命令要知道!
- 在linux上怎么查看cpu信息(linux如何查看cpu信息)
- 查看 CPU 的命令和磁盘 IO 的命令
- 如何在CentOS7上改变网卡名(centos怎么改网卡名字)
- 网工必备Linux网络管理命令(网工必备linux网络管理命令是什么)
- Linux 网络命令知多少(linux 网络 命令)
- Linux通过命令行连接wifi的方式(linux命令行连接无线网)
- 标签列表
-
- 下划线是什么 (87)
- 精美网站 (58)
- qq登录界面 (90)
- nginx 命令 (82)
- nginx .http (73)
- nginx lua (70)
- nginx 重定向 (68)
- Nginx超时 (65)
- nginx 监控 (57)
- odbc (59)
- rar密码破解工具 (62)
- annotation (71)
- 红黑树 (57)
- 智力题 (62)
- php空间申请 (61)
- 按键精灵 注册码 (69)
- 软件测试报告 (59)
- ntcreatefile (64)
- 闪动文字 (56)
- guid (66)
- abap (63)
- mpeg 2 (65)
- column (63)
- dreamweaver教程 (57)
- excel行列转换 (56)
本文暂时没有评论,来添加一个吧(●'◡'●)