网站首页 > 技术文章 正文
说明
现在的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进程。
猜你喜欢
- 2024-12-10 SpringBoot与Vue交互解决跨域问题「亲测已解决」
- 2024-12-10 详细介绍在Spring Boot项目中如何解决跨域问题?
你 发表评论:
欢迎- 07-07使用AI开发招聘网站(100天AI编程实验)
- 07-07Tailwindcss 入门(tailwindcss中文文档)
- 07-07CSS 单位指南(css计量单位)
- 07-07CSS 定位详解(css定位属性的运用)
- 07-07程序员可以作为终身职业吗?什么情况下程序员会开始考虑转行?
- 07-07云和学员有话说:国企转行前端开发,斩获13K高薪!
- 07-0791年转行前端开发,是不是不该转,有啥风险?
- 07-07计算机图形学:变换矩阵(图形学 矩阵变换)
- 595℃几个Oracle空值处理函数 oracle处理null值的函数
- 587℃Oracle分析函数之Lag和Lead()使用
- 575℃0497-如何将Kerberos的CDH6.1从Oracle JDK 1.8迁移至OpenJDK 1.8
- 572℃Oracle数据库的单、多行函数 oracle执行多个sql语句
- 568℃Oracle 12c PDB迁移(一) oracle迁移到oceanbase
- 561℃【数据统计分析】详解Oracle分组函数之CUBE
- 548℃最佳实践 | 提效 47 倍,制造业生产 Oracle 迁移替换
- 541℃Oracle有哪些常见的函数? oracle中常用的函数
- 最近发表
- 标签列表
-
- 前端设计模式 (75)
- 前端性能优化 (51)
- 前端模板 (66)
- 前端跨域 (52)
- 前端缓存 (63)
- 前端react (48)
- 前端aes加密 (58)
- 前端脚手架 (56)
- 前端md5加密 (54)
- 前端路由 (61)
- 前端数组 (73)
- 前端js面试题 (50)
- 前端定时器 (59)
- 前端懒加载 (49)
- 前端获取当前时间 (50)
- Oracle RAC (73)
- oracle恢复 (76)
- oracle 删除表 (48)
- oracle 用户名 (74)
- oracle 工具 (55)
- oracle 内存 (50)
- oracle 导出表 (57)
- oracle 中文 (51)
- oracle的函数 (57)
- 前端调试 (52)
本文暂时没有评论,来添加一个吧(●'◡'●)