[网络协议] 跨域设置，前后端的分离，采用ajax进行交互

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> 网络协议 -> 跨域设置，前后端的分离，采用ajax进行交互 -> 正文阅读

[网络协议]跨域设置，前后端的分离，采用ajax进行交互

前端使用的是Hbuilder，后端idea

js采用的是layui框架

首先随便写一个查询界面

包结构，前面的文章已经说明包该怎么建，Result对象用来前后端的传递

跨域设置，及其代码

CORSFilter

package com.lxd.filter;
/*这个文件是跨域设置*/
import javax.servlet.*;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
public class CORSFilter implements Filter {
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {

    }

    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException, IOException {

        HttpServletRequest request=(HttpServletRequest)servletRequest;
        HttpServletResponse response=(HttpServletResponse)servletResponse;

        response.setCharacterEncoding("UTF-8");
        //response.setContentType("application/json; charset=utf-8");
        response.setHeader("Access-Control-Allow-Origin",request.getHeader("Origin"));
        //response.setHeader("Access-Control-Allow-Origin","http://192.168.90.46:8848");
        //response.setHeader("Access-Control-Allow-Origin","*");//允许所有域名跨域访问该资源，根据项目实际需要可以设置允许特定的域名访问
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE,PUT");//允许的跨域请求方式
      /*每次异步请求都发起预检请求，也就是说，发送两次请求。第一次是浏览器使用OPTIONS方法发起一个预检请求，第二次才是真正的异步请求，第一次的预检请求获知服务器是否
      允许该跨域请求：如果允许，才发起第二次真实的请求；如果不允许，则拦截第二次请求。*/
        response.setHeader("Access-Control-Max-Age", "0");//每次异步请求都发起预检请求，也就是说，发送两次请求。
        response.setHeader("Access-Control-Allow-Headers", "Origin, No-Cache, X-Requested-With,"
                + " If-Modified-Since, Pragma, Last-Modified, Cache-Control, Expires,"
                + " Content-Type, X-E4M-With,userId,token");//跨域请求允许包含的头
        response.setHeader("Access-Control-Allow-Credentials", "true");    //是否支持跨域，是否允许请求带有验证信息
        response.setHeader("XDomainRequestAllowed", "1");
        filterChain.doFilter(servletRequest, servletResponse);
    }

    @Override
    public void destroy() {
    }
}

EncodingFilter

package com.lxd.tools;

import javax.servlet.http.HttpServlet;
import javax.servlet.Filter;
import javax.servlet.FilterConfig;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.FilterChain;

public class EncodingFilter extends HttpServlet implements Filter
{
    private FilterConfig config = null;
    private String targetEncoding = "GBK";

    public void init(FilterConfig filterConfig)
    {
        this.config = filterConfig;
        this.targetEncoding = config.getInitParameter("encoding");
    }

    public void destroy()
    {
        config = null;
        targetEncoding = null;
    }

    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse,
                         FilterChain filterChain)
    {
        ServletRequest request = (ServletRequest) servletRequest;
        try
        {
            request.setCharacterEncoding(targetEncoding);
            filterChain.doFilter(servletRequest, servletResponse);
        }
        catch (Exception ex)
        {
            ex.printStackTrace();
        }
    }

}