前后端解决跨域请求问题

原创 2016年08月30日 14:11:43

后端

使用过滤器的写法解决跨域问题

public class CorsFilter implements Filter {
    private Logger logger = LoggerFactory.getLogger(getClass());
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {
    }

    @Override
    public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)
            throws IOException, ServletException {
        logger.info("************************ 跨域过滤器 start ************************");
        HttpServletResponse res = (HttpServletResponse) response;  
        res.setContentType("text/html;charset=UTF-8");  
        res.setHeader("Access-Control-Allow-Origin", "*");  
        res.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");  
        res.setHeader("Access-Control-Max-Age", "0");  
        res.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");  
        res.setHeader("Access-Control-Allow-Credentials", "true");  
        res.setHeader("XDomainRequestAllowed","1");  
        logger.info("************************ 跨域过滤器 end ************************");
        chain.doFilter(request, response);

    }

    @Override
    public void destroy() {
    }

}

web.xml配置文件

<!-- 跨域过滤器 -->
<filter>
  <filter-name>cors</filter-name>
  <filter-class>xxx.xxx.CorsFilter</filter-class>
</filter>
<filter-mapping>
  <filter-name>cors</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>

前端

如果前台和后台服务不在同一域名下,最好通过使用jquery的ajax,而不是$.getJSON()$.post() 同时这样也解决了不同域名session改变的问题

$.ajax({
    type: 'POST',
    url: getRootPath() + '/web/login',
    data: para,
    //注意下面两个参数的设置起到了作用
    xhrFields: {
        withCredentials: true
    },
    crossDomain:true,
    success: function(data) {
    },
    dataType: 'json'
});
版权声明:本文为博主原创文章,未经博主允许不得转载。

通过Filter解决跨域问题,可以跨多个域,域可以通过@Value注解取

跨域中不同的域指的是“协议+IP+端口”,只要其中一个不相同就要跨域访问,为了安全,浏览器对于跨域默认是禁止访问的。现在很多应用的客户端和服务端是分开的,那么如何来让处于不同域的客户端和服务端实现跨域...
  • luenxin
  • luenxin
  • 2015年11月30日 18:53
  • 5428

使用servlet过滤器实现跨域功能:

1.定义过滤器接口Filter的实现类,实现类中修改respone的头信息,把 “Access-Control-Allow-Origin” 的域名修改问请求方的域名,如下: package fil...

Electron + Vue 实现一个代理客户端

本文标签: Vue.js chart.js App.vue 原理 作为一个合格的前端工程师,你一定用过Fiddler或Charles之类的抓包工具。但是在Mac上做开发时,相关的抓包工...

用全栈神器electron 打全平台桌面级 app--Music Player

什么是Electron?Electron 技术方案进行桌面端的开发,跨平台兼容 macOS、Windows、Linux 等操作系统。可以让你写使用 JavaScript,HTML 和 CSS 构建跨平...

Electron实战:创建ELectron开发的window应用安装包

前言:研究electron自动更新的时候,在electron的官方文档auto-updater 中,提到了在几个平台mac,linux,windows下electron 的自动更新方法,其中winds...

前后端分离,ajax前端跨域访问后端

当我们做前后端分离项目的时候,有时候前结合后端做调试的时候,就面临前端要跨域访问后端的情况,直接从前端跨域访问后端是需要在后端中做接受前端IP地址发出请求的接受处理,这句话很拗口,简单讲就是你要在后端...

本地web访问远程服务器后端引发的跨域问题

本地web访问远程服务器后端restapi引发的跨域问题

前端解决跨域问题的8种方案(最新最全)

原文:http://www.cnblogs.com/JChen666/p/3399951.html 1.同源策略如下: URL 说明 是否允许通信 ...
  • Joyhen
  • Joyhen
  • 2014年03月20日 16:52
  • 182298

什么是跨域?怎么解决跨域问题?

什么是跨域? 跨域,指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对javascript施加的安全限制。 所谓同源是指,域名,协议,端口均相同,不明白没关系,举个栗子...

跨域访问请求处理

在浏览器中,通过js代码访问不同域名下的url,可以是js的xhr请求,或者是ajax请求,或者是iframe(js访问iframe内部的DOM时)。这时,会被禁止访问。出现这种问题时,需要通过跨域访...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:前后端解决跨域请求问题
举报原因:
原因补充:

(最多只允许输入30个字)