什么是跨域
使用JS获取数据时，涉及到的两个URL只要协议，域名，端口有任何一个不同，都当做是不同的域，相互访问就会有跨域问题；
怎样使用nginx解决跨域问题
步骤一：创建两个工程AProject,BProject
步骤二：在A工程中创建servlet
package com.wn;
import com.alibaba.fastjson.JSON;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
@WebServlet("/aServlet")
public class AServlet extends HttpServlet {
//resp.setContentType("text/html;charset=utf-8");
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
doGet(req,resp);
}
//方法四：使用nginx解決跨域問題
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String username = req.getParameter("username");
System.out.println("数据："+username);
//响应
resp.getWriter().write("success");
}
}
步骤三：在B工程中创建jsp页面
<%--
Created by IntelliJ IDEA.
User: wn
Date: 2020/2/6
Time: 10:04
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>跨域</title>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script>
//使用nginx解决跨域问题
$(function () {
$("#button").click(function () {
var username=$("#username").val();
$.ajax({
url:"http://www.123.com:81/a/aServlet?username="+username,
type:"GET",
success:function (result) {
alert(result)
},
error:function () {
alert("error！！！")
}
})
})
})
</script>
</head>
<body>
<input type="text" name="username" id="username"/><button id="button" type="button">提交</button>
</body>
</html>
步骤四：配置nginx.conf文件
server {
listen 81;
server_name www.123.com;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html;
index index.html index.htm;
}
#nginx解决跨域问题
location /a {
proxy_pass http://www.aproject.com:8080/;
index index.html index.htm;
}
location /b {
proxy_pass http://www.bproject.com:8081/;
index index.html index.htm;
}
}
步骤五：启动，实现效果
使用www.123.com:81/b/bindex.jsp访问B项目中的页面
输入123文本，点击提交按钮，页面将会淡出弹出success提示框，这样就代表数据成功请求和响应；
完成之后，A项目控制台中会接收到公共页面提交的数据，并且servlet也将数据成功响应给页面；
