http - Angular 2 HTTP 服务从 https 切换到 http 方案

Question

我有以下问题:

在我用于从 PHP 脚本检索数据的 Angular 服务中，浏览器或 Angular 从 https 切换到 http。我的网站是通过 HTTPS 和 HTS 加载的，因此 ajax 请求被阻止为混合内容。

我的 ajax 服务有以下代码:

import { Injectable, } from '@angular/core';
import { Http, Response } from '@angular/http';
import 'rxjs/add/operator/map';

@Injectable()
export class AjaxService {
    private apiUrl: string = "https://example.com/myapi/myscript";

    /**
    * @param  {Http} http HTTPService
    */
    constructor(private http: Http) { }

    /**
    * @param  {string} piece 
    */
    public getAllComponents(piece: string) {
        console.debug("Get Components for Query: " + piece);
        return this.http.get(this.apiUrl + "?compontent=" + piece).map((res: Response) => res.json());
    }

    [...]

}

当我从主页 https://example.com/Angular2Application 调用我的页面并发出请求时，我的浏览器告诉我 ajax 请求被混合内容阻止并告诉我他试图连接到 http://example.com/myapi/myscript

Answer 1

只需提供一个没有方案的 url。例如:

private apiUrl: string = "//example.com/myapi/myscript";

您的浏览器将匹配您当前页面的方案，因此您可以避免混合内容问题。