angularjs post 跨域
web api搞好了;用Ajax妥妥的;但是前端用的AngulagJS,也懒得再换为Ajax了;
但是问题来了;提示:
已拦截跨源请求:同源策略禁止读取位于 http://x.x.x.x:port/api/Person/Update 的远程资源。(原因:CORS 预检通道未成功)。
搜索一下:一般就是配置服务器和客户端的header
找到了一篇可以解决的:http://www.cnblogs.com/BGOnline/p/5996289.html
1.开启angularjs的CORS支持
.config(function($httpProvider) { // CORS post跨域配置
$httpProvider.defaults.useXDomain = true;
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
var param = function(obj) { // 修改angularjs $http.post的默认传参方式
var query = '', name, value, fullSubName, subName, subValue, innerObj, i;
for(name in obj) {
value = obj[name];
if(value instanceof Array) {
for(i=0; i<value.length; ++i) {
subValue = value[i];
fullSubName = name + '[' + i + ']';
innerObj = {};
innerObj[fullSubName] = subValue;
query += param(innerObj) + '&';
}
}
else if(value instanceof Object) {
for(subName in value) {
subValue = value[subName];
fullSubName = name + '[' + subName + ']';
innerObj = {};
innerObj[fullSubName] = subValue;
query += param(innerObj) + '&';
}
}
else if(value !== undefined && value !== null)
query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
}
return query.length ? query.substr(0, query.length - 1) : query;
};
$httpProvider.defaults.transformRequest = [function(data) {
return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
}];
delete $httpProvider.defaults.headers.common['X-Requested-With'];
})
2.开启服务器端CORS支持
header('Access-Control-Allow-Origin: *');//(我不知道这个是怎么配置的,PHP的?)
我自己的web.config相关配置
<!--跨域..-->
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Origin" value="*" />
<!--Content-Type,-->
<add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept" />
<add name="Access-Control-Allow-Methods" value="GET,POST,PUT, DELETE, OPTIONS" />
</customHeaders>
</httpProtocol>
</system.webServer>
angularjs post 跨域的更多相关文章
- AngularJS实现跨域请求
跨域,前端开发中经常遇到的问题,AngularJS实现跨域方式类似于Ajax,使用CORS机制. 下面阐述一下AngularJS中使用$http实现跨域请求数据. AngularJS XMLHttpR ...
- angularjs flask跨域问题 XMLHttpRequest cannot load. No 'Access-Control-Allow-Origin'
场景,我要来我的server(A)上用api来访问另一个server(B)的问题,如果直接在A上调用B的api,那么就会出现XMLHttpRequest cannot load. No 'Access ...
- angularjs+webapi2 跨域Basic 认证授权(二)
在上一篇中大概演示了 整个认证授权的过程.今天在这篇博客中将结合上一篇的例子继续在跨域的情况 我们用ionic 写一个简单的页面 值得注意的是 在ionic.bundle.js 里面集成了angula ...
- angularjs+webapi2 跨域Basic 认证授权(一)
如今的app,利用各种前端框架结合html5的混合开发模式已然盛极一时.其中ionic+angularjs更是如日中天.这种模式利用angularjs $http 请求数据api 以达到前后端分离深得 ...
- angularjs jsonp跨域
<script> (function(angular){ "use strict" var app= angular.module('appController',[] ...
- Angularjs之如何在跨域请求中传输Cookie
一般情况我们在使用WebApi之类的技术时,都会遇到跨域的问题,这个只需要在服务端做一下处理即可. 如果这些GET或POST请求不需要传递Cookie数据的话,就没什么问题了,但如果需要,那么会发现 ...
- angular.js跨域post解决方案
跨域,前端开发中经常遇到的问题,AngularJS实现跨域方式类似于Ajax,使用CORS机制. 下面阐述一下AngularJS中使用$http实现跨域请求数据. AngularJS XMLHttpR ...
- 利用nginx 反向代理解决跨域问题
说到nginx,不得不说真的很强大,也带来很多便利用于解决一些头疼的难题. 一般来说可以用来做:静态页面的服务器.静态文件缓存服务器.网站反向代理.负载均衡服务器等等,而且实现这一切,基本只需要改改那 ...
- AngularJS中get请求URL出现跨域问题
今天早上帮助同学看了一个AngularJS的问题,主要是请求中出现了跨域访问,请求被阻止. 下面是她给我的代码: <html lang="en" ng-app="m ...
随机推荐
- jquery自适应布局
代码整理 - uix.layout.js /** * Grace [jQuery.js] * * UIX页面布局 * 290353142@qq.com * exp: * $.uix.layout(); ...
- Android中解析XML的方法
假设我要解析如下的XML文件: <?xml version="1.0" encoding="UTF-8"?> <books> <b ...
- JS字符串操作大全
String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度.当然需要注意的是js中的中文每个汉字也只代表一个字符,这里可能跟其他语言有些不 ...
- 网站开发常用jQuery插件总结(九)侧边栏插件pageslide
一.pageslide插件功能 实现现实隐藏侧边栏的功能.插件可以读取另个一html,也可以是当前页面中的元素. 二.pageslide官方地址 http://srobbin.com/jquery-p ...
- WebMethod 属性
WebMethod有以下几种属性: BufferResponse CacheDuration Description EnableSession MessageName TransactionOpti ...
- Bootstrap_排版_表格
一.基础表格 <table class="table"> <thead> <tr> <th>表格标题</th> < ...
- php 执行linux 命令函数
php的内置函数exec,system都可以调用系统命令(shell命令),当然还有passthru,escapeshellcmd等函数. 在很多时候利用php的exec,system等函数调用系统命 ...
- Android Handler、Lopper消息驱动机制
Android应用程序是通过消息来驱动的,系统为每一个应用程序维护一个消息队例(MesageQueue),应用程序的主线程不断地从这个消息队例中获取消息(Mesage),然后对这些消息进行处理(Han ...
- java 读入换行
java中实现换行有以下几种方法:1.使用java中的转义符"\r\n": 注意:\r,\n的顺序是不能够对换的,否则不能实现换行的效果. 2.BufferedWriter的new ...
- Hibernate中的多对多关系详解(3)
前面两节我们讲到了一对一的关系,一对多,多对一的关系,相对来说,是比较简单的,但有时,我们也会遇到多对多的关系,比如说:角色与权限的关系,就是典型的多对多的关系,因此,我有必要对这种关系详解,以便大家 ...