angular 网络请求

待我称王封你为后i 2022-06-01 06:10 226阅读 0赞

demo13.component.ts

import { Component, OnInit } from '@angular/core';
    import {MyHttpService} from './myhttp.service';
    
    @Component({
        selector: 'demo13',
        template: `
            <h2>http</h2>
            <button (click)="handleClick()">按钮</button>
        `
    })
    
    export class Demo13Component implements OnInit {
        constructor(private myHS:MyHttpService) { }
    
        ngOnInit() { }
    
        handleClick(){
            this.myHS.sendRequest('http://jsonplaceholder.typicode.com/posts').subscribe((result)=>{
                console.log(result);
            });
        }
    }

myhttp.service.ts

import { Injectable } from '@angular/core';
    import { Http, Response } from '@angular/http';
    import { Observable } from 'rxjs/Observable';
    import 'rxjs/add/operator/map';
    import 'rxjs/add/operator/catch';
    
    @Injectable()
    export class MyHttpService {
        constructor(private http: Http) { }
        
        sendRequest(myUrl:string){
            //a-http-get
            return this.http.get(myUrl,{withCredentials:true}) //withCredentials 携带凭证，如果服务器是php，需要加两个请求头
                .map((response: Response) => response.json());
        }
    }

app.module.ts：

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

import \{ MyHttpService\} from './demo13/myhttp.service';

@ NgModule(\{

providers:\[ HeartService, MyHttpService\],

imports: \[ BrowserModule, FormsModule, HttpModule \],

header('Access-Control-Allow-Origin:http://localhost:3000');
    header('Access-Control-Allow-Credentials: true');

发表评论取消回复

表情：

评论列表（有 0 条评论，226人围观）

还没有评论，来说两句吧...

相关阅读

相关 angular数据get请求

先在根模块app.module.ts文件引入 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_

缺乏、安全感/ 2023年08月17日 16:52/ 0 赞/ 177 阅读

相关 angular 6 HttpClient 请求数据方式总结

前端应用都需要通过HTTP协议与后端进行服务通，目前浏览器主要支持两种API通讯：XMLHttpRequest 接口和 fetch() API。而anluar最新提供的Http

ゝ一世哀愁。/ 2023年07月02日 03:16/ 0 赞/ 49 阅读

相关 Angular Rxjs异步请求和http请求

一、异步请求异步请求有三种方式：1. 回调函数获取异步数据 2.Promis获取异步数据 3. Rxjs获取异步数据 1.1 回调函数获取异步数据

￡神魔★判官ぃ/ 2023年06月13日 06:05/ 0 赞/ 59 阅读

相关 Angular请求同步async、await使用方式

原文出处：[https://blog.csdn.net/inforstack/article/details/84305087?utm\_medium=distribute.p

左手的ㄟ右手/ 2023年02月22日 05:07/ 0 赞/ 50 阅读

相关网络请求

1、同步请求可以从因特网请求数据，一旦发送同步请求，程序将停止用户交互，直至服务器返回数据完成，才可以进行下一步操作， 2、异步请求不会阻塞主线程，而会建立一个新的线程来操作

客官°小女子只卖身不卖艺/ 2022年08月21日 04:15/ 0 赞/ 233 阅读

相关 angular 网络请求

demo13.component.ts import { Component, OnInit } from '@angular/core'; import {

待我称王封你为后i/ 2022年06月01日 06:10/ 0 赞/ 226 阅读

相关 angular4对http请求的封装

本章节使用到的技术点 1、封装了带头部信息的(可能出于安全考虑`CSRF`攻击类的,或者`python-web`开发就必须要带`tockend`头信息) 2、简单

以你之姓@/ 2022年05月27日 11:53/ 0 赞/ 257 阅读

相关 Angular4基本网络请求get、post方式

angular2的网络请求和4还是有很大区别的，写一个项目的话肯定会用到http服务，除非你都是静态页，这只是一个最基本的、深入的拓展即可，希望能够帮助大家吧，谢谢首先如

秒速五厘米/ 2022年05月08日 16:36/ 0 赞/ 229 阅读

相关 angular4 前端(伪)同步请求、阻塞请求后台

1，(伪)同步请求获取后台数据，按先后顺序执行请求，示例： import \{ map, mergeMap \} from "rxjs/operators"; this.h

比眉伴天荒/ 2022年01月23日 20:47/ 0 赞/ 230 阅读

相关网络请求&网络图片

网络请求总结 Anroid原生网络请求 HttpURLConnention: 谷歌原生提供的用于网络请求的轻量级方案，支持数据压缩；缺点是封装性差，使用起来麻烦，尤其是做m

落日映苍穹つ/ 2022年01月05日 12:21/ 0 赞/ 309 阅读