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 ...
随机推荐
- Git命令详解【2】
git的工作区 git 安装 sudo apt-get insall git 查看git 版本 git --version git的配置 #配置用户名 git config --global ...
- jax-ws实现WebService
关于WebService有很多框架了,CXF,Spring自己的webservice等等,因为cxf实际也是依赖spring的servlet,这里说明一下jax-ws,使用原生的servlet实现. ...
- chromium安装flash
sudo apt-get install pepperflashplugin-nonfree sudo update-pepperflashplugin-nonfree --install Flash ...
- ueditor富文本编辑在 asp.net MVC下使用步骤
mvc项目中用到了这个富文本编辑就试着把遇到的问题个使用步骤在这里记录一下,希望大家少走弯路. 1.首先我们先下载net版本的uediot r.
- webapp框架—学习AngularUI2(demo改造)
目的:把AngularUI的模板应用到“桂电在线”上 步骤如下: 按功能表修改demo界面 学习angularUI如何加载全部页面,为了设置自定义加载模板,在demo/demo.js中找到这一段 // ...
- 主流的phpcms分析
小型网站适合wordpress,onethink,joomla(囧啦) wordpress(免费开源) 优点:1.样式丰富,模板重多 2. 安全性 3. 对搜索引擎友好,收录快. ...
- 一个c++给程序打log的单例模式类
开发过程中需要给程序打log. 所以照着网上写了个单例模式的log类 #ifndef MISCLOGWRITER_H_ #define MISCLOGWRITER_H_ #include <io ...
- init_sequence所对应的函数
一.init_sequence内容 init_fnc_t *init_sequence[] = { cpu_init, /* basic cpu dependent setup */ board_in ...
- iOS:图像和点击事件
问题:如何区分点的是哪张图片? // // main.m // Hello // // Created by lishujun on 14-8-28. // Copyright (c) 2014年 l ...
- LightOj_1274 Beating the Dataset
题目链接 题意: 给一个文档, 这个文档由yes .no 组成, 共有s个byte, 共有n个yes.no. 假设yes的个数为yes_num, no的个数为no_num. 将这n个数进行排列, 对于 ...