1.安装插件 http; ionic4 项目目录下先运行
ionic cordova plugin add cordova-plugin-advanced-http
后运行
npm install @ionic-native/http
在./src/app/app.module.ts中增加(...和...中间的内容,两处)
...
import { HTTP } from '@ionic-native/http/ngx';
...
@NgModule({
declarations: [AppComponent],
entryComponents: [],
imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
providers: [
...
HTTP,
...
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
bootstrap: [AppComponent]
})
export class AppModule {}
toast插件同上 命令代码为
ionic cordova plugin add cordova-plugin-x-toast
npm install @ionic-native/toast
import { ToastController } from '@ionic/angular';//这个是代码
新建service文件
ionic g service <目录/文件名>
ionic g service ./providers/commonService //这是我的命令
common.service.ts文件内增加
...
import { HTTP } from '@ionic-native/http/ngx';
import { LoadingController } from '@ionic/angular';//整个是进度遮罩层
import { ToastController } from '@ionic/angular';
...
export class CommonService {
constructor(
...
private toastCtrl: ToastController,
private http: HTTP,
private loadingController: LoadingController,
...
) {
}
...
/**
* 显示toast
* @param data 要显示的内容
* @param time 显示时间 默认2000毫秒
*/
public async TOAST(data: string, time?: number) {
if (typeof (time) == "undefined") {
time = 2000;
}
let toast = await this.toastCtrl.create({
message: data,
duration: time,
position: "middle"
});
toast.present();
}
private async POST(serverUrl: string, uploadData?: any, headers?: any) {
let temParam: any;
if (typeof uploadData === 'object') {
temParam = uploadData;
} else {
temParam = {
json: uploadData,
};
}
const loading = await this.loadingController.create({
message: '请稍后...',
});
await loading.present();
var promise = this.http.post(serverUrl, temParam, headers);
promise.then(data => {
loading.dismiss();
let tmp = JSON.parse(data.data);
if (tmp.msg) {
if (tmp.msg == '证书无效') {
this.TOAST('账户在其他设备登录,请重试');
DataService.accessToken = null;
localStorage.removeItem('accessToken');
this.router.navigateByUrl('/login');
}
}
}).catch(error => {
loading.dismiss();
this.TOAST("网络出错,请检查网络");
});
return promise;
}
/**
* 业务网络请求
* @param business 业务名称
* @param param 需要携带的参数,可为空
* @param loadingFlag 为空时显示进度条遮罩层,不为空不显示
*/
public SEND(business: string, param?: any, loadingFlag?: any, headers?: any) {
if (param) {
param.access_token = DataService.accessToken;
} else {
param = { access_token: DataService.accessToken };
}
if (loadingFlag) {
return this.NO_LOADING_POST(business, param, headers);
} else {
return this.POST(business, param, headers);
}
}
private async NO_LOADING_POST(serverUrl: string, uploadData?: any, headers?: any) {
let temParam: any;
if (typeof uploadData === 'object') {
temParam = uploadData;
} else {
temParam = {
json: uploadData,
};
}
var promise = this.http.post(serverUrl, temParam, headers);
promise.catch(error => {
this.TOAST("网络出错,请检查网络");
});
return promise;
}
...
}
调用方式
在相应ts文件中
...
import { CommonService } from '../../providers/common.service';
...
constructor(
...
private service: CommonService,
...
) { }
...
let body = {
WAGE: this.WAGE,//工资
AGENT: this.AGENT,//经办人
EMP_STATUS: this.EMP_STATUS,//人员状态
RRC: this.RRC,//户口性质
P_STATUS: this.P_STATUS,//个人身份
P_M_STATUS: this.P_M_STATUS,//医疗人员类别
ALTID: this.ALTID//ALTID
}
this.service.SEND(DataService.uplodaAddress, body).then(data => {
let tmp = JSON.parse(data.data);
//do what you want
});
...