说明:我们知道Ajax是不能进行跨域请求的,我们是可以设置我们的项目让Ajax支持跨域访问。

跨域: aa.xxx.com 中用ajax请求  bb.ccc.com中的数据成为跨域。

找了一些文章看了的, 无非都是说 jsonp是get的解决办法,cross是post请求的解决办法。这边自己也测试了下。这边记录一下。

①我们先准备好我们的接口

然后需要我们发布一下,这个就是我们的接口地址了() :http://apitest.sealee.xin/api/ajaxcross (get/post(请求的body为: '{"Name":"sealee"}'  json字符串 ))

http://apitest.sealee.xin/api/ajaxcross  如果出现下面信息证明接口有效,否则无效

②什么都不做处理进行Aajx请求

本机上创建一个页面,进行访问接口数据

@{
Layout = null;
} <!DOCTYPE html> <html>
<head>
<meta name="viewport" content="width=device-width" />
<title>测试Ajax跨越请求</title>
<script src="~/Scripts/jquery-3.3.1.min.js"></script>
<script src="~/Scripts/jquerycookie/jquery.cookie.js"></script>
<script>
$(document).ready(function () {
$('#GetCross').bind('click', function () {
var ob = {
name: "sealee"
};
$.ajax({
type: "get",
async: true,
url: "http://apitest.sealee.xin/api/AjaxCross",
dataType: "json",
beforeSend: function () {
//请求前的处理
},
success: function (data) {
//请求成功处理,和本地回调完全一样
console.log(data);
},
complete: function () {
//请求完成的处理
},
error: function () {
//请求出错处理
}
}); });
$('#PostCross').bind('click', function () {
var ob = {
Name: "sealee"
};
$.cookie("testCookie", "");
$.ajax({
type: 'POST',
headers: {
'contentType': "application/json; charset=utf-8" //有头部信息会执行optings请求
},
//xhrFields: {
// withCredentials: true // 这里设置了withCredentials 能不能传递cooikes
//},
url: "http://apitest.sealee.xin/api/AjaxCross",
dataType: "json",
data: JSON.stringify(ob), //传递的json格式
success: function (data) {
console.log(data);
}
}) }); });
</script>
</head>
<body>
<div>
<button id="GetCross"> Get跨越</button>
<button id="PostCross"> Post跨越</button>
</div>
</body>
</html>

我们点击Get,Post都是会报错的

③解决办法   网上找了些方法,说需要 js和服务端都需要做改变,自己做了一些尝试,最后结果:我们保持我们的js代码不变,只是在服务端进行了配置,就可以实现跨域请求

在web.config里面配置了这些,也可以写个过滤器在代码里面进行添加,如果不安全,可以在头部设置一些信息来确保消息的请求来源。

1.写在web.config中

2.代码

然后再进行调试

跟踪我们的请求,你会发现,有三次请求

  

类型为OPTIONS的时候,只有当我们的ajax请求中出现了头部信息才会执行,当OPTIONS执行成功的时候才会去执行Post请求。

注释我们的头部请求设置,然后点击Post提交

问题:传递Cookie的时候cookie没有加到我们的头部

修改我们的配置:

JS:

