这篇文章距离上次修改已过半年,其中的信息真实性可能已经有所发展或是发生改变,请自行分辨。

Ajax请求会出现跨域问题,前端页面报错如下:

Access to XMLHttpRequest at 'xxxx' from origin 'xxxx' has been blocked by CORS policy: Request header field content-type is not allowed by Access-Control-Allow-Headers in preflight response.

80607-1lrz1nkz19t.png

一、什么是跨域?
简单地理解就是因为JavaScript同源策略的限制,a.com 域名下的js无法操作b.com或是c.a.com域名下的对象。
同源是指相同的协议、域名、端口。特别注意两点:
如果是协议和端口造成的跨域问题“前台”是无能为力的,
在跨域问题上,域仅仅是通过“协议+域名+端口”来识别,两个不同的域名即便指向同一个ip地址,也是跨域的。

二、常见跨域情况

URL                                说明                           是否允许通信
http://www.a.com/a.js
http://www.a.com/b.js              同一域名下                         允许

http://www.a.com/lab/a.js
http://www.a.com/script/b.js       同一域名下不同文件夹                允许

http://www.a.com:8000/a.js
http://www.a.com/b.js              同一域名,不同端口                 不允许

http://www.a.com/a.js
https://www.a.com/b.js             同一域名,不同协议                 不允许

http://www.a.com/a.js
http://192.168.1.1/b.js            域名和域名对应ip                   不允许

http://www.a.com/a.js
http://script.a.com/b.js           主域相同,子域不同                 不允许

http://www.a.com/a.js
http://a.com/b.js                  同一域名,不同二级域名(同上)      不允许(cookie这种情况下也不允许访问)

http://www.cnblogs.com/a.js
http://www.a.com/b.js              不同域名                          不允许

具体解决办法如下,仅供参考:
1)添加一个过滤方法,代码如下:

package com.lcry.filter;

import javax.servlet.*;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
/**
 * @author lcry
 * @create 2019/1/4
 */
public class SessionListener  implements Filter {

    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
        // TODO Auto-generated method stub

    }

    @Override
    public void doFilter(ServletRequest request, ServletResponse response,
                         FilterChain chain) throws IOException, ServletException {
        HttpServletResponse httpServletResponse=(HttpServletResponse) response;
        httpServletResponse.setHeader("Access-Control-Allow-Origin", "*");
        chain.doFilter(request, response);


    }

    @Override
    public void destroy() {
        // TODO Auto-generated method stub

    }
}

2)配置web.xml,添加拦截

  <!--解决跨域问题-->
  <filter>
    <filter-name>SessionListener</filter-name>
    <filter-class>com.lcry.filter.SessionListener</filter-class>
  </filter>
  <filter-mapping>
    <filter-name>SessionListener</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>

这样就能解决ajax跨域问题。

扫描下面二维码,给博主打赏点吧~

微信

微信

支付宝

支付宝


作者:Lcry
本文链接:https://www.51it.wang/ll/1044
商业转载请联系作者获得授权,非商业转载请注明本文出处及文章链接

带符号 * 的表示必填项