Nginx反向代理跨域请求处理
跨域报错信息
Nginxtest.html:1 Access to XMLHttpRequest at 'http://localhost:8082/SSM2/rest/public/nginxtest' from origin 'http://localhost:8083' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
接收请求服务器8082端口
1.后台代码
package com.yh.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
/**
* @program: SSM2
* @Date: 2018/11/12 17:55
* @Author: Mr.Zheng
* @Description:
*/
@Controller
public class NginxController {
@RequestMapping(value = "/rest/public/nginxtest" ,method = RequestMethod.GET)
@ResponseBody
public void nginxtest(){
System.out.println("进入nginx测试");
String str = "跨域请求成功!";
}
}
发送服务器8083端口
2.前台代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>nginx跨域测试</title>
<script src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#btn").click(function () {
$.ajax({
url: "http://localhost:800/SSM2/rest/public/nginxtest", //一定要访问nginx配置路径
type: "GET",
dataType: "json",
success: function (data) {
alert(data);
//var result = JSON.stringify(data); //json对象转成字符串
}
});
});
});
</script>
</head>
<body>
跨域请求8082端口服务器资源测试<br/>
结果:<div id="show"></div><br/>
<input id="btn" type="button" value="跨域获取数据" />
</body>
</html>
首先,要安装nginx800服务器
配置单个代理服务器
3.nginx服务器配置文件nginx.conf
upstream tomcat_server{
server localhost:8082;
}
server {
listen 800; #nginx端口号可以随意修改,只要端口号不被其它占用
server_name localhost; #nginx服务器可以是服务器IP
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html;
index index.html index.htm;
proxy_pass http://tomcat_server; #配置代理服务器
# 当用webpack-dev-server等中间件代理接口访问nignx时,此时无浏览器参与,故没有同源限制,下面的跨域配置可不启用
#add_header Access-Control-Allow-Origin *; #当前端只跨域不带cookie时,可为*
#add_header Access-Control-Allow-Credentials true;
#add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
#add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
#if ($request_method = 'OPTIONS') {
# return 204;
#}
}
nginx配置多台服务器
upstream tomcat_server{
server localhost:8082 weigth=2; #weigth权重 数字越大权重越大,服务器优先被访问
server 192.168.1.200:8080 weight=1; #当localhost:8082挂掉,就访问本服务器
}
server {
listen 800; #nginx端口号可以随意修改,只要端口号不被其它占用
server_name localhost; #nginx服务器可以是服务器IP
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html;
index index.html index.htm;
proxy_pass http://tomcat_server; #配置代理服务器
# 当用webpack-dev-server等中间件代理接口访问nignx时,此时无浏览器参与,故没有同源限制,下面的跨域配置可不启用
#add_header Access-Control-Allow-Origin *; #当前端只跨域不带cookie时,可为*
#add_header Access-Control-Allow-Credentials true;
#add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS';
#add_header Access-Control-Allow-Headers 'DNT,X-Mx-ReqToken,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Authorization';
#if ($request_method = 'OPTIONS') {
# return 204;
#}
}
nginx服务器使用
1.打开cmd,cd到服务器安装好的路径下
I:\nginx>cd nginx
2.启动服务器方式一:
输入命令 nginx.exe 或者 start nginx ,回车即可
2.启动服务器方式二:直接双击nginx.exe,双击后一个黑色的弹窗一闪而过
3.检查nginx是否启动成功
页面显示:则成功
Welcome to nginx!
4.关闭nginx
如果使用cmd命令窗口启动nginx,关闭cmd窗口是不能结束nginx进程的,可使用两种方法关闭nginx。
(1)输入nginx命令 nginx -s stop(快速停止nginx) 或 nginx -s quit(完整有序的停止nginx)
(2)使用taskkill taskkill /f /t /im nginx.exe
5.重启nginx服务器:修改配置文件后可以使用此命令。
I:\nginx>nginx -s reload
参考:
https://www.cnblogs.com/jiangwangxiang/p/8481661.html nginx服务器下载、安装和使用
https://www.cnblogs.com/moqiutao/p/8567796.html 跨域请求的几种处理方式