首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何使用HttpClient在angular 6中请求非json八位位流?

在Angular 6中使用HttpClient请求非JSON八位字节流可以通过以下步骤实现:

  1. 首先,确保你已经导入了HttpClientModule模块。在你的模块文件(通常是app.module.ts)中添加以下代码:
代码语言:typescript
复制
import { HttpClientModule } from '@angular/common/http';

@NgModule({
  imports: [
    HttpClientModule
  ],
  // ...
})
export class AppModule { }
  1. 在你的组件或服务中导入HttpClient
代码语言:typescript
复制
import { HttpClient } from '@angular/common/http';
  1. 在构造函数中注入HttpClient
代码语言:typescript
复制
constructor(private http: HttpClient) { }
  1. 使用http.get()http.post()方法发送请求。对于非JSON八位字节流,你可以设置请求的responseType'blob'。以下是一个示例:
代码语言:typescript
复制
this.http.get(url, { responseType: 'blob' }).subscribe((response: Blob) => {
  // 处理响应
}, (error) => {
  // 处理错误
});

在上面的代码中,url是你要请求的资源的URL。通过设置responseType'blob',你将获得一个Blob对象作为响应。

  1. 处理响应。一旦收到响应,你可以使用FileReader对象将其转换为可用的数据格式。以下是一个示例:
代码语言:typescript
复制
const reader = new FileReader();
reader.onloadend = () => {
  const result = reader.result; // 这里是你的非JSON八位字节流数据
  // 处理数据
};
reader.readAsArrayBuffer(response);

在上面的代码中,response是你从服务器收到的Blob对象。通过使用FileReaderreadAsArrayBuffer()方法,你可以将Blob对象转换为ArrayBuffer,然后可以进一步处理数据。

这是使用HttpClient在Angular 6中请求非JSON八位字节流的基本步骤。根据你的具体需求,你可能需要进一步处理数据或进行其他操作。关于HttpClient的更多信息,你可以参考Angular官方文档

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

RxJS 处理多个Http请求

管理多个异步数据请求会比较困难,但我们可以借助 Angular Http 服务和 RxJS 库提供的功能来实现上述的功能。处理多个请求有多种方式,使用串行或并行的方式。...基础知识 mergeMap mergeMap 操作符用于从内部的 Observable 对象中获取值,然后返回给父级流对象。...这个例子很简单,它只处理一个请求,接下来我们来看一下如何处理两个请求。 Map 和 Subscribe 有些时候,当我们发送下一个请求时,需要依赖于上一个请求的数据。...即我们在需要在上一个请求的回调函数中获取相应数据,然后在发起另一个 HTTP 请求。...最后我们来看一下如何处理多个并行的 Http 请求。 forkJoin 接下来的示例,我们将使用 forkJoin 操作符。

5.8K20

Angular 从入坑到挖坑 - HTTP 请求概览

一、Overview angular 入坑记录的笔记第四篇,介绍在 angular 中如何通过 HttpClient 类发起 http 请求,从而完成与后端的数据交互。...XMLHttpRequest 和 fetch 在以前的项目中,通常使用 jquery 的简化版 ajax 请求向后端请求数据,归根到底最终还是通过 XMLHttpRequest 与后端进行数据交互 在...constructor(private http: HttpClient) { } /** * 获取响应类型非 json 对象的信息 */ getYuiterSitemap...,需要在使用 HttpClient 提供的请求方法时添加上 HTTP 请求头配置信息 import { Injectable } from '@angular/core'; import { Observable...; } } 当请求发生错误时,通过在 HttpClient 方法返回的 Observable 对象中使用 pipe 管道将错误传递给自定义的错误处理器,从而完成捕获错误信息的后续操作 ?

