angular 请求后台2种方式

最新推荐文章于 2024-10-07 22:06:37 发布

原创最新推荐文章于 2024-10-07 22:06:37 发布 · 2.8k 阅读

4 ·

CC 4.0 BY-SA版权

笔记同时被 3 个专栏收录

6 篇文章

订阅专栏

Angular 7

6 篇文章

订阅专栏

Typescript

3 篇文章

订阅专栏

本文深入解析了HTTP请求中的Get与Post方法，详细介绍了如何使用Promise和async/await实现异步Get请求，以及如何设置POST请求的Header进行JSON数据传输。通过具体代码示例，展示了前后端交互中两种请求方式的实现细节。

1.Get 同步及异步

 async get(url: string, params: any): Promise<any>{

    return new Promise<any>(resolve => {

      this.http.get<any>(url, { params })

        .pipe(

          catchError(this.handleError([]))

        ).subscribe(h => {

          resolve(h);

        });

    });

  }

get(url: string, params: any){

 return this.http.get<any>(url,{ params })

    .pipe(

        catchError(this.handleError([]))

    );

}

前台获取 同步

 this.appService.get(url, null).subscribe(h => {

      console.log(h);

    });

异步

 const  tets = await  get(url, null);

2.Post

  async post(url: string, params: any): Promise<any> {

    var header = new HttpHeaders().set("Content-Type", "application/json");

    return new Promise<any>(resolve => {

      this.http.post<any>(url, params, { headers: header } )

        .pipe(

          catchError(this.handleError([]))

        ).subscribe(h => {

          resolve(h);

        });

    });

  }