React连接后台,解决跨域问题.

第一步在web.xml文件导入文件

  
      cors  
      com.mr.filter.SimpleCORSFilter  
	 
	 
	  
	      cors  
	      /*  
	
	

第二部新建一个工具类

package com.mr.filter;
import javax.servlet.*;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

public class SimpleCORSFilter implements Filter {

    @Override
    public void destroy() {
    }

    @Override
    public void doFilter(ServletRequest req, ServletResponse res,FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        // 哪些方法或者路径可以请求进来   * 代表所有 
        response.setHeader("Access-Control-Allow-Origin", "*");
        // 可以进行请求的 请求方式  如 get  post
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
        // 请求保持的最长时间
        response.setHeader("Access-Control-Max-Age", "3600");
        // 请求的类型
        response.setHeader("Access-Control-Allow-Headers", "*");
        chain.doFilter(req, res);
    }

    @Override
    public void init(FilterConfig arg0) throws ServletException {
    }

}

第三部在react中发送axios请求就可以访问到了

axios.get('http://localhost:8080/react_navlink/foot/queryList.do',{
            params:{
                footStyleId:this.props.match.params.id,
                page:page,
                rows:pageSize,
            },

你可能感兴趣的:(React)