前后端分离,两个项目域名不同,设置filter使得前后端项目能够信息交互

先来看下前端项目jsp代码:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../../../../common/commonBase.jsp"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">

<title>My JSP 'Test.jsp' starting page</title>

</head>
    <input type="button" onclick="testAjax()" value="获取数据">
<body>
    <script type="text/javascript">
        function testAjax() {

            var users = [ {
                name : '张三',
                age : '21',
                birth : '1994-12-12'
            }, {
                name : '李四',
                age : '20',
                birth : '1995-12-11'
            }, {
                name : 'wangwu',
                age : '20',
                birth : '1995-12-11'
            } ];
            
            $.ajax({
                type : 'POST',
                data : JSON.stringify(users),
                contentType : 'application/json',
                dataType : 'json',
                url : "http://localhost:8080/TestSolr/search/BaseTollgate/test",
                success : function(data) {
                    alert("OK");
                },
                error : function(e) {

                    alert("error");
                }
            });
        }
    </script>
</body>
</html>

后端项目controller信息接受代码

    @RequestMapping("/test")
    @ResponseBody
    public void test(@RequestBody User[] users){
        for (User user : users) {
            System.out.println(user.toString());
        }
    }

如果此时没有设置后端的filter的话,就会报这个错误

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin'

意思差不多就是被限制了不能够被访问到,原因我理解的就是filter禁止和本项目域名不同的地址所访问,那么知道了这个就好办了,集体解决方法如下

先在后端项目中添加一个filter类,进行代码编写,其实代码都差不多,可以直接复制上去

package com.xqsm.filter;

import java.io.IOException;
import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.commons.httpclient.HttpStatus;

public class CorsFilter implements Filter {
    public void init(FilterConfig filterConfig) throws ServletException {
    }
    public void doFilter(ServletRequest servletRequest,
            ServletResponse servletResponse, FilterChain filterChain)
            throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) servletResponse;
        HttpServletRequest request = (HttpServletRequest) servletRequest;
        // 指定允许其他域名访问
        response.setHeader("Access-Control-Allow-Origin", "*");
        // 响应类型
        response.setHeader("Access-Control-Allow-Methods",
                "POST, GET, DELETE, OPTIONS, DELETE");
        // 响应头设置
        response.setHeader("Access-Control-Allow-Headers",
                "Content-Type, x-requested-with, X-Custom-Header, HaiYi-Access-Token");
        if ("OPTIONS".equals(request.getMethod())) {
            response.setStatus(HttpStatus.SC_NO_CONTENT);
        }
        filterChain.doFilter(servletRequest, servletResponse);
    }
    public void destroy() {
    }
}
 

其中这段代码

// 指定允许其他域名访问
        response.setHeader("Access-Control-Allow-Origin", "*");

就是设置域名的访问权限了,里面的*代表着所有域名了,如果想规定哪些域名的话,就直接在里面改就行了,最后需要把我们编写好的filter放到web容器中去,也就是web.xml,在里面添加下面这段代码

    <filter>
        <filter-name>cors</filter-name>
        <filter-class>com.xqsm.filter.CorsFilter(这里是你编写的filter地址)</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>cors</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
 

最后进行前端项目访问,在到后端去看输出的信息,发现后端成功收到信息,这样就解决了项目之间的跨域问题了。。

猜你喜欢

转载自blog.csdn.net/wzhyanshen/article/details/81221901