网站代码软件,wordpress媒体库图片不显示,app开发公司投入,烟台比较好的软件公司什么是跨域问题?
跨域问题来源于JavaScript的同源策略#xff0c;即只有 协议主机名端口号 (如存在)相同#xff0c;则允许相互访问。也就是说JavaScript只能访问和操作自己域下的资源#xff0c;不能访问和操作其他域下的资源。跨域问题是针对JS和ajax的同源策略即只有 协议主机名端口号 (如存在)相同则允许相互访问。也就是说JavaScript只能访问和操作自己域下的资源不能访问和操作其他域下的资源。跨域问题是针对JS和ajax的html本身没有跨域问题。
查看浏览器开发者工具Console报错
Failed to load http://a.a.com:8080/A/FromServlet?userName123: No Access-Control-Allow-Origin header is present on the requested resource. Origin http://b.b.com:8080 is therefore not allowed access. 案例
http://www.abc.com/a/b 调用 http://www.abc.com/d/c非跨域
http://www.abc.com/a/b 调用 http://www.def.com/a/b 跨域域名不一致
http://www.abc.com:8080/a/b 调用 http://www.abc.com:8081/d/c 跨域端口不一致
http://www.abc.com/a/b 调用 https://www.abc.com/d/c 跨域协议不同
localhost 和 127.0.0.1 也可能存在跨域问题 解决跨域问题
常用方式设置过滤器
1、引入servlet-api的依赖
dependencygroupIdjavax.servlet/groupIdartifactIdjavax.servlet-api/artifactIdversion4.0.1/versionscopeprovided/scope/dependency 2,编写跨域处理的过滤器
package com.gxa.filter;import javax.servlet.*;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;public class CorsFilter implements Filter {Overridepublic void init(FilterConfig filterConfig) throws ServletException {}Overridepublic void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {HttpServletRequest request (HttpServletRequest) req;HttpServletResponse response (HttpServletResponse) res;/* 允许跨域的主机地址 */response.setHeader(Access-Control-Allow-Origin, *);/* 允许跨域的请求方法GET, POST, HEAD 等 */response.setHeader(Access-Control-Allow-Methods, *);/* 重新预检验跨域的缓存时间 (s) */response.setHeader(Access-Control-Max-Age, 3600);/* 允许跨域的请求头 */response.setHeader(Access-Control-Allow-Headers, *);/* 是否携带cookie */response.setHeader(Access-Control-Allow-Credentials, true);//判断前端发送的是否是预请求如果是直接返回并且告诉他允许的请求方式if(OPTIONS.equalsIgnoreCase(request.getMethod())) {return;}chain.doFilter(request,response);}Overridepublic void destroy() {}
} 3,在web.xml中注册过滤器
filterfilter-nameCorsFilter/filter-namefilter-classcom.gxa.filter.CorsFilter/filter-class/filterfilter-mappingfilter-nameCorsFilter/filter-nameurl-pattern/*/url-pattern/filter-mapping
这样前后端就可以解决跨域问题了
