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 相关文章推荐
初窥JQuery-Jquery简介 入门了解篇
Nov 25 Javascript
JQuery给元素添加/删除节点比如select
Apr 02 Javascript
javascript设置和获取cookie的方法实例详解
Jan 05 Javascript
玩转JavaScript OOP - 类的实现详解
Jun 08 Javascript
JavaScript 控制字体大小设置的方法
Nov 23 Javascript
jQuery编写设置和获取颜色的插件
Jan 09 Javascript
bootstrap实现动态进度条效果
Mar 08 Javascript
Angular+Node生成随机数的方法
Jun 16 Javascript
Easyui Datagrid自定义按钮列(最后面的操作列)
Jul 13 Javascript
vue中配置mint-ui报css错误问题的解决方法
Oct 11 Javascript
浅谈React组件之性能优化
Mar 02 Javascript
Node.js在图片模板上生成二维码图片并附带底部文字说明实现详解
Aug 07 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
joomla内置的表单验证功能使用方法
2010/06/11 PHP
PHP解决URL中文GBK乱码问题的两种方法
2014/06/03 PHP
php进程间通讯实例分析
2016/07/11 PHP
php版阿里云OSS图片上传类详解
2016/12/01 PHP
php微信开发之关键词回复功能
2018/06/13 PHP
深入研究PHP中的preg_replace和代码执行
2018/08/15 PHP
微信支付之JSAPI公众号支付详解
2019/05/15 PHP
基于Jquery的表格隔行换色,移动换色,点击换色插件
2010/12/22 Javascript
输入密码检测大写是否锁定js实现代码
2012/12/03 Javascript
JQuery切换显示的效果实例代码
2013/02/27 Javascript
node.js正则表达式获取网页中所有链接的代码实例
2014/06/03 Javascript
js中string转int把String类型转化成int类型
2014/08/13 Javascript
基于NodeJS的前后端分离的思考与实践(一)全栈式开发
2014/09/26 NodeJs
Javascript数据结构与算法之列表详解
2015/03/12 Javascript
js网页滚动条滚动事件实例分析
2015/05/05 Javascript
利用JavaScript实现拖拽改变元素大小
2016/12/14 Javascript
Easyui和zTree两种方式分别实现树形下拉框
2017/08/04 Javascript
js实现动态增加文件域表单功能
2018/10/22 Javascript
小程序如何使用分包加载的实现方法
2019/05/22 Javascript
vue 数据操作相关总结
2020/12/17 Vue.js
pyqt4教程之实现windows窗口小示例分享
2014/03/07 Python
Python使用Redis实现作业调度系统(超简单)
2016/03/22 Python
python 使用get_argument获取url query参数
2017/04/28 Python
TensorFlow用expand_dim()来增加维度的方法
2018/07/26 Python
pycharm 对代码做静态检查操作
2020/06/09 Python
Manduka官网:瑜伽垫、瑜伽毛巾和服装
2018/07/02 全球购物
Sisley法国希思黎中国官网:享誉全球的奢华植物美容品牌
2019/06/30 全球购物
常用UNIX 命令(Linux的常用命令)
2015/12/26 面试题
幼儿园小班评语大全
2014/04/17 职场文书
新闻编辑求职信
2014/07/13 职场文书
交警失职检讨书
2015/01/26 职场文书
校园歌手大赛主持词
2015/07/03 职场文书
2016年读书月活动总结范文
2016/04/06 职场文书
导游词之徐州-云龙山
2019/09/29 职场文书
JavaScript组合继承详解
2021/11/07 Javascript
mysql中varchar类型的日期进行比较、排序等操作的实现
2021/11/17 MySQL