angular8请求 公共IP

内置模块 HttpClient

get请求

app.module.ts
import {HttpClientModlue} from "@angular/common/http"
imports:[HttpClientModule]

用到的地方引入HttpClient
import {HttpClient } from "@angular/common/http"
constructor(public http:HttpClient){}
this.http.get(api).subscribe((r:any)=>{
    
})

post请求

app.module.ts
import {HttpClientModlue} from "@angular/common/http"
imports:[HttpClientModule]

用到的地方引入HttpClient
import {HttpClient，HttpHeaders } from "@angular/common/http"
constructor(public http:HttpClient){}
const httpOptions={
   headers:new HttpHeaders({'Content-Type':'application/json'})
}
this.http.post(api,{user:'123',age:23},httpOptions).subscribe((r:any)=>{
    
})

jsonp请求 跨域的解决方案

app.module.ts
import {HttpClientModlue，HttpClientJsonpModlue} from "@angular/common/http"
imports:[HttpClientModule,HttpClientJsonpModlue]

用到的地方引入HttpClient
import {HttpClientJsonp } from "@angular/common/http"
constructor(public http:HttpClientJsonp ){}
this.http.jsonp(api,'callback').subscribe((r:any)=>{
    
})

第三方模块 axios

新建 httpService.service服务
引入

npm i axios --save

用到的地方引入

import axios form 'axios'

封装

axiosGet(api){
   return new Promise((resolve,reject){
       axios.get(api).then(function(res){
            resolve(res)
       })
   })
}

使用

app.module.ts引入
import HttpServiceService from './httpservice.servicce'
providers:[HttpServiceService]
使用的地方引入
import HttpServiceService from './httpservice.servicce'
constructor(public httpService:HttpServiceService){}
this.httpService.axiosGet(api).then((data)=>{
})

封装公共IP

1 创建服务

ng g service services/common

2 引入

app.module.ts 
 import {CommonService} from './services/common.service'
 providers:[CommonService]

3 在使用的地方

import {HttpClient} from '@angular/common/http'
constructor(public http:HttpClient){}
public uIp = 'http://172.168.10.12:8100'
get(api){
   return new Promise((resolve,reject)=>{
      this.http.get(this.uIp + api).subscribe((r)=>{
	       resolve(r)
	   })
   })
}

4 使用时

import {CommonService} form "../services/common.service"
constructor(public common:CommonService){}
this.common.get(api).then(res=>{
})