Ajax实现跨域访问最新方式

BWrong 发布于2019-07-01 10:18 / 1997人阅读

摘要：具体实现如下请求失败解决方案需要前端和服务端共同配置才能实现前端服务器发生错误服务端在程序入口文件配置

在实际项目当中，我们经常会遇到同一个域名下不同项目之间通过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");

云服务器 GPU云服务器 ajax跨域访问 ajax跨域访问报错 ajax_onp跨域访问 js实现跨域访问

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/29017.html

JSONP的一点笔记<修改中>

摘要：请求服务器数据并规定回调函数为上面代码通过动态添加元素，向服务器发出请求。另外假设向服务发送的请求是这样的在这种情况下，是表示请求的请求参数，而是应用程序的回调函数的名称。清单调用回调服务注意，我们使用作为回调函数名，而非真实的函数名。同源策略同源策略(Same origin policy)，它是由Netscape提出的一个著名的安全策略。现在所有支持JavaScript的浏览器都...

姘存按 2019-08-20 17:22 评论0 收藏0
AJAX原理与CORS跨域

摘要：同源策略指的是当前页面和目标协议域名和端口均相同。发出请求的页面所在域。响应的头部信息在后端处理，不在此处讲解。该事件会在数据接收期间不断触发，但间隔不确定。服务器确认允许之后，才发起实际的请求。 ajax作为前端开发必需的基础能力之一，你可能会使用它，但并不一定懂得其原理，以及更深入的服务器通信相关的知识。在最近两天的整理过程中，看了大量的文章，发现自己的后端能力已经限制自己在网络通...

jeyhan 2019-08-21 17:01 评论0 收藏0
前端跨域整理

摘要：前言原文地址前端跨域总结博主博客地址的个人博客相信每一个前端对于跨域这两个字都不会陌生，在实际项目中应用也是比较多的。通过跨域前面说过了，浏览器有一个同源策略，其限制之一是不能通过的方法去请求不同源中的文档。前言原文地址：前端跨域总结博主博客地址：Damonare的个人博客相信每一个前端er对于跨域这两个字都不会陌生，在实际项目中应用也是比较多的。但跨域方法的多种多样实在让人目...

yankeys 2019-06-27 14:44 评论0 收藏0
前端跨域整理

摘要：前言原文地址前端跨域总结博主博客地址的个人博客相信每一个前端对于跨域这两个字都不会陌生，在实际项目中应用也是比较多的。通过跨域前面说过了，浏览器有一个同源策略，其限制之一是不能通过的方法去请求不同源中的文档。前言原文地址：前端跨域总结博主博客地址：Damonare的个人博客相信每一个前端er对于跨域这两个字都不会陌生，在实际项目中应用也是比较多的。但跨域方法的多种多样实在让人目...

jsliang 2019-08-20 11:56 评论0 收藏0
javascript跨域

摘要：实现跨域的原理通过方式请求载入并执行一个文件，相当于通过的形式的导入一个外部的方法语法该函数是简写的函数，等价于在中，您可以通过使用形式的回调函数来加载其他网域的数据，如。将自动替换为正确的函数名，以执行回调函数。更多详情见http://blog.zhangbing.club/Ja... 最近在项目开发的过程中遇到一些Javascript 跨域请求的问题，今天抽空对其进行总结一下，以...

PingCAP 2019-08-22 18:10 评论0 收藏0