.NET中Ajax跨越访问的更多相关文章

  1. js/ajax跨越访问-jsonp的原理和实例(javascript和jquery实现代码)

    最近做了一个项目,需要用子域名调用主域名下的一个现有的功能,于是想到了用jsonp来解决,在我们平常的项目中不乏有这种需求的朋友,于是记录下来以便以后查阅同时也希望能帮到大家,需要了解的朋友可以参考下 ...

  2. Ajax跨域问题及解决方案 asp.net core 系列之允许跨越访问(Enable Cross-Origin Requests:CORS) c#中的Cache缓存技术 C#中的Cookie C#串口扫描枪的简单实现 c#Socket服务器与客户端的开发(2)

    Ajax跨域问题及解决方案   目录 复现Ajax跨域问题 Ajax跨域介绍 Ajax跨域解决方案 一. 在服务端添加响应头Access-Control-Allow-Origin 二. 使用JSONP ...

  3. ASP.NET MVC中使用ASP.NET AJAX异步访问WebService

    使用过ASP.NET AJAX的朋友都知道,怎么通过ASP.NET AJAX在客户端访问WebService,其实在ASP.NET MVC中使用ASP.NET AJAX异步访问WebService 也 ...

  4. 解决ant Design dva ajax跨越请求 (status=0)

    今天实现了antd作为前端展现,python flask作为后端的数据填充,完全两个独立的服务:过程中遇到ajax跨越请求问题,导致status一直等于0,原来是这么写的: xmlhttp.open( ...

  5. Ajax跨越请求失败,解决

    跨越请求 1.1什么是跨域(两个不同系统之间的访问.调用) (1)域名不同,即两个不同的应用. (2)域名相同,但是端口不同,即同一个应用中的不同子系统. 1.2 Ajax跨域请求的缺陷 (1)创建t ...

  6. jquery中ajax的使用

    Java软件开发中,后台中我们可以通过各种框架,像SSH等进行对代码的封装,方便我们对Java代码的编写,例如,Struts,SpringMVC对从前台到action的流程进行封装控制,使我们只需要进 ...

  7. js中ajax如何解决跨域请求

    js中ajax如何解决跨域请求,在讲这个问题之前先解释几个名词 1.跨域请求 所有的浏览器都是同源策略,这个策略能保证页面脚本资源和cookie安全 ,浏览器隔离了来自不同源的请求,防上跨域不安全的操 ...

  8. 关于Jquery中ajax方法data参数用法的总结

    data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQ ...

  9. ajax的访问 WebService 的方法

    如果想用ajax进行访问 首先在web.config里进行设置 添加在 <webServices> <protocols> <add name= "HttpPo ...

随机推荐

  1. 如何让JS变量和字符串拼接后,是变量而不是字符串

    今天有个非常有趣的事,因为我需要用JS去实现多语言,就是我在JS文件里定义了不同的变量,尝试用变量拼接字符串组成之前定义好的变量名称,结果拼接之后,显示的却是字符串,而不是变量,所以无法解析 zh_t ...

  2. vs文件属性(复制到输出目录)是什么意思

    右击项目里的文件,选择属性(F4)会有复制到输出目录的选项. 它提供三项选择,如图: 如果选择始终复制或如果较新则复制会在该程序集的bin目录下生成该文件,如图:

  3. jquery/js不支持ie9以下版本的方法或属性

    1.jquery的trim()去除字符串两边的空格,在ie5~8中不支持此方法.若想替换字符串所有的空格看使用replace()正则替换: var date=" 2014-1 0-  15 ...

  4. Libxml2 学习

    Libxml2 学习 1.概要 libxml 是一个实现操作XML数据功能的开源C语言库. API参考文档  http://xmlsoft.org/html/libxml-tree.html 2.wi ...

  5. SVN服务器在Ubuntu16.04下搭建多版本库详细教程

    1  介绍  Subversion是一个自由,开源的版本控制系统,这个版本库就像一个普通的文件服务器,不同的是,它可以记录每一次文件和目录的修改情况.这样就可 以很方面恢复到以前的版本,并可以查看数据 ...

  6. MySQL远程连接:Host 'x' is not allowed to connect to this MySQL server

    远程连接MySQL时发现如下错误: java.sql.SQLException: null, message from server: "Host '192.168.30.23' is no ...

  7. Android自定义之流式布局

    流式布局,好处就是父类布局可以自动的判断子孩子是不是需要换行,什么时候需要换行,可以做到网页版的标签的效果.今天就是简单的做了自定义的流式布局. 具体效果: 原理: 其实很简单,Measure  La ...

  8. Android应用开发基础之一:数据存储和界面展现(一)

    Android项目的目录结构 Activity:应用被打开时显示的界面 src:项目代码 R.java:项目中所有资源文件的资源id Android.jar:Android的jar包,导入此包方可使用 ...

  9. SDET面试之感受篇。

    某年某月的某一天,我来到了太监村的一栋大厦,因为早到了半个小时,拿出来提前准备好的code随便的翻看着. 人家都说,面试头五分钟就已经决定了,是否能面试成功.所以,面试真正的真谛可能就是相面.什么写c ...

  10. (六)svn 服务器端使用之权限管理

    权限管理(了解) 认证授权机制 在企业开发中会为每位程序员.测试人员等相关人员分配一个账号,用户通过使用svn客户端连接svn服务时需要输入账号和密码,svn服务对账号和密码进行校验,输入正确可以继续 ...