ajax 跨域访问web api,web api 解决Ajax请求跨域问题

于 2021-08-05 23:49:13 发布 488 收藏
文章标签： ajax 跨域访问web api

前端ajax请求接口时，经常出现跨域问题，当然了解决方法有很多种，比如：

我本人恰好前后端都会一点，所以直接在接口端处理。 我用的是mvc 开发的接口 可以在web API 的根目录添加一个属性就OK了。 代码如下：

public class CrossSiteAttribute: System.Web.Http.Filters.ActionFilterAttribute

{

private string originHeaderdefault = "http://www.abc.com";

//默认的构造函数允许 "http://www.abc.com"域名下调用接口

public CrossSiteAttribute() {

}

public CrossSiteAttribute(string originHeader )

{

if (!string.IsNullOrEmpty(originHeader)) {

originHeaderdefault = originHeader;

}

}

private const string Origin = "Origin";

///

/// Access-Control-Allow-Origin是HTML5中定义的一种服务器端返回Response header，用来解决资源(比如字体)的跨域权限问题。

///

private const string AccessControlAllowOrigin = "Access-Control-Allow-Origin" ;

///

/// originHeaderdefault的值可以使 URL 或 *，如果是 URL 则只会允许来自该 URL 的请求，* 则允许任何域的请求

///

///

/// 该方法允许api支持跨域调用

///

/// 初始化 System.Web.Http.Filters.HttpActionExecutedContext 类的新实例。

public override void OnActionExecuted( HttpActionExecutedContext actionExecutedContext)

{

actionExecutedContext.Response.Headers.Add(AccessControlAllowOrigin, originHeaderdefault);

}

}

### 调用很简单

[HttpPost]

[CrossSite("http://www.bbb.com")]

public Response RemovePC(Model model)

{

//你的代码

}

### 还有一种方式 ，就是直接在web.config里添加节点 的方式解决，就是在 节点下添加。

这种方式简单，没有安全性可言，所以得网站都可以访问你的接口。写死连接，灵活性有点差，又不利于拓展，建议使用上面的那种方式。

解决ajax请求跨域

跨域大部分需要通过后台解决,引起跨域的原因: 3个问题同时满足 才可能产生跨域问题,即跨域(协议,主机名,端口号中有一个不同就产生跨域) 下面是解决方法 方法一 // ajax请求跨域 /* *解决a ...

解决Ajax请求跨域问题

from:https://blog.csdn.net/wang379275614/article/details/53333775 上篇文章提到,由于浏览器的同源策略,使得,AJAX请求只能发给同源的 ...

nginx配置 解决ajax请求跨域问题

文章来源:http://to-u.xyz/2016/06/30/nginx-cors/ 背景描述 最近在研究RESTful API接口设计,使用的是Nginx,要实现本地http://127.0.0. ...

cors解决ajax请求跨域问题

Access-Control-Allow-Origin: * 适用tomcat部署的项目 在web.xml里添加以下内容 CorsF ...

基于JWT的web api身份验证及跨域调用实践

随着多终端的出现,越来越多的站点通过web api restful的形式对外提供服务,很多网站也采用了前后端分离模式进行开发,因而在身份验证的方式上可能与传统的基于cookie的Session Id的 ...

day78_淘淘商城项目_11_单点登录系统实现 + 用户名回显 + ajax请求跨域问题详解_匠心笔记

课程计划 1.SSO注册功能实现 2.SSO登录功能实现 3.通过token获得用户信息 4.ajax跨域请求解决方案--jsonp 1.服务接口实现   SSO系统就是解决分布式环境下登录问题的,本 ...

Web Api 利用 cors 实现跨域

一.安装 cors 二.修改 Web.config

处理Ajax请求跨域问题

ajax跨域的原理 ajax出现请求跨域错误问题,主要原因就是因为浏览器的“同源策略”. CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resourc ...

解决Ajax不能跨域的方法

1.  Ajax不能跨域请求的原因 同源策略(Same Origin Policy),是一种约定,该约定阻止当前脚本获取或者操作另一个域下的内容.所有支持Javascript的浏览器都支持同源策略,也 ...

