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 autocomplete 使用手册
Apr 01 Javascript
JavaScript字符串对象split方法入门实例(用于把字符串分割成数组)
Oct 16 Javascript
JS实现简单路由器功能的方法
May 27 Javascript
纯javascript实现四方向文本无缝滚动效果
Jun 16 Javascript
jquery控制页面部分刷新的方法
Jun 24 Javascript
Position属性之relative用法
Dec 14 Javascript
AngularJS实现按钮提示与点击变色效果
Sep 07 Javascript
js实现楼层导航功能
Feb 23 Javascript
基于js的变量提升和函数提升(详解)
Sep 17 Javascript
AngularJS实现自定义指令及指令配置项的方法
Nov 20 Javascript
Vue表情输入组件 微信face表情组件
Feb 11 Javascript
基于iview的router常用控制方式
May 30 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
星际争霸中的对战模式介绍
2020/03/04 星际争霸
php日历[测试通过]
2008/03/27 PHP
整理的一些实用WordPress后台MySQL操作命令
2013/01/07 PHP
thinkphp实现发送邮件密码找回功能实例
2014/12/01 PHP
一个简单至极的PHP缓存类代码
2015/10/23 PHP
laravel-admin的图片删除实例
2019/09/30 PHP
js自执行函数的几种不同写法的比较
2012/08/16 Javascript
js onkeypress与onkeydown 事件区别详细说明
2012/12/13 Javascript
jquery zTree异步加载简单实例分享
2013/02/05 Javascript
自己使用jquery写的一个无缝滚动的插件
2014/04/30 Javascript
深入分析下javascript中的[]()+!
2015/07/07 Javascript
javascript常用的方法整理
2015/08/20 Javascript
你所未知的3种Node.js代码优化方式
2016/02/25 Javascript
JS iFrame加载慢怎么解决
2016/05/13 Javascript
详解Vue 方法与事件处理器
2017/06/20 Javascript
Bootstrap table使用方法记录
2017/08/23 Javascript
select获取下拉框的值 下拉框默认选中方法
2018/02/28 Javascript
微信小程序可滑动月日历组件使用详解
2019/10/21 Javascript
js将URL网址转为16进制加密与解密函数
2020/03/04 Javascript
[01:11:08]Winstrike vs NB 2018国际邀请赛淘汰赛BO1 8.21
2018/08/22 DOTA
Python下的subprocess模块的入门指引
2015/04/16 Python
Python实现求一个集合所有子集的示例
2018/05/04 Python
python对离散变量的one-hot编码方法
2018/07/11 Python
对Pytorch中Tensor的各种池化操作解析
2020/01/03 Python
python3正则模块re的使用方法详解
2020/02/11 Python
python爬虫开发之使用python爬虫库requests,urllib与今日头条搜索功能爬取搜索内容实例
2020/03/10 Python
应聘美工求职信
2013/11/07 职场文书
升职自荐信
2013/11/28 职场文书
幼儿园托班开学寄语
2014/01/18 职场文书
教师聘用意向书
2015/05/11 职场文书
2019通用版导游词范本!
2019/08/07 职场文书
何时使用Map来代替普通的JS对象
2021/04/29 Javascript
python基础学习之递归函数知识总结
2021/05/26 Python
如何利用pygame实现打飞机小游戏
2021/05/30 Python
Qt数据库应用之实现图片转pdf
2022/06/01 Java/Android
Java界面编程实现界面跳转
2022/06/16 Java/Android