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 相关文章推荐
javascript-TreeView父子联动效果保持节点状态一致
Aug 12 Javascript
javascript 尚未实现错误解决办法
Nov 27 Javascript
JQuery入门—编写一个简单的JQuery应用案例
Jan 03 Javascript
让jQuery Mobile不显示讨厌loading界面的方法
Feb 19 Javascript
Javascript常用字符串判断函数代码分享
Dec 08 Javascript
javascript 判断整数方法分享
Dec 16 Javascript
详解微信小程序文件下载--视频和图片
Apr 24 Javascript
layui table设置某一行的字体颜色方法
Sep 05 Javascript
vue3修改link标签默认icon无效问题详解
Oct 09 Javascript
node.js实现简单的压缩/解压缩功能示例
Nov 05 Javascript
微信小程序实现音频文件播放进度的实例代码
Mar 02 Javascript
Vue微信公众号网页分享的示例代码
May 28 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
连接到txt文本的超链接,不直接打开而是点击后下载的处理方法
2009/07/01 PHP
jQuery中的RadioButton,input,CheckBox取值赋值实现代码
2014/02/18 PHP
PHP中的静态变量及static静态变量使用详解
2015/11/05 PHP
使用SMB共享来绕过php远程文件包含的限制执行RFI的利用
2019/05/31 PHP
PHP安装扩展mcrypt以及相关依赖项深入讲解
2021/03/04 PHP
解密效果
2006/06/23 Javascript
jQuery 自动增长的文本输入框实现代码
2010/04/02 Javascript
JavaScript中的onerror事件概述及使用
2013/04/01 Javascript
web网页按比例显示图片实现原理及js代码
2013/08/09 Javascript
node.js使用require()函数加载模块
2014/11/26 Javascript
JScript中的条件注释详解
2015/04/24 Javascript
Bootstrap选项卡与Masonry插件的完美结合
2016/07/06 Javascript
利用Jquery队列实现根据输入数量显示的动画
2016/09/01 Javascript
Angular学习笔记之angular的$filter服务浅析
2016/11/12 Javascript
AngularJS中的拦截器实例详解
2017/04/07 Javascript
angularjs实现时间轴效果的示例代码
2017/11/29 Javascript
React-native桥接Android原生开发详解
2018/01/17 Javascript
node实现基于token的身份验证
2018/04/09 Javascript
微信打开网址添加在浏览器中打开提示的办法
2019/05/20 Javascript
详细分析Node.js 多进程
2020/06/22 Javascript
vue+vuex+axios从后台获取数据存入vuex,组件之间共享数据操作
2020/07/31 Javascript
.netcore+vue 实现压缩文件下载功能
2020/09/24 Javascript
vue3.0中友好使用antdv示例详解
2021/01/05 Vue.js
[01:47]2018年度DOTA2最佳教练-完美盛典
2018/12/16 DOTA
Python configparser模块配置文件过程解析
2020/03/03 Python
python中tkinter窗口位置\坐标\大小等实现示例
2020/07/09 Python
CSS3 animation实现简易幻灯片轮播特效
2016/09/27 HTML / CSS
英国领先的男士美容护发用品公司:Mankind
2016/08/31 全球购物
澳大利亚牛仔裤商店:Just Jeans
2016/10/13 全球购物
幼儿园教师获奖感言
2014/03/11 职场文书
2015年国际护士节演讲稿
2015/03/18 职场文书
餐饮店长岗位职责
2015/04/14 职场文书
高考升学宴主持词
2019/06/21 职场文书
Java面试题冲刺第十七天--基础篇3
2021/08/07 面试题
零基础学java之带返回值的方法的定义和调用
2022/04/10 Java/Android
Nginx本地配置SSL访问的实例教程
2022/05/30 Servers