2000字范文,分享全网优秀范文,学习好帮手!
2000字范文 > 关于Angular使用http发送请求后的响应处理

关于Angular使用http发送请求后的响应处理

时间:2022-04-24 03:05:57

相关推荐

关于Angular使用http发送请求后的响应处理

源代码:

import {Component, OnInit } from '@angular/core';import {FormControl } from '@angular/forms';import {HttpClient } from '@angular/common/http';const ENDPOINT = "http://localhost:3000/echo?data=";@Component({selector: 'jerryform',template: `<input type="text" [formControl]="favoriteColorControl">`})export class ReactFormComponent implements OnInit {constructor(private http:HttpClient){}ngOnInit(): void {this.favoriteColorControl.valueChanges.subscribe((value) =>{console.log('new value: ' + value);this.http.get('http://localhost:3000/angular/' + value).subscribe((response)=>console.log('response from http: ' + response),(error)=>console.log('error: ' + error));})}favoriteColorControl = new FormControl('');}

nodejs实现的后台API代码:

app.route('/angular/*').get(function(req, res){var sResponse = 'Hello World';var oResponse = {"success:":"ok"};setTimeout( ()=>res.send(sResponse), 1000);});

测试发现,这个HTTP请求在Chrome开发者工具里标注为成功:

然后我Angular代码里触发的是error handler,而不是期望中的success handler:

从错误明细能看出,Angular期望API返回的response是json结构:Unexpected token H in JSON at position 0

观察HTTP请求头部字段里的Accept:application/json:

返回一个json格式的response即可:

更多Jerry的原创文章,尽在:“汪子熙”:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。