1.背景

同一个h5页面需要访问多个不同的域名下的地址

2.判定方式

方式一

在浏览器控制台执行如下代码:

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://XXXX.XXX.com/api/order/query'); // 测试时改为自己的地址
xhr.send(null);
xhr.onload = function(e) {var xhr = e.target;console.log(xhr.responseText);
}

如果能正常拿到接口结果说明支持跨域,结果如下

如果返回如下结果,说明不支持跨域:

方式二

编写如下html文件,直接访问html,如果不能正常访问则不支持跨域

<html>
<script type="text/javascript">
var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://xxx.xxx.com/api/order/query'); // 换为自己的接口地址
xhr.send(null);
xhr.onload = function(e) {var xhr = e.target;console.log(xhr.responseText);
}
</script>
</html>

3.springboot的java接口如何实现跨域

增加如下代码

@Configuration
public class WebConfig implements WebMvcConfigurer {@Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping("/**").allowedOrigins("*").allowCredentials(true).allowedMethods("*").allowedHeaders("Content-Type", "X-Requested-With", "accept,Origin", "Access-Control-Request-Method", "Access-Control-Request-Headers", "token");}
}

完美

如何判定API接口是否支持跨域访问相关推荐

【Abp VNext】实战入门（七）：【1】xxx.Web网站层 —— API接口服务添加跨域访问支持
一.前言通过命令 abp new AoRuiDe.GasMonitoring 或者直接从官网下载的项目,默认没做跨域配置,会导致在前后端分离的网页中去访问后端接口的时候报错"Access- ...
Nginx配置服务器静态文件支持跨域访问
2019独角兽企业重金招聘Python工程师标准>>> 在server中配置 add_header Access-Control-Allow-Origin *;add_header ...
PHP接口允许ajax跨域访问设置方法（亲测）
背景 H5开发中使用ajax调用数据接口, 如果接口文件不在同域名下会提示跨域错误(No 'Access-Control-Allow-Origin' header is present on the ...
PHP接口允许ajax跨域访问设置方法
背景 H5开发中使用ajax调用数据接口, 如果接口文件不在同域名下会提示跨域错误(No 'Access-Control-Allow-Origin' header is present on the ...
测试接口是否支持跨域
通常情况,前后端项目分离,后端需要设置允许跨域,跨域配置完成后,如何测试接口跨域是否成功? 方案如下: 新建HTML文件,将下面代码拷贝,运行即可. <!DOCTYPE html> < ...
PHP后端API接口解决Ajax跨域请求的方式
如果我们是前后端分离,且不再同一域的情况下,前端使用Ajax请求后端的数据的时候,就会出现跨域的问题. 在前端我们可以使用获取jsonp格式来应对跨域问题,但是这种方式比较难用,如果前端后端都是可以进 ...
百度网盘播放地址html,百度云web播放器cyberplayer的flv播放地址一定要支持跨域访问如何设置...
cyberplayer, 官方demo 百度云web播放器: Cyberplayer3.0 Demo http://cyberplayer.bcelive.com/demo/new/index.htm ...
iframe父子级页面传值支持跨域访问javascript
今天在使用parent.fn()调用父页面方法时发现并没有成功调用到父级iframe中的方法,后来发现是两个iframe并不在同一域名下,在网上查过后,发现H5中message方法恰好支持,闲话不多说 ...
tomcat项目支持跨域访问
在web.xml中添加如下filter <filter><filter-name>CorsFilter</filter-name><filter-class& ...

如何判定API接口是否支持跨域访问

1.背景

2.判定方式

方式一

方式二

3.springboot的java接口如何实现跨域

完美

如何判定API接口是否支持跨域访问相关推荐

最新文章

热门文章