AngularJS $http模块POST请求实现
一、代码如下：
$http({
method:'post',
url:'post.php',
data:{name:"aaa",id:1,age:20}
}).success(function(req){
console.log(req);
})
解决方案：
1、
var myApp = angular.module('app',[]);
myApp.config(function($httpProvider){
$httpProvider.defaults.transformRequest = function(obj){
var str = [];
for(var p in obj){
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
}
return str.join("&");
2.
$http({
method:'post',
url:'post.php',
data:{name:"aaa",id:1,age:20},
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(req){
console.log(req);
})
php
$rawpostdata = file_get_contents("php://input");
$post = json_decode($rawpostdata, true);
//传的数据都在$post中了;
二、 $http请求数据主要会有以下三种方式
1.get请求
2.post请求
3.jsonp
<!DOCTYPE html>
<html lang="zh_CN">
<head>
<meta charset="UTF-8">
<title>Angular基础</title>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="personCtrl">
姓：<input type="text" ng-model="firstName"/><br/>
名：<input type="text" ng-model="lastName"/><br/>
姓名：<span ng-bind="firstName"></span><span ng-bind="lastName"></span>
</div>
</div>
<script src="angular.min.js"></script>
<script type="application/javascript">
var myApp=angular.module('myApp',[]);
myApp.controller('personCtrl',function($scope,$http){
$http.get('getData.php').
success(function(data) {
console.log(data);
}).
error(function(err) {
//错误代码
});
//$http.post采用postJSON方式发送数据到后台，
// 解决办法：在后台php中使用$postData=file_get_contents("php://input",true);这样就可以获得前端传送过来的数据
var postData={msg:'post的内容'};
var config={params:{id:'5',name:'张三丰'}};
$http.post('postData.php', postData,config).
success(function(data) {
console.log(data);
}).
error(function(err) {
//错误代码
});
var myUrl ="http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1&callback=JSON_CALLBACK";
$http.jsonp(myUrl).success(
function(data){
console.log(data);
}
).error(function(err){
//错误代码
});
$scope.firstName="Wang";
$scope.lastName="Ben";
});
</script>
</body>
</html>
<?php
//postData.php文件
//用接收json数据的方式
$msg=file_get_contents("php://input",true);
$name=$_GET['name'];
echo $name.$msg."_post";
显示效果：
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。
相关推荐
-
angularJS 发起$http.post和$http.get请求的实现方法
AngularJS发起$http.post请求 代码如下: $http({ method:'post', url:'post.php', data:{name:"aaa",id:1,age:20} }).success(function(req){ console.log(req); }) 这时候你会发现收不到返回的数据,结果为null,这是因为要转换成form data. 解决方案: 配置$httpProvider: var myApp = angular.module('app',
-
Angularjs中$http以post请求通过消息体传递参数的实现方法
本文实例讲述了Angularjs中$http以post请求通过消息体传递参数的方法.分享给大家供大家参考,具体如下: Angularjs中,$http以post在消息体中传递参数,需要做以下修改,以确保消息体传递参数的正确性. 一.在声明应用的时候进行设置: var httpPost = function($httpProvider) { /******************************************* 说明:$http的post提交时,纠正消息体 ***********
-
后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法
1.问题: 后端接收不到AngularJs中$http.post发送的数据,总是显示为null 示例代码: $http.post(/admin/KeyValue/GetListByPage, { pageindex: 1, pagesize: 8 }) .success(function(){ alert("Mr靖"); }); 代码没有错,但是在后台却接收不到数据,这是为什么呢? 用火狐监控:参数是JSON格式 用谷歌监控:传参方式是request payload 可以发现传参方式是
-
AngularJS封装$http.post()实例详解
AngularJS封装$http.post()实例详解 用了不是很长的时间跟了一个移动APP项目,用的是ionic + AngularJS + cordova框架,其间遇到过挺多问题,其中一个就是对Ajax的封装问题. 其实针对封装问题一直以来就没停止过谈论,不同的项目也有不同的需求,举个典型的例子,我在做这个项目的时候因为一开始没有考虑封装问题所以被批评了,而我的一个朋友却因为封装了受到了批评--很尴尬不是么. 那么对于是否要封装这个问题,究竟该怎么界定?其实这不是一个很复杂的问题,归根到
-
对比分析AngularJS中的$http.post与jQuery.post的区别
很多时候我们需要用ajax提交post数据,angularjs与jq类似,也有封装好的post. 但是jQuery的post明显比angularjs的要简单一些,人性化一些. AngularJS: 复制代码 代码如下: $http.post('do-submit.php',myData) .success(function(){ // some code }); jQuery: 复制代码 代码如下: $.post('do-submit.php', myData, function() {
-
Python接口自动化之浅析requests模块post请求
在上一篇Python接口自动化测试系列文章:Python接口自动化之浅析requests模块get请求,介绍了requests模块.get请求及响应结果详解.接下来介绍requests模块中的post请求的使用. 一.源码解析 def post(url, data=None, json=None, **kwargs): r"""Sends a POST request. :param url: URL for the new :class:`Request` object.
-
Python接口自动化之浅析requests模块get请求
一.requests模块说明 介绍 Requests是Python语言的第三方的库,专门用于发送HTTP请求. 特点 1.Requests支持HTTP连接保持和连接池,支持使用cookie保持会话,支持文件上传,支持自动响应内容的编码,支持国际化的URL和POST数据自动编码. 2.在python内置模块的基础上进行了高度的封装,从而使得python进行网络请求时,变得人性化,使用Requests可以轻而易举的完成浏览器可有的任何操作. 3.Requests会自动实现持久连接keep-alive
-
node使用async_hooks模块进行请求追踪
async_hooks 模块是在 v8.0.0 版本正式加入 Node.js 的实验性 API.我们也是在 v8.x.x 版本下投入生产环境进行使用. 那么什么是 async_hooks 呢? async_hooks 提供了追踪异步资源的 API,这种异步资源是具有关联回调的对象. 简而言之,async_hooks 模块可以用来追踪异步回调.那么如何使用这种追踪能力,使用的过程中又有什么问题呢? 认识 async_hooks v8.x.x 版本下的 async_hooks 主要有两部分组成,一个
-
Python urllib request模块发送请求实现过程解析
1.Request()的参数 import urllib.request request=urllib.request.Request('https://python.org') response=urllib.request.urlopen(request) print(response.read().decode('utf-8')) 通过构造这个数据结构,一方面可以我们可以将请求独立成一个对象,另一方面可以更加丰富和灵活地配置参数. 它的构造方法如下: class.urllib.reques
-
AngularJS $http模块POST请求实现
一.代码如下: $http({ method:'post', url:'post.php', data:{name:"aaa",id:1,age:20} }).success(function(req){ console.log(req); }) 解决方案: 1. var myApp = angular.module('app',[]); myApp.config(function($httpProvider){ $httpProvider.defaults.transformRequ
-
python爬虫 基于requests模块的get请求实现详解
需求:爬取搜狗首页的页面数据 import requests # 1.指定url url = 'https://www.sogou.com/' # 2.发起get请求:get方法会返回请求成功的响应对象 response = requests.get(url=url) # 3.获取响应中的数据:text属性作用是可以获取响应对象中字符串形式的页面数据 page_data = response.text # 4.持久化数据 with open("sougou.html","w&
-
python通过get,post方式发送http请求和接收http响应的方法
本文实例讲述了python通过get,post方式发送http请求和接收http响应的方法.分享给大家供大家参考.具体如下: 测试用CGI,名字为test.py,放在apache的cgi-bin目录下: #!/usr/bin/python import cgi def main(): print "Content-type: text/html\n" form = cgi.FieldStorage() if form.has_key("ServiceCode") a
-
nginx处理http请求实例详解
本文在这基础上分析nginx服务器收到http请求行.请求头部后,http框架是如何调度各个http模块共同完成这个http请求.例如: http框架调度静态模块,获取服务器目录下的某个html页面返回给客户端: 或者http框架调度access权限访问模块,判断这个客户端是否有权限访问服务器. 一.event事件与http框架的交互 在接收完http请求行.http请求头部后,会调用ngx_http_process_request这个函数开始处理http请求.因为一个http请求由11个处理阶
-
如何开发出更好的JavaScript模块
不少人都曾经在 npm 上发布过自己开发的 JavaScript 模块,而在使用一些模块的过程中,我经常产生"这个模块很有用,但如果能 xxx 就更好了"的想法.所以,本文将站在模块使用者的角度总结一下,如何能让模块变得更好用. 提供 ES6 模块的入口 webpack 和 rollup 都支持对 ES6 模块做一些静态优化(例如 Tree Shaking 和 Scope Hoisting),它们都会优先读取 package.json 中的 module 字段作为 ES6 模块的入口,
-
angular2中Http请求原理与用法详解
本文实例讲述了angular2中Http请求原理与用法.分享给大家供大家参考,具体如下: 提供HTTP服务 HttpModule并不是Angular的核心模块. 它是Angular用来进行Web访问的一种可选方式,并位于一个名叫@angular/http的独立附属模块中. 编辑app.module.ts import { HttpModule, JsonpModule } from '@angular/http'; @NgModule({ imports: [ HttpModule, Jsonp