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 相关文章推荐
让广告代码不再影响你的网页加载速度
Jul 07 Javascript
两种简单实现菜单高亮显示的JS类代码
Jun 27 Javascript
javascript 广告后加载,加载完页面再加载广告
Nov 25 Javascript
yepnope.js使用详解及示例分享
Jun 23 Javascript
javascript获取dom的下一个节点方法
Sep 05 Javascript
jquery插件推荐浏览器嗅探userAgent
Nov 09 Javascript
jquery 插件实现瀑布流图片展示实例
Apr 03 Javascript
Javascript控制div属性动态变化实例分析
Oct 08 Javascript
基于jQuery的网页影音播放器jPlayer的基本使用教程
Mar 08 Javascript
js实现页面刷新滚动条位置不变
Nov 27 Javascript
vue 虚拟dom的patch源码分析
Mar 01 Javascript
小程序实现授权登陆的解决方案
Dec 02 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
模拟flock实现文件锁定
2007/02/14 PHP
Laravel 5 框架入门(四)完结篇
2015/04/09 PHP
PHP变量赋值、代入给JavaScript中的变量
2015/06/29 PHP
用JS实现的一个include函数
2007/07/21 Javascript
javascript Discuz代码中的msn聊天小功能
2008/05/25 Javascript
jQuery下扩展插件和拓展函数的写法(匿名函数使用的典型例子)
2010/10/20 Javascript
javascript 弹出窗口中是否显示地址栏的实现代码
2011/04/14 Javascript
Javascript中的关键字和保留字整理
2014/10/16 Javascript
浅谈JavaScript函数的四种存在形态
2016/06/08 Javascript
原生js实现jquery函数animate()动画效果的简单实例
2016/08/21 Javascript
jQuery实现最简单的切换图效果【可兼容IE6、火狐、谷歌、opera等】
2016/09/04 Javascript
vue select组件的使用与禁用实现代码
2018/04/10 Javascript
JavaScript函数式编程(Functional Programming)组合函数(Composition)用法分析
2019/05/22 Javascript
JavaScript实现alert弹框效果
2020/11/19 Javascript
使用Python中的cookielib模拟登录网站
2015/04/09 Python
Python的Flask框架应用程序实现使用QQ账号登录的方法
2016/06/07 Python
Python实现简易版的Web服务器(推荐)
2018/01/29 Python
Python利用matplotlib做图中图及次坐标轴的实例
2019/07/08 Python
Django框架自定义模型管理器与元选项用法分析
2019/07/22 Python
Python Django 封装分页成通用的模块详解
2019/08/21 Python
Python标准库shutil模块使用方法解析
2020/03/10 Python
opencv 阈值分割的具体使用
2020/07/08 Python
Finishline官网:美国一家领先的运动品牌鞋类、服装零售商
2016/07/20 全球购物
英国领先的维生素和补充剂品牌:Higher Nature
2019/08/26 全球购物
广播电视新闻学专业应届生求职信
2013/10/08 职场文书
护理专业自我鉴定
2014/01/30 职场文书
第一批党的群众路线教育实践活动工作总结
2014/03/03 职场文书
多媒体编辑专业毕业生求职信
2014/06/13 职场文书
幼儿生日活动方案
2014/08/27 职场文书
2014年高三班主任工作总结
2014/12/05 职场文书
2014年小学少先队工作总结
2014/12/18 职场文书
新闻稿怎么写
2015/07/18 职场文书
canvas多重阴影发光效果实现
2021/04/20 Javascript
教你用eclipse连接mysql数据库
2021/04/22 MySQL
Python基础之条件语句详解
2021/06/16 Python
前端JS获取URL参数的4种方法总结
2022/04/05 Javascript