欢迎来到代码驿站!

JavaScript代码

当前位置:首页 > 网页前端 > JavaScript代码

Ajax实现跨域访问最新解决方案

时间:2021-06-11 08:12:11|栏目:JavaScript代码|点击:

在实际项目当中,我们经常会遇到同一个域名下不同项目之间通过Ajax相互调用数据,这样问题就来了,如何通过Ajax实现跨域呢?

解决方案

1.Jsonp

Jsonp解决跨域相对简单,服务器无需任何配置。具体实现如下:

$.ajax({
  type: 'get',
  url: 'http://xxx.com',
  data: {},
  dataType: 'jsonp',
  success: function (data) {
    
  },
  error: function (data) {
    mask.close();
    toast('请求失败');
  }
});

2.CORS

CORS解决方案需要前端和服务端共同配置才能实现

前端

$.ajax({
  url: 'http://xxx.com',
  type: 'post',
  xhrFields:{
    withCredentials:true
  },
  data: {},
  success: function(res){
  },
  error: function(){
    alert('服务器发生错误!');
  }
});

服务端(在程序入口文件配置)

header('Access-Control-Allow-Origin: http://xxx.com');
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept');

总结

上一篇:js实现checkbox全选、不选与反选的方法

栏    目:JavaScript代码

下一篇:更改BootStrap popover的默认样式及popover简单用法

本文标题:Ajax实现跨域访问最新解决方案

本文地址:http://www.codeinn.net/misctech/140044.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有