Android 如何从https网站获取http内容？

当我从安全url请求时，我得到“0未知错误的Http失败响应”

我正在尝试测试我的ionic/angular移动应用程序。当我尝试http请求时，Android 9出现了问题，但Android 7运行良好。无论如何，我需要将我的后端设置为公共https服务器。所以现在我正在测试https请求，7和9个Android版本都不起作用

我用的是Angular 7

"@ionic/angular": "^4.6.1",
"@ionic-native/core": "^5.0.0",
"rxjs": "~6.5.1"

为了使问题更简单，我做了这些小函数

在我的html文件中，我有以下代码：

myFile.html

  <ion-button
          (click)="onStartTest()"
  >Click me</ion-button>
  <p id="testme"></p>

myTask.service.ts

  onTest() {
    return this.http.get('https://www.google.com').pipe(
      catchError(err => {
        return throwError(err);
      })
    );
  }

起初，我尝试了服务器的URL，但我将其更改为“”，只是为了验证后端是否正确

我还有一个interceptors.ts文件，我正在使用它进行身份验证，但是当我执行onStartTest（）函数时，我没有登录，但我将重新共享它

拦截器

import {Injectable} from '@angular/core';
import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
import {Observable} from 'rxjs';

@Injectable()
export class TokenInterceptor implements HttpInterceptor {


  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const token = localStorage.getItem('auth_token');
    let newHeaders = req.headers;

    if (token) {
      console.log(token);
      newHeaders = newHeaders.set('Authorization', 'Token ' + token);
      const modified = req.clone({
        headers: newHeaders
      });
      return next.handle(modified);
    } else {
      newHeaders = newHeaders.set('Content-Type', 'application/json');
      const modified = req.clone({
        headers: newHeaders
      });
      return next.handle(modified);
    }
  }
}

从'@angular/core'导入{Injectable}；
从'@angular/common/http'导入{HttpEvent，HttpHandler，HttpInterceptor，HttpRequest}；
从“rxjs”导入{Observable}；
@可注射（）
导出类TokenInterceptor实现HttpInterceptor{
截取（请求：HttpRequest

我还知道有一个“add_header”指令（nginx）在响应代码为20x或30x时添加了“Allow access control origin”（允许访问控制源代码）。根据我与Postman的截图，google的响应状态为200，但我的应用程序仍然收到状态0错误

忽略第一个错误。这是我在应用程序启动时与http一起使用的函数。现在我正在测试https



我表面上试图使用ionic本机库HTTP，但我的应用程序完全崩溃了

我还执行了命令--ssl

，但仍然没有执行任何操作

我在某个地方读到，为了安全连接，我需要一个证书，但我知道这是服务器的工作

我试着从Vanilla JavaScript向Dark Sky发出请求，但效果很好。所以角度/离子方面有问题，而不是服务器方面

我错过了什么？我真的需要尽快解决这个问题！

---

我想向https url发送一个安全请求并获得相应的响应。

您的主要问题是，您正在尝试向一个不安全的调用（http）位置（

http://192....../mobile/tasks)

来自安全来源（

https://localhost:8100

）

您的错误消息中明确指出了这一点，这是不允许的，并且已被取消

您的第二个问题是，出于测试目的，您正在尝试从您的网站调用第三方

https

ressource。这仅在第三方ressource实现CORS时有效，而Google和api.darksky.net则不是这样。使用Postman发送GET请求是无用的，因为Postman在di之前不会检查CORS头显示响应。如果要使用邮递员检查CORS，请向这些资源发送选项请求，您将看到没有CORS标头，因此答案在

出于安全原因，浏览器限制跨源HTTP请求 从脚本启动。例如，XMLHttpRequest和FetchAPI 遵循同源策略。这意味着使用 这些API只能从同一来源请求资源 应用程序是从加载的，除非来自其他来源的响应 包括右CORS标题

这意味着我使用的后端需要更多的配置，因为我使用的是“同源”策略脚本。我认为我们有了它，因为当我们尝试从浏览器控制台获取请求时，它工作正常，但在移动设备上没有。我们有一个自定义的CORS配置，但我们将其更改为

django CORS Header

我们切换到

django-cors-headers

I可以正确地从HTTP和HTTPs请求获得响应。

---

其他答案和评论对于关注正确的方向非常有用。

Google不响应CORS请求我想说我考虑过这一点，这就是为什么我用Postman测试它。Postman获得200状态。无论如何，我会尝试使用另一个URL，但我认为这不是问题，因为当我使用服务器上的URL时，我有完全相同的错误。我使用了来自dark sky的url，仍然是相同的错误，即https：因为此api也没有实现CORS。阅读CORS，有很多与此相关的问题。这与https无关。发送和选项请求邮递员检查。如果您的问题是“为什么我不能请求http内容？”我是一个https网站，出于安全原因。您的错误消息清楚地表明了这一点。我知道第一个错误。但现在我正在测试https功能，第二个错误。第三方https的优点，我不知道。但我仍然不完全理解我可以为CORS做些什么。我阅读了MDN文章，并阅读了IONAL for CORS too很多次。大多数答案都是说这是服务器的问题，服务器需要添加“访问控制允许来源”标题。我将尝试看看还能找到什么。如果我找不到任何东西，我将返回帖子。如果我找到了，我将标记这个答案。我还想问，为什么当我尝试使用香草JavaScript时，这个第三方api没有出现CORS错误？这像邮递员吗？不检查CORS标题？只有在您拥有API，否则您需要设置代理。纯JS也会出现同样的错误。按此页面上的f12并将其粘贴到控制台中以验证：

fetch（'https://api.darksky.net/forecast/b66bc3384e22439cafb91f9124f7c5e0/32.000，%2035.000'）。然后（resp=>console.log（resp））

CORS策略已阻止从源“”获取“”的访问：请求的资源上不存在“Access Control Allow origin”标头。如果不透明响应满足您的需要，请将请求的模式设置为“No CORS”，以获取禁用CORS的资源。完全正确。

import {Injectable} from '@angular/core';
import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
import {Observable} from 'rxjs';

@Injectable()
export class TokenInterceptor implements HttpInterceptor {


  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const token = localStorage.getItem('auth_token');
    let newHeaders = req.headers;

    if (token) {
      console.log(token);
      newHeaders = newHeaders.set('Authorization', 'Token ' + token);
      const modified = req.clone({
        headers: newHeaders
      });
      return next.handle(modified);
    } else {
      newHeaders = newHeaders.set('Content-Type', 'application/json');
      const modified = req.clone({
        headers: newHeaders
      });
      return next.handle(modified);
    }
  }
}