Ionic的http请求方法,一种是使用Ionic的Native的Http方法,另一种是使用Angular的Http请求方法。

第一种真的是看着文档都实现不了,很奇怪的错(官网文档:https://ionicframework.com/docs/native/http/),不知道缺少了什么,这种方式就先不研究了

第二种Angular的请求方法又有两种,一种是使用HttpModule 的方式,现在网上大多数的介绍都是如此,但是在新版本中这种方法已经不推荐了,推荐的是另一种使用HttpClientModule 方式

HttpModule方式

import { HttpModule } from '@angular/http';

在app.module.ts 文件中添加

...
import { HttpProvider } from '../providers/http/http';
import { HttpModule } from '@angular/http'; @NgModule({
...
imports: [
...
HttpModule,
],
...
providers: [
...
HttpProvider
]
})
export class AppModule {}

在http.ts文件中

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import 'rxjs/add/operator/map'; @Injectable()
export class HttpProvider { path: string = 'https://randomuser.me/api/?results=25'; constructor(public http: Http) {
console.log('Hello HttpProvider Provider');
} loadUsers(){
return this.http.get(this.path).map(res => res.json(), err => {
console.log(err);
})
} }

在调用HTTP请求的页面中 test.ts

import {Component} from '@angular/core';
import {HttpProvider} from "../../providers/http/http"; @Component({
selector: 'page-test',
templateUrl: 'test.html',
}) export class TestPage { constructor(public http: HttpProvider) {
} f(){
this.http.loadUsers().subscribe(res => {
console.log(res.results);
},
err => {
console.log(err);
});
}
}

但是在新版的angular中,已经不推荐使用这种方法了

HttpClientModule方式

官网文档:https://angular.io/tutorial/toh-pt6

这种方法不但推荐,而且使用起来非常简单

import { HttpClientModule } from '@angular/common/http';

在app.module.ts 文件中添加

...
import {HttpClientModule} from '@angular/common/http'; @NgModule({
...
imports: [
...
HttpClientModule,
],
...
})

在调用HTTP请求的页面中 test.ts

import {Component} from '@angular/core';
import {HttpClient} from "@angular/common/http"; @Component({
selector: 'page-test',
templateUrl: 'test.html',
}) export class TestPage {
path: string = 'https://randomuser.me/api/?results=25'; constructor(private http: HttpClient) {
} f(){
this.http.get(this.path)
.subscribe(data => {
console.log(data);
});
}
}

原创文章,欢迎转载,转载请注明出处!

Ionic3的HTTP请求方法的更多相关文章

  1. HTTP请求方法详解

    HTTP请求方法详解 请求方法:指定了客户端想对指定的资源/服务器作何种操作 下面我们介绍HTTP/1.1中可用的请求方法: [GET:获取资源]     GET方法用来请求已被URI识别的资源.指定 ...

  2. HTTP请求方法

    HTTP请求方法 根据HTTP标准,HTTP请求可以使用多种请求方法. HTTP1.0定义了三种请求方法: GET, POST 和 HEAD方法. HTTP1.1新增了五种请求方法:OPTIONS, ...

  3. iOS开发 GET、POST请求方法(NSURLSession篇)

    NSURLConnection,在iOS9被宣布弃用,本文不使用NSURLConnection进行网络编程,有兴趣的童鞋可以参考: [iOS开发 GET.POST请求方法(NSURLConnectio ...

  4. iOS开发 GET、POST请求方法(NSURLConnection篇)

    Web Service使用的主要协议是HTTP协议,即超文本传输协议. HTTP/1.1协议共定义了8种请求方法(OPTIONS.HEAD.GET.POST.PUT.DELETE.TRACE.CONN ...

  5. HTTP协议中POST、GET、HEAD、PUT等请求方法以及一些常见错误

    (来源:http://www.tuicool.com/articles/Ermmmyn) HTTP请求方法: 常用方法: Get\Post\Head (1)Get方法. 取回请求URL标志的任何信息, ...

  6. HTTP请求响应报文&&相关状态码&&GET_POST请求方法 总结

    HTTP请求报文: 一个HTTP请求报文由四个部分组成:请求行.请求头部.空行.请求数据 1.请求行   请求行由请求方法字段.URL字段和HTTP协议版本字段3个字段组成,它们用空格分隔.比如 GE ...

  7. HTTP 笔记与总结(2 )HTTP 协议的(请求行的)请求方法 及 (响应行的)状态码

    (请求行的)请求方法 包括: GET,POST,HEAD,PUT,TRACE,DELETE,OPTIONS 注意:这些请求方法虽然是 HTTP 协议规定的,但是 Web Server 未必允许或支持这 ...

  8. httpclient请求方法

    /** * httpclient请求方法 * @param url 请求地址 * @param paramMap 请求参数 * @param ent 编码格式 gbk.utf-8 * @return ...

  9. HTTP请求方法对照表

    根据HTTP标准,HTTP请求可以使用多种请求方法. HTTP1.0定义了三种请求方法: GET, POST 和 HEAD方法. HTTP1.1新增了五种请求方法:OPTIONS, PUT, DELE ...

随机推荐

  1. RobotFramework自动化测试框架-常用断言关键字

    断言关键字 描述 Should Be Empty 判断是否为空,如果不为空,执行失败,示例: ${value} Set Variable Hello Should Be Empty ${value} ...

  2. RobotFramework下的http接口自动化Create Http Context关键字的使用

    要想使用HttpLibrary,Create Http Context 关键字的作用相当于是创建了一个http 调用的环境,是必不可少的一个关键字. Create Http Context 关键字需要 ...

  3. [APIO2009]会议中心

    [APIO2009]会议中心 题目大意: 原网址与样例戳我! 给定n个区间,询问以下问题: 1.最多能够选择多少个不相交的区间? 2.在第一问的基础上,输出字典序最小的方案. 数据范围:\(n \le ...

  4. [BZOJ4372]烁烁的游戏

    题面戳我 题意: 给一颗n个节点的树,边权均为1,初始点权均为0,m次操作: Q x:询问x的点权. M x d w:将树上与节点x距离不超过d的节点的点权均加上w. \(1≤n≤10^5\) sol ...

  5. iBrand 教程 0.1:Windows + Homestead 5 搭建 Laravel 开发环境

    统一开发环境 为了保证在学习和工作过程中避免因为开发环境不一致而导致各种各样的问题,Laravel 官方为了我们提供了一个完美的开发环境 Laravel Homestead,让我们无需再本地安装 PH ...

  6. IT连创业系列:新的一年,先淫文一篇!

    办公室窗外,有鸟声〜〜 在IT连创业走过的日子里,这是我第一次听见鸟声. 也许,是曾经的忙碌,封锁了自己的心眼. 岁月秒秒: 当初燃烧的火焰,从红,烧成了蓝. 曾经的内心湃澎,化成了平淡坚持. 但这, ...

  7. node.js连接MySQL操作及注意事项

    node.js作为服务端的js运行环境已经出现了有几年了,最近我有个朋友也在做这方面的开发,但是也是刚刚接触,遇到了很多坑.前几天他们在操作数据库的时候出现了点问题,后来我们一起看了看,其实都是nod ...

  8. 【经验随笔】Java程序远程调试定位特定运行环境上出现的问题

    Java后台程序远程调试 第一步:在JVM的启动参数中增加-Xdebug -Xrunjdwp:transport=dt_socket,address=6688,server=y,suspend=n 第 ...

  9. ES6学习总结二(数组的四个方法,字符串)

    数组 1 map 映射 一个对一个 如:分数数组[34,56,78,99]映射为[不及格,不及格,及格,及格]; 等级数组[23,56,89]映射为 [ {name:'lmx',level:1,rol ...

  10. 分享调用Java private方法

    上周在修复bug时,发现Java类中某方法是private,且类中没有用到,第一感觉是方法多余.其实通过分析,发现原来Native Code会通过JNI调到此方法.这也给自己启发,平时做Code re ...