离子角http post不工作于设备，但在浏览器上工作良好。
我正在开发一个离子角度的应用程序，post请求在使用离子服务器的浏览器上测试时工作得很好，但是当在anroid设备或仿真器上超出时，请求就不起作用了。
后端是在windows服务器上使用瘦php和xampp的rest。
android设备中对请求的响应是：
Http://<>/ws_login.php/login“，{"headers":{"normalizedNames":{}，"lazyUpdate":null，”
“：{}，”“："status":0，”statusText“：”未知错误“，”url“：”http://<>/ws_login.php/login：“ok:false，"name":"HttpErrorResponse"，”message“：”http://<>/ws_login.php/login:0未知错误的Http失败响应“，”错误“：{”isTrusted“：true}
我的登录代码如下：
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { HttpClientModule, HttpClient, HttpHeaders } from '@angular/common/http';
import { AuthConstants } from '../config/auth-constants';
import { ToastService } from './../services/toast.service';
import { LoadingService } from './../services/loading.service';
import { StorageService } from './../services/storage.service';
import { environment } from '../../environments/environment';
@Component({
selector: 'app-login',
templateUrl: './login.page.html',
styleUrls: ['./login.page.scss'],
})
export class LoginPage implements OnInit {
data = {
user : '',
pass : ''
}
constructor(
public http: HttpClient,
private router: Router,
private toastService: ToastService,
private loadingService: LoadingService,
private storageService: StorageService
) { }
ngOnInit() {
this.storageService.get(AuthConstants.AUTH).then(
data => data?this.router.navigate(["home"]):null
)
}
login() {
var headers = new HttpHeaders();
headers.append("Accept", 'application/json');
headers.append('Content-Type', 'application/json' );
const requestOptions = { headers: headers };
if(this.data.user == "" || this.data.pass == "")
return this.toastService.presentToast("Debe completar ambos campos", "danger");
this.loadingService.showLoading("Iniciando sesión");
console.log(environment.apiUrl+'ws_login.php/login');
this.http.post(environment.apiUrl+'ws_login.php/login', this.data, requestOptions).subscribe(
resp => {
this.loadingService.hideLoading();
if(resp){
if(resp['error'] == 1)
this.toastService.presentToast(resp['mensaje'], "danger");
else{
this.storageService.store(AuthConstants.AUTH, 1);
this.toastService.presentToast("Sesión iniciada con éxito", "success");
this.router.navigate(["home"]);
}
}
else
this.toastService.presentToast("Error de red", "danger");
},
error => {
this.data.user = JSON.stringify(error);
this.loadingService.hideLoading();
this.toastService.presentToast("Error de red", "danger");
}
);/*
console.log(AuthConstants.AUTH);
AuthConstants.AUTH = {id: 1};*/
//this.router.navigate(["home"]);
}
}我还在设备上使用rest应用程序测试api，并且没有问题地使用相同的url答案。
我将android:usesCleartextTraffic=“真”添加到androd显式中，而不是解决方案。
这是我的离子信息
Ionic:
Ionic CLI : 6.3.0 (C:\Users\Manu\AppData\Roaming\npm\node_modules\@ionic\cli)
Ionic Framework : @ionic/angular 5.0.7
@angular-devkit/build-angular : 0.803.26
@angular-devkit/schematics : 8.3.26
@angular/cli : 8.3.26
@ionic/angular-toolkit : 2.2.0
Capacitor:
Capacitor CLI : 2.0.0
@capacitor/core : 2.0.0
Utility:
cordova-res : 0.11.0
native-run : 0.3.0
System:
NodeJS : v12.16.1 (C:\Program Files\nodejs\node.exe)
npm : 6.13.4
OS : Windows 10谢谢!
回答 4
Stack Overflow用户
发布于 2020-04-17 05:43:10
由于错误说明您正在向http://<>/ws_login.php/login投递，所以我猜您的环境变量apiUrl在部署到移动设备时可能出现了错误。如果您在开发人员机器上提供应用程序，则需要environment.ts来获取变量。也许你在生产中为你的手机构建了应用程序，因此没有得到合适的环境变量(因为Ionic然后使用environment.prod.ts？)
Stack Overflow用户
发布于 2020-04-18 04:37:57
显然，角httpClient在本地设备和模拟器上执行时存在一些问题，我的解决方案是将请求迁移到离子本机http。
谢谢你的帮助！
Stack Overflow用户
发布于 2020-09-23 05:15:56
您可以尝试使用移动设备https://ionicframework.com/docs/native/http来尝试离子推进HTTP，但是它不适用于web浏览器--它只在移动设备中工作。因此，您可以尝试将解决方案作为检查平台，并按用户平台返回HTTP服务对象。示例:如果用户platform==web，则返回角HttpClient，如果用户平台==Android/Ios，则返回Advnace对象。
或者您可以直接使用这段代码，它有一个围绕HTTP服务的包装器，
import { Injectable } from '@angular/core';
import { Platform } from '@ionic/angular';
import { HttpClient } from '@angular/common/http';
import { HTTP } from '@ionic-native/http/ngx';
import { from, observable, Observable, of } from 'rxjs';
import { environment } from './../../environments/environment';
import { map, catchError } from 'rxjs/operators';
@Injectable({
providedIn: 'root'
})
export class HttpService {
constructor(private platform: Platform, private httpclient: HttpClient, private http: HTTP) {
}
HttpRequest(method: 'POST'|'GET', url: string, requestBody: any): any
{
url = environment.serverBaseUrl + url;
const headers = {};
if (this.platform.is('ios') || this.platform.is('android') || this.platform.is('mobile'))
{
if (method === 'POST')
{
console.log('Advance_HTTP_POST');
return from(this.http.post(url, requestBody, headers)).pipe(map((data: any) => JSON.parse(data?.data)));
} else if (method === 'GET')
{
console.log('Advance_HTTP_GET');
return from(this.http.get(url, {}, headers)).pipe(map((data: any) => JSON.parse(data?.data)));
}
} else {
if (method === 'POST')
{
console.log('HTTPClient_HTTP_POST');
return this.httpclient.post(url, requestBody, {headers});
} else if (method === 'GET')
{
console.log('HTTPClient_HTTP_GET');
return this.httpclient.get(url, {headers});
}
}
}
}
https://stackoverflow.com/questions/61262309
复制相似问题
腾讯云开发者