随机推荐

重建Windows 8的图标缓存

Windows 8的图标缓存路径与Win7不同,重置方法如下: rem 关闭explorer.exe taskkill /f /im explorer.exe attrib -h -i %userpr ...

power designer 连接数据库提示“connection test failed”

利用powerdesigner反向生成表结构时,需要mysql连接,配置好连接,测试时直接报:connection test failed”! OS:WIN7 旗舰版 64位 JDK: 64位 Pow ...

cocos2d-x 3.0版本已经加了socket部分

cocos2d-x开发者的福音到了,在3.0版本中新增了HttpClient.HttpRequest.SocketIO.Websocket库,需要网络交互的同学应该可以用到,并且它已经与cocos2d ...

Ray Tracing

Ray Tracing 题目链接:http://codeforces.com/problemset/problem/724/C 拓展欧几里得 //为什么这次C题这么难啊=.= 可以观察到,光线在矩形中 ...

synchronized(this) 与synchronized(class) 之间的区别

一.概念 synchronized 是 Java 中的关键字,是利用锁的机制来实现同步的. 锁机制有如下两种特性: 互斥性:即在同一时间只允许一个线程持有某个对象锁,通过这种特性来实现多线程中的协调机 ...

2017-12-20python全栈9期第五天第二节之字典的增删查改和字典的for循环

#!/user/bin/python# -*- coding:utf-8 -*-dic1 = {'age':24,'name':'zd','sex':'boy'}print(dic1)#增dic1[' ...

[Node.js] 02 - Read Eval Print Loop

视频课程:带你入门Nodejs,提及了非常多的后端知识点 发布时间: 2017年10月7日 课程时长:193 分钟 类别:后端 课时:22 npm Resource: npm模块管理器[阮一峰] np ...

要显示的联系人——>自定义-bug

自定义中将“电话”下的“所有联系人”不勾选,但是Contacts列表还是显示PHONE联系人. SELECT _id, display_name, agg_presence.mode AS conta ...

Linux基础命令---split

split 将一个大文件切割成较小的文件,默认情况下每1000行就会切割一次.分割后的文件,默认以xaa.xab.xac等命名.用户亦可以指定名字的前缀,例如指定前缀test,那么分割后的文件是tes ...

第11章—使用对象关系映射持久化数据—SpringBoot+SpringData+Jpa进行查询修改数据库

SpringBoot+SpringData+Jpa进行查询修改数据库 JPA由EJB 3.0软件专家组开发,作为JSR-220实现的一部分.但它又不限于EJB 3.0,你可以在Web应用.甚至桌面应用 ...