5.3K10
  • Angular Library 快速入门

    新建 Workspace $ ng new sf-lib-app $ cd sf-lib-app $ ng serve 在介绍如何创建 Angular Library 之前,让我们来看一下 Angular...文件中添加 sf-lib 项目; 在 package.json 文件中添加 ng-packagr 依赖; 在 tsconfig.json 文件中添加 sf-lib 库的引用; 在项目中的 projects...在应用中使用 sf-lib 库 import { SfLibModule } from "sf-lib"; 以上代码能正常导入 Library,是因为 Angular CLI 会优先从 tsconfig.json...在完成新建 ButtonComponent 组件的导出工作后,我们需要使用下列命令,重新构建 sf-lib 库: $ ng build --prod sf-lib sf-lib 重新构建成功后,我们就可以在模板中使用刚创建的...,我们可能需要能够灵活配置 DataService 服务中,请求服务器的地址。

    2.4K10

    Angular进阶教程2-

    那面对组件和服务之间的关系,该如何处理他们之间的依赖关系呢?Angular就引入了依赖注入框架\color{#0abb3c}{依赖注入框架}依赖注入框架去解决这件事情。...使用HttpClient 一般会在根模块下导入HttpClient import { NgModule } from '@angular/core'; import { BrowserModule }...从服务器请求数据 HttpClient.get() // 在服务类中去封装和服务端通讯的方法 public getHttpResult(code: string, name: string...color{#0abb3c}{异步数据流}异步数据流编程工具,当然Angular引入RxJS就是让异步更加简单,更加可控,在开始RxJS之前,我们先来了解一下Reactive Programming,其本质就是使用流...,所以在RxJS中,流也可以使用操作符\color{#0abb3c}{操作符}操作符实现流的汇总\color{#0abb3c}{汇总}汇总和分流\color{#0abb3c}{分流}分流。

    4.2K30

    Angular 5.0.0发布!

    Domino支持在服务器端环境下更多的开箱即用的DOM操作,可以改进我们对非服务端第三方JS及组件库的支持。 编译器改进 为支持递增编译,我们改进了Angular编译器。...在以前版本的Angular中,我们一直依赖浏览器及其i18n API提供数值、日期和货币格式。为此,很多开发者都在使用腻子脚本(polyfill),而结果也不好。...通过把指令导出为多个名称,可以在不破坏原有代码的情况下在Angular语法中使用新名称。Angular Material项目已经在其前缀迁移项目中用上了,对其他组件作者肯定也有用。...v4.3在 @angular/common中推出过HttpClient,用于在Angular中发送请求,它小巧易用。...HttpClient受到了开发者的广泛赞誉,因此我们推荐在所有应用中使用它,放弃之前的 @angular/http library。

    4.4K40

    Angular JSONP 详解

    一、什么是 JSONP JSONP(JSON with Padding)是数据格式JSON的一种 “使用模式”,可以让网页从别的网域要数据。另一个解决这个问题的新方法是跨来源资源共享。...利用 script 元素的这个开放策略,网页可以得到从其他来源动态产生的 JSON 数据,而这种使用模式就是所谓的 JSONP。...三、Angular JSONP 示例 在 Angular 项目中,要使用 JSONP 实现跨域资源访问,我们需要导入 HttpClientModule 和 HttpClientJsonpModule 模块...接着在经过一小段时间,控制台输出了相关的数据。 四、Angular JSONP 原理简析 在了解 JSONP 的工作原理之后,再看 Angular 的源码就清晰简单很多。...在 Angular HttpClient 拦截器 这篇文章中,我们已经介绍了拦截器的作用与使用。

    2.3K41

    【响应式编程的思维艺术】 (5)Angular中Rxjs的应用示例

    开发中Rxjs几乎默认是和Angular技术栈绑定在一起的,笔者最近正在使用ionic3进行开发,本篇将对基本使用方法进行演示。...Angular应用中的Http请求 Angular应用中基本HTTP请求的方式: import { Injectable } from '@angular/core'; import { Observable.../message.service';//某个自定义的服务 import { HttpClient, HttpParams, HttpResponse } from '@angular/common/http...使用Rxjs构建Http请求结果的处理管道 3.1 基本示例 尽管看起来Http请求的返回结果是一个可观测对象,但是它却没有map方法,当需要对http请求返回的可观测对象进行操作时,可以使用pipe操作符来实现...,{observe:'response'}); } http请求默认返回一个冷Observable,每当返回的流被订阅时就会触发一个新的http请求,Rxjs中通过shareReplay( )操作符将一个可观测对象转换为热

    6.7K20

    ionic3升级适配angular5

    也已经失效; compiler: 编译选项useDebug从v4版本已经弃用且无效,现在移除; common: NgFor在v4版本被弃用,现用NgForOf代替,但不影响在模版中使用*ngFor; common...core: TrackByFn在v4版本被弃用并移除,现用TrackByFunction代替; http: 弃用 @angular/http,转为使用@angular/common/http; router...在本项目中,因为没有用到那几个内置管道,也没有用到路由,所以主要是调整Http模块: 在4.x中HttpClient模块被封装在@angular/common中,新的HttpClient被封装在@angular.../common/http中,更新Http模块后,需要使用HttpClientModule替换原有HttpModule,并在使用http服务时,可以去掉map(res=>res.json())的调用,因为新模块中已经不再需要了...} from '@angular/common/http'; …… constructor(public http: HttpClient) { } 若有请求选项,直接用一个any对象(因为原来的

    2.5K40

    Angular开发实践(六):服务端渲染

    AppServerModule 还会告诉 Angular 再把你的应用以 Universal 方式运行时,该如何引导它。...6、修改 @angular/cli 的配置文件:.angular-cli.json 在 apps 下添加: { "platform": "server", "root": "src",...在客户端导入,用于实现将状态从服务端传输到客户端 TransferHttpCacheModule:用于实现服务端到客户端的请求传输缓存,防止客户端重复请求服务端已完成的请求 使用这几个模块,可以解决 http...请求在服务端和客户端分别请求一次 的问题。...在 app.module.ts 中导入之后,Angular自动会将服务端请求缓存到客户端,换句话说就是服务端请求到数据会自动传输到客户端,客户端接收到数据之后就不会再发送请求了。

    4.8K100

    Java Response 返回值处理的最佳实践:如何高效获取与操作响应数据

    在开发Web应用程序时,我们经常需要通过HTTP请求从服务器获取响应数据,这些数据可以是JSON、XML、甚至是文件。如何在Java中高效处理这些返回值,并对其进行解析、操作,成为开发者常见的问题。...核心问题:如何从Response中提取返回值?如何处理不同格式的响应数据(如JSON、XML等)?如何处理响应中的异常情况,如404、500错误?...关键技术点:使用HttpURLConnection或HttpClient处理原生HTTP请求。使用Jackson或Gson等库解析JSON格式的响应。...对于文件下载或二进制数据处理,使用Java的IO流处理返回值。...使用案例分享案例 1:使用RestTemplate解析JSON数据在Spring框架中,RestTemplate是处理HTTP请求的常用工具。

    59531
    领券