httpClient.get 在模拟器上可以，但在安卓设备上不行答案

【问题标题】：httpClient.get is ok on emulator but not working on android devicehttpClient.get 在模拟器上可以，但在安卓设备上不行
【发布时间】：2020-10-29 05:14:54
【问题描述】：

我在模拟器（离子服务）上测试了我的应用，它运行良好。我的 httpClient.get 很好地返回了来自 mySql 数据库的 json 数据。但是当我发布 apk 并将其安装在我的 android 设备上时，没有显示任何数据，并且我没有成功捕获任何错误。你能告诉我如何解决这个问题吗？

我的 ts 文件：

import { Component} from '@angular/core';
import { Observable } from 'rxjs';
import Place from '../../types';
import { throwError } from 'rxjs';
import { catchError, retry } from 'rxjs/operators';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
@Component({
  selector: 'app-debug',
  templateUrl: './debug.page.html',
  styleUrls: ['./debug.page.scss'],
})
export class DebugPage {
  places: Observable<Place[]>;
  APIPlacesDebug: string;
  error1: string='err1';
  error2: string='err2';
  error0: string='err0';
  constructor(
    private _httpClient: HttpClient
  ) {
    this.APIPlacesDebug  = "http://www.**********.be/v/**/call.php?query=placesDebug";
    this.places = this.getAllPlaces_fullDebug(); 
   }
   getAllPlaces_fullDebug(): Observable<Place[]>{
    return this._httpClient.get<Place[]>(this.APIPlacesDebug+'&full=Y')
    .pipe(catchError(this.handleError));
  }
   private handleError(error: HttpErrorResponse) {
    if (error.error instanceof ErrorEvent) {
      // A client-side or network error occurred. Handle it accordingly.
      console.error('An error occurred:', error.error.message);
      this.error0='1st:';
      this.error1= error.error.message;
    } else {
      // The backend returned an unsuccessful response code.
      // The response body may contain clues as to what went wrong.
      console.error(
        `Backend returned code ${error.status}, ` +
        `body was: ${error.error}`);
        this.error1=error.status+' ';
        this.error2=error.error;
        this.error0='2nd:';
    }
    // Return an observable with a user-facing error message.
    return throwError(
      'Something bad happened; please try again later.');
  }
}

我的html文件：

<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-buttons slot="start">
      <ion-menu-button></ion-menu-button>
    </ion-buttons>
    <ion-title>Debug</ion-title>
  </ion-toolbar>
</ion-header>
<ion-content padding class="form-content" [fullscreen]="true">
    <ion-header collapse="condense">
      <ion-toolbar>
        <ion-title size="large">Debug</ion-title>
      </ion-toolbar>
    </ion-header>
    <ion-item>
      <ion-label color="primary">{{error0}}</ion-label>
    </ion-item>    
    <ion-item>
      <ion-label color="primary">{{error1}}</ion-label>
    </ion-item>
    <ion-item>
      <ion-label color="primary">{{error2}}</ion-label>
    </ion-item>
      <ion-item *ngFor="let place of (places | async)">
        <ion-label color="primary">{{place.name}}</ion-label>
      </ion-item>
</ion-content>

请帮忙:) 文森特

【问题讨论】：

标签： android angular ionic-framework

【解决方案1】：

默认情况下，Android (https) 仅支持安全 URL，您似乎使用的是不安全的 URL (http)。

你可以试试：

将 URL 更改为 https（如果可能）

或

更改 config.xml 以允许不安全的 URL (android:usesCleartextTraffic)，如下所述： https://forum.ionicframework.com/t/err-cleartext-not-permitted-in-debug-app-on-android/164101/12

     <access origin="*" />
      <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application">
        <application android:usesCleartextTraffic="true" />
      </edit-config>

【讨论】：