ionic5-kodestykke: HTTP-netværksanmodning

Forfatter:neo yang Tid:2020/04/18 Læs: 8104

---

Brugte versioner: ionic5 og angular8

1. FÅ

1. app.modul.js

Introduktion i begyndelsen:

importer { HttpClientModule } fra '@angular/common/http';

Tilføj til import:

import: [
     ...
     HttpClientModule,
     ...
     ],

2. I sidens ts-fil (xxx.page.ts)

Introduktion i begyndelsen:

importer { HttpClient} fra '@angular/common/http';

I konstruktør:

konstruktør( 
   privat http: HttpClient
  ) { }

I ngOnInit() eller andre funktioner:

var url = "https://xxxxxx" ;    
this.http.get(url).subscribe(
    data => {
      console.log(data);
      },
    fejl => {
      console.log('fejl');
      })

2. POST

1. app.modul.js

Samme som GET.

2. I sidens ts-fil (xxx.page.ts)

Import i begyndelsen: (bemærk introduktionen af HttpHeaders, post anmodning om at indstille header)

importer { HttpClient , HttpHeaders} fra '@angular/common/http';

I konstruktør:

Samme som GET.

I ngOnInit() eller andre funktioner:

var url = "https://xxxxxx" ; 
const httpOptions = {
    headers: new HttpHeaders({ 'Content-Type': 'application/json' })
 };
this.http.post('url',{
    nøgle1: værdi1,
    nøgle2: værdi2
  } ,httpOptions)

• 'Content-Type': 'application/json' i headeren er en fælles header. Konfigurer efter dine behov.
• nøgle og værdi er parametre for post.

3. JSONP

1. app.modul.js

Introduktion i begyndelsen:

importer { HttpClientModule,HttpClientJsonpModule } fra '@angular/common/http';

Tilføj til import:

import: [
     ...
     HttpClientModule,
     HttpClientJsonpModule,
     ...
     ],

2. I sidens ts-fil (xxx.page.ts)

Introduktion i begyndelsen:

Samme som GET.

I konstruktør:

Samme som GET.

I ngOnInit() eller andre funktioner:

var url="https://xxxxxx"; this.http.jsonp(url,"callback").subscribe(
    data=>{
        console.log(data);
    },fejl=>{
        console.log('fejl');
    })