AngularJS下$http服务Post方法传递json参数的实例


Posted in Javascript onMarch 29, 2018

本文主要介绍如何使用Angularjs $http服务以POST方法向服务器传递json对象数据。

具体如下:

一、$http POST方法默认提交数据的类型为application/json

var data = {'wid':'0', 'praise' : '25'}; 
$http.post(url, data).success(function(result) { 
 // 
});

最终发送的请求是:

POST http://www.example.com HTTP/1.1 
Content-Type: application/json;charset=utf-8 
 
{'wid':'0','praise':'25'}

默认的这种方式可以直接将json对象以字符串的形式传递到服务器中,比较适合 RESTful 的接口。但是php脚本的$_POST无法从请求体中获得json数据。

此时可以用:

$data = file_get_contents("php://input"); //获得原始输入流

注:enctype="multipart/form-data" 的时候 php://input 是无效的

获得请求原始输入流之后再做相应处理就可以获得json数据了。

二、 采用x-www-form-urlencoded 方式提交获得json数据

app.factory("Comment",function($http){
 return {
  get : function(commentFileUrl) {
   return $http({
    method: "GET",
    url: commentFileUrl,
    params: {R:Math.random()},
    headers: {'Cache-Control':'no-cache'}
   });
  },

  //保存一个评论
  save : function(toUrl,saveFileUrl,Data) {
   $http({
    method: "POST",
    url: toUrl,
    data: {saveUrl:saveFileUrl,commit:Data},
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
    transformRequest: function(obj) {
     var str = [];
     for (var p in obj) {
      str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
     }
     return str.join("&");
    }
   }).success(function(data){
    console.log("数据已保存!");
   }).error(function(data) {
    alert("数据保存失败,错误信息:" + JSON.stringify({data:data}));
   });
  }
 }
});
var updateClickRate={'wid':'0','click_rate':'87'};
Comment.save("php/updateWork.php","../userdata/work_content.json",JSON.stringify(updateClickRate));

最终发送的请求是:

AngularJS下$http服务Post方法传递json参数的实例

然后php服务端通过$_POST['commit'] 对象就可以获得json字符串了。json对象用于http数据传输方便易用,相比xml更加小巧轻便。希望本文对你有所帮助。推荐一篇文章:HTTP四种常见的POST提交数据方式然后 php服务端通过$_POST['commit'] 对象就可以获得json字符串了。

json对象用于http数据传输方便易用,相比xml更加小巧轻便。希望本文对你有所帮助。

以上这篇AngularJS下$http服务Post方法传递json参数的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js判断输入是否为正整数、浮点数等数字的函数代码
Nov 17 Javascript
详解JavaScript对象和数组
Dec 03 Javascript
轮播的简单实现方法
Jul 28 Javascript
Angular指令封装jQuery日期时间插件datetimepicker实现双向绑定示例
Jan 22 Javascript
详解angular2封装material2对话框组件
Mar 03 Javascript
js模仿微信朋友圈计算时间显示几天/几小时/几分钟/几秒之前
Apr 27 Javascript
基于原生js运动方式关键点的总结(推荐)
Oct 01 Javascript
JavaScript+H5实现微信摇一摇功能
May 23 Javascript
JavaScript显式数据类型转换详解
Mar 18 Javascript
thinkjs微信中控之微信鉴权登陆的实现代码
Aug 08 Javascript
vue和iview实现Scroll 数据无限滚动功能
Oct 31 Javascript
JavaScript WeakMap使用详解
Feb 05 Javascript
Vue 将后台传过来的带html字段的字符串转换为 HTML
Mar 29 #Javascript
利用js实现前后台传送Json的示例代码
Mar 29 #Javascript
vue中Npm run build 根据环境传递参数方法来打包不同域名
Mar 29 #Javascript
JS获取url参数,JS发送json格式的POST请求方法
Mar 29 #Javascript
spirngmvc js传递复杂json参数到controller的实例
Mar 29 #Javascript
Vue.js 表单控件操作小结
Mar 29 #Javascript
js传递数组参数到后台controller的方法
Mar 29 #Javascript
You might like
PHP实现绘制3D扇形统计图及图片缩放实例
2014/10/01 PHP
php+ajax实现无刷新分页的方法
2014/11/04 PHP
PHP常用设计模式之委托设计模式
2016/02/13 PHP
php+ajax登录跳转登录实现思路
2016/07/31 PHP
javascript 定义新对象方法
2010/02/20 Javascript
Js event事件在IE、FF兼容性问题
2011/01/01 Javascript
基于jquery的拖动布局插件
2011/11/25 Javascript
情人节专属 纯js脚本1k大小的3D玫瑰效果
2012/02/11 Javascript
js 获取坐标 通过JS得到当前焦点(鼠标)的坐标属性
2013/01/04 Javascript
jQuery操作CheckBox的方法介绍(选中,取消,取值)
2014/02/04 Javascript
jquery调取json数据实现省市级联的方法
2015/01/29 Javascript
JavaScript函数使用的基本教程
2015/06/04 Javascript
浅谈JavaScript中的分支结构
2016/07/01 Javascript
关于javascript的一些知识以及循环详解
2016/09/12 Javascript
js操作浏览器的参数方法
2017/01/21 Javascript
JavaScript实现瀑布流以及加载效果
2017/02/11 Javascript
微信小程序 扎金花简单实例
2017/02/21 Javascript
创建nuxt.js项目流程图解
2020/03/13 Javascript
JS实现电脑虚拟键盘打字测试
2020/06/24 Javascript
通过实例了解Nodejs模块系统及require机制
2020/07/16 NodeJs
详解Python的Django框架中inclusion_tag的使用
2015/07/21 Python
利用pyinstaller或virtualenv将python程序打包详解
2017/03/22 Python
Python多线程爬虫实战_爬取糗事百科段子的实例
2017/12/15 Python
详解Python装饰器
2019/03/25 Python
Python生成一个迭代器的实操方法
2019/06/18 Python
python3 BeautifulSoup模块使用字典的方法抓取a标签内的数据示例
2019/11/28 Python
Python函数基本使用原理详解
2020/03/19 Python
美国紧身牛仔裤品牌:NYDJ
2017/05/24 全球购物
求职者简历中的自我评价
2013/10/20 职场文书
文明班集体申报材料
2014/05/23 职场文书
工伤事故赔偿协议书范文
2014/09/24 职场文书
英文道歉信
2015/01/20 职场文书
2015年机械设备管理工作总结
2015/05/04 职场文书
学雷锋主题班会教案
2015/08/13 职场文书
中国现代文学之经典散文三篇
2019/09/18 职场文书
《巫师》是美食游戏?CDPR10月将推出《巫师》官方食谱
2022/04/03 其他游戏