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";

显示效果：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 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与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() {

  • 后端接收不到AngularJs中$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请求通过消息体传递参数的实现方法

    本文实例讲述了Angularjs中$http以post请求通过消息体传递参数的方法.分享给大家供大家参考,具体如下: Angularjs中,$http以post在消息体中传递参数,需要做以下修改,以确保消息体传递参数的正确性. 一.在声明应用的时候进行设置: var httpPost = function($httpProvider) { /******************************************* 说明:$http的post提交时,纠正消息体 ***********

  • Python接口自动化之浅析requests模块post请求

    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请求

    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模块发送请求实现过程解析

    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请求实现

    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请求实例详解

    本文在这基础上分析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

随机推荐