静夜河
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Nginx 解决WebApi跨域二次请求以及Vue单页面的问题
01-09
一、前言 由于项目是前后端分离，API接口与Web前端 部署在不同站点当中，因此在前文当中WebApi Ajax 跨域请求解决方法（CORS实现）使用跨域处理方式处理而不用Jsonp的方式。 但是在一段时间后，发现一个很奇怪的问题，每次前端发起请求的时候，通过浏览器的开发者工具都能看到在Network下同一个url有两条请求，第一条请求的Method为OPTIONS，第二条请求的Method才是真正的Get或者Post，并且，第一条请求无数据返回，第二条请求才返回正常的数据。 二、原因 第一个OPTIONS的请求是由WEB服务器处理跨域访问引发的。OPTIONS是一种预检请求，浏览器在处理跨域
jQuery.ajax 跨域请求webapi设置headers的解决方案
01-19
解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头、正确响应options请求，正确设置 JavaScript端需要设置的headers信息 方能实现。 1.第一步 服务端设置响应头,在webapi的web.config做如下设置 <system> <httpProtocol> <!--跨域配置开始--> <customHeaders> <add name=Access-Control-Allow-Origin value=*><!--支持全域名访问，不安全，部署后需要固定限制为客户端网址--> <add name=Access
ajax跨域请求js拒绝访问的解决方法
12-09
求解决办法 代码如下: ajax{ url ：“http://xxxx/app”， type:”POST”; dataType:”json”, } 不能用jsonp 因为jsonp发送数据 type 为 get type 必须为post url 不能加参 (例：http://xxxx/app?callback=aaa) 返回数据位json格式。求方法 您可能感兴趣的文章:跨域请求之jQuery的ajax jsonp的使用解惑AJAX跨域请求json数据的实现方法jQuery.ajax 跨域请求webapi设置headers的解决方案JQuer
WebApi2 文件图片上传与下载功能
01-03
Asp.Net Framework webapi2 文件上传与下载 前端界面采用Ajax的方式执行 一、项目结构 1.App_Start配置了跨域访问，以免请求时候因跨域问题不能提交。具体的跨域配置方式如下，了解的朋友请自行略过。 跨域配置：NewGet安装dll Microsofg.AspNet.Cors 然后在App_Start 文件夹下的WebApiConfig.cs中写入跨域配置代码。 public static class WebApiConfig { public static void Register(HttpConfiguration config)
webapi跨域使用session的方法示例
01-20
在之前的项目中，我们设置跨域都是直接在web.config中设置的。 这样是可以实现跨域访问的。因为我们这边一般情况下一个webapi会有多个网站、小程序、微信公众号等访问，所以这样设置是没有问题的。但是……如果其中一个网站需要用到cookie或者session的时候， Access-Control-Allow-Origin如果还是设置成“*”就会报错，当然是前端报错。。。数据返回还有cookie/session都还是能存，但是报错就不爽了啊。 于是，想着整改一下。 先上前端代码。来个页面远程ajax请求去设置session。啥都没有，就是点按钮，发个请求。标记地方是必须加的 @{ V
一个简单的注册/登录页面，使用AJAX实现前后台数据交互
weixin_44467131的博客
06-09 7822
因为学习需求，需要实现一个简单的登录与注册界面，抓耳挠腮，搞了好久。我自己是做后台开发，所以后台的Service、Dao、Controller很快就编写完成了。被前台的代码恶心了很久，遇到了n个bug，各种查找资料，最终实现了简单的登录。这里我们不讲后台数据的交互逻辑，我重点讲讲如何通过AJAX来实现前后台的数据交互的。 大家都知道的，coding这种事情就是为了写bug的，所以我这篇文章中虽然提到了很多坑，但是也不一定你就会遇到，多种尝试后，也可以多多打开浏览器的控制台看看是哪里报错了。也不要因为写的和别
ajax注册html页面代码,用AJAX实现页面登陆以及注册用户名验证的简单实例
weixin_42511177的博客
06-05 834
AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML)，是指一种创建交互式网页应用的网页开发技术。AJAX 是一种用于创建快速动态网页的技术。其核心是 JavaScript 对象 XMLHttpRequest。该对象在 Internet Explorer 5 中首次引入，它是一种支持异步请求的技术。简而言之，XMLHttpRequest使您...
Vue.js——使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用【6】
热门推荐
大灰狼的小绵羊哥哥的博客
09-15 1万+
Vue.js——使用$.ajax和vue-resource实现OAuth的注册、登录、注销和API调用 概述 上一篇我们介绍了如何使用vue resource处理HTTP请求，结合服务端的REST API，就能够很容易地构建一个增删查改应用。 这个应用始终遗留了一个问题，Web App在访问REST API时，没有经过任何认证，这使得服务端的REST API是不安全的，只
web(ajax)
pet_ch的博客
03-06 67
一、ajax简介 ajax是一种局部刷新技术，用于访问后台数据。它允许通过与场景后面的 Web 服务器交换数据来异步（即请求和后续代码同时执行）更新网页，这意味着可以更新网页的部分，而不需要重新加载整个页面 。 ajax工作原理 二、js ajax js中用于同幕后服务器交换数据的对象为：XMLHttpRequest对象 原生js ajax 不要设置同步请求，原生js为单线程 访...
ajax 对接口,ajax访问api接口
weixin_30746067的博客
08-05 1319
ajax访问api接口 内容精选换一换访问控制策略是API网关提供的API安全防护组件之一，主要用来控制访问API的IP地址和帐户，您可以通过设置IP地址或帐户的黑白名单来拒绝/允许某个IP地址或帐户访问API。访问控制策略和API本身是相互独立的，只有将访问控制策略绑定API后，访问控制策略才对绑定的API生效。每个用户最多可以创建100个访问控制策略。同一个环境中一个AP访问控制可控制访问AP...
C#进阶系列--WebApi
08-23
目录 C#进阶系列——WebApi 路由机制剖析：你准备好了吗？ ................................................................................................... 3 一、MVC和WebApi路由机制比较 ........................................................................................................................................ 5 1、MVC里面的路由 ......................................................................................................................................................... 5 2、WebApi里面的路由 ................................................................................................................................................... 5 二、WebApi路由基础 ............................................................................................................................................................. 7 1、默认路由 ..................................................................................................................................................................... 7 2、自定义路由 ............................................................................................................................................................... 10 2.1、自定义路由一：匹配到action ................................................................................................................. 11 2.2、自定义路由二 ............................................................................................................................................... 12 3、路由原理 ................................................................................................................................................................... 12 三、WebApi路由过程 ........................................................................................................................................................... 13 1、根据请求的url匹配路由模板 .............................................................................................................................. 13 2、找到控制器 ............................................................................................................................................................... 13 3、找到action ............................................................................................................................................................. 15 四、WebApi特性路由 ........................................................................................................................................................... 16 1、启动特性路由 ........................................................................................................................................................... 17 2、最简单的特性路由 ................................................................................................................................................... 17 3、带参数的特性路由 ................................................................................................................................................... 19 4、参数的约束和默认值 ............................................................................................................................................... 20 5、路由前缀 ................................................................................................................................................................... 20 五、第一个Restful风格的WebApi服务 ......................................................................................................................... 21 六、总结 ................................................................................................................................................................................. 22 C#进阶系列——WebApi 异常处理解决方案 ......................................................................................................................... 23 一、使用异常筛选器捕获所有异常 ..................................................................................................................................... 24 1、接口级别 ........................................................................................................................................................... 31 2、控制器级别 ....................................................................................................................................................... 33 3、全局配置 ........................................................................................................................................................... 34 二、HttpResponseException自定义异常信息 .............................................................................................................. 35 三、返回HttpError ............................................................................................................................................................ 37 四、总结 ................................................................................................................................................................................. 38 C#进阶系列——WebApi 接口返回值不困惑：返回值类型详解 ......................................................................................... 39 一、void无返回值 ............................................................................................................................................................... 40 二、IHttpActionResult .................................................................................................................................................... 42 1、Json(T content) ........................................................................................................................................... 42 2、Ok()、 Ok(T content) ................................................................................................................................. 45 3、NotFound() ............................................................................................................................................................. 47 4、其他 ........................................................................................................................................................................... 49 4.1、Content(HttpStatusCode statusCode, T value) .................................................................. 49 4.2、BadRequest() ............................................................................................................................................ 49 4.3、Redirect(string location) ................................................................................................................ 50 5、自定义IHttpActionResult接口的实现 ............................................................................................................ 50 三、HttpResponseMessage ............................................................................................................................................... 53 四、自定义类型 ..................................................................................................................................................................... 54 五、总结 ................................................................................................................................................................................. 55 C#进阶系列——WebApi 接口参数不再困惑：传参详解 ..................................................................................................... 56 一、get请求 ......................................................................................................................................................................... 57 1、基础类型参数 ........................................................................................................................................................... 57 2、实体作为参数 ........................................................................................................................................................... 58 3、数组作为参数 ........................................................................................................................................................... 62 4、“怪异”的get请求 .................................................................................................................................................. 62 （1）WebApi的方法名称以get开头 ................................................................................................................ 62 （2）WebApi的方法名称不以get开头 ............................................................................................................ 64 二、post请求 ....................................................................................................................................................................... 66 1、基础类型参数 ........................................................................................................................................................... 66 （1）错误的写法 ................................................................................................................................................... 66 （2）正确的用法 ................................................................................................................................................... 67 （1）错误写法 ....................................................................................................................................................... 68 （2）正确用法 ....................................................................................................................................................... 69 （3）推荐用法 ....................................................................................................................................................... 70 2、实体作为参数 ........................................................................................................................................................... 70 （1）单个实体作为参数 ....................................................................................................................................... 70 （2）实体和基础类型一起作为参数传递 ........................................................................................................... 73 3、数组作为参数 ........................................................................................................................................................... 74 （1）基础类型数组 ............................................................................................................................................... 74 （2）实体集合 ....................................................................................................................................................... 74 4、后台发送请求参数的传递 ....................................................................................................................................... 75 三、put请求 ......................................................................................................................................................................... 77 1、基础类型参数 ........................................................................................................................................................... 77 2、实体作为参数 ........................................................................................................................................................... 77 3、数组作为参数 ........................................................................................................................................................... 78 四、delete请求 ................................................................................................................................................................... 78 五、总结 ................................................................................................................................................................................. 79 C#进阶系列——WebApi 身份认证解决方案：Basic基础认证.......................................................................................... 80 一、为什么需要身份认证 ..................................................................................................................................................... 81 1、我们不加身份认证，匿名用户可以直接通过url随意访问接口： ........................................................... 81 2、增加了身份认证之后，只有带了我们访问票据的请求才能访问我们的接口。 ....................................... 82 二、Basic基础认证的原理解析 ......................................................................................................................................... 84 1、常见的认证方式 ....................................................................................................................................................... 84 2、Basic基础认证原理 ............................................................................................................................................... 85 三、Basic基础认证的代码示例 ......................................................................................................................................... 85 1、登录过程 ................................................................................................................................................................... 85 1.1、Web前端 ....................................................................................................................................................... 85 1.2、登录的API接口 .......................................................................................................................................... 86 2、/Home/Index主界面 .............................................................................................................................................. 88 3、WebApiCORS验证部分（重点） ............................................................................................................................ 90 3.1、在WebApiCORS项目里面自定义一个类RequestAuthorizeAttribute，去继承我们的AuthorizeAttribute这个类。然后重写OnAuthorization方法，在这个方法里面取到请求头的Ticket信息，然后校验用户名密码是否合理。 ............................................................................................................. 90 3.2、在具体的Api接口增加我们上面自定义类的特性 .................................................................................. 91 四、优化 ................................................................................................................................................................................. 92 1、解决API的问题 ...................................................................................................................................................... 92 2、解决ajax的问题 .................................................................................................................................................... 93 3、解决特殊不想使用验证的方法 ............................................................................................................................... 94 五、总结 ................................................................................................................................................................................. 95 C#进阶系列——WebApi 跨域问题解决方案：CORS ............................................................................................................. 95 一、跨域问题的由来 ............................................................................................................................................................. 96 二、跨域问题解决原理 ......................................................................................................................................................... 96 三、跨域问题解决细节 ......................................................................................................................................................... 96 1、场景描述 ................................................................................................................................................................... 97 2、场景测试 ................................................................................................................................................................... 99 1）我们不做任何的处理，直接将两个项目运行起来。看效果如何 ............................................................... 99 2）使用CORS跨域 ................................................................................................................................................ 99 3）CORS的具体参数设置。 ............................................................................................................................... 103 四、总结 ............................................................................................................................................................................... 104 C#进阶系列——WebApi 接口测试工具：WebApiTestClient ........................................................................................ 105 一、WebApiTestClient介绍 ........................................................................................................................................... 106 二、WebApiTestClient展示 ........................................................................................................................................... 106 三、WebApiTestClient使用 ........................................................................................................................................... 116 1、如何引入组件 ......................................................................................................................................................... 116 2、如何使用组件 ......................................................................................................................................................... 118 1、修改Api.cshtml文件 ................................................................................................................................. 118 2、配置读取注释的xml路径 ............................................................................................................................ 119 3、测试接口 ......................................................................................................................................................... 121 四、总结 ............................................................................................................................................................................... 123
支持Ajax跨域访问ASP.NET Web Api 2(Cors)的示例教程
10-22
主要介绍了支持Ajax跨域访问ASP.NET Web Api 2(Cors)的示例教程,需要的朋友可以参考下
再也不用为跨域而苦恼
Wanguyunxiaodaniu的博客
06-07 702
前言 最近没时间写博客，只好把以前写的博客整理到自己的博客网站上去 跨域 跨域解决的方案有好几种，熟练掌握 CORS 就行了，并晓得一些原理。 jsonp 基本告别了，了解即可。 将前端的域与后端保持一致就行了，通过 nginx 代理转发。 什么情况下会跨域呢？ 跨域是指从一个源去请求另一个源的资源，浏览器基于完全考虑并遵循同源策略，禁止跨域访问。 但是我们可以通过一些手段 JSONP 或者 CORS来实现跨域。 跨域只会发生在浏览器中，后端服务之间的接口调用是没有跨域一说的。 简单理解：当 url 中的
AJAX跨域问题及解决方案
weixin_45832694的博客
10-16 4642
首先建两个服务器，服务器1：HTTP为8080端口，JMX端口为1099，部署ajax1模块，服务器2：HTTP为8081端口，JMX端口为1098，部署ajax2模块。是可以加载Servlet的，也就是说到时候响应一段字符串拼接的调用函数，参数是json类型，到时候这个json就是一个业务结果，传过来，让前端调用。所以，从安全的角度来讲，同源策略是有利于保护网站信息的。现在大部分系统都是大型应用，分布式的微服务的，有一些情况我们是需要使用ajax进行跨域访问的，所以就需要解决跨域的问题。
ajax调用API
weixin_41463944的博客
06-11 528
<script src="~/lib/jquery/dist/jquery.js"></script> <script type="text/javascript"> window.onload = function () { debugger; var settings = { "url": "https://localhost:44381/Test/GetProject?
Ajax 调用Web API大全
我要的光荣哪怕只有一秒
11-10 490
目录 首先配置一下WebApiConfig 调用无参数方法 Get Get传递实体 GetUri传递实体 Get序列化后传递实体 Get请求失败405 Post请求单个参数 Post请求多个参数 Post传递实体 Post序列化后传递实体 Post使用Jobject接收多个参数 Put请求单个参数 Put传递实体 Put序列化后传递实体 Put使用Jobjec...
html使用ajax访问后台接口出现跨域问题
Shiny_boy_的博客
07-27 660
代码】html使用ajax访问后台接口出现跨域问题。
Ajax介绍及调用api接口实现聊天机器人功能
qq_41858795的博客
11-23 680
AJAX
ajax 跨域，解决方案
油墨香^-^的博客
05-17 2824
答案：只需要点击标题下面的蓝色字【web前端开发】关注即可。 前言 从刚接触前端开发起， 跨域这个词就一直以很高的频率在身边重复出现，一直到现在，已经调试过N个跨域相关的问题了，16年时也整理过一篇相关文章，但是感觉还是差了点什么，于是现在重新梳理了一下。 个人见识有限，如有差错，请多多见谅，欢迎提出issue，另外看到这个标题，请勿喷~ 题纲 关于跨域，有N种类型，本文只专注于 ajax请求跨域(ajax跨域只是属于浏览器"同源策略"中的一部分，其它的还有Cookie跨域iframe跨域，Loc
如何解决 ajax 跨域问题
最新发布
04-23
要解决 Ajax 跨域问题，可以采用以下方法： 1. 通过服务器端代理实现。 2. 使用 JSONP（JSON with Padding）方式进行跨域请求。 3. 设置响应头部的 Access-Control-Allow-Origin 字段，允许指定的域名访问。 4. 使用 HTML5 中的 postMessage() 方法实现跨域通信。 5. 在不同子域之间传递 Cookie 值。 6. 使用 WebSocket 进行跨域数据传输。 7. 使用反向代理服务器进行跨域请求。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、C币套餐、付费专栏及课程。

余额充值