1

我正在编写一个包含 http 请求、jquery 和一些东西的应用程序。当我通过它运行这个应用程序时，ng serve它可以工作，但是当我现在使用它部署它时它不起作用。不得不提的是，该应用程序包括 jquery、jquery-ui、font-awesome 和 bootstrap。

我使用这个命令来构建应用程序：ng build --target=production --base-href '/'

这是我的主要组成部分：

import { Component, OnInit } from '@angular/core';
import { Http, Response } from '@angular/http';

export interface randomResponse {
  author: string;
  id: number;
  quote: string;
  permalink: string;
}

var colors = [
  '#8b0000', '#83ffa4', '#6897bb', '#0099cc', '#3399ff',
  '#ff7f50', '#f0bff4', '#ffab7f', '#fbcf9c', '#f4bfde',
  '#f4d5bf', '#52f8ab', '#f091e7', '#8adcbb', '#16ba78'
];

@Component({
  selector: 'app-random-quote-machine',
  templateUrl: './random-quote-machine.component.html',
  styleUrls: ['./random-quote-machine.component.css']
})
export class RandomQuoteMachineComponent implements OnInit {
  data: randomResponse;
  loading: boolean;

  twitter_link: string;

  constructor(private http: Http) { }

  ngOnInit() {
    this.makeRequest();
  }

  makeRequest(): void {
    this.loading = true;
    this.http.request('http://quotes.stormconsultancy.co.uk/random.json')
    .subscribe((res: Response) => {
      this.data = res.json();
      this.loading = false;

      this.twitter_link = `https://twitter.com/intent/tweet?hashtags=quotes&related=encofreecodecamp&text=${encodeURI(this.data.quote + ' - ' + this.data.author)}`;
      var color = Math.floor(Math.random() * colors.length);
      $('html body').animate({
        backgroundColor: colors[color]
      }, 1000);
      $('.buttons a').animate({
        backgroundColor: colors[color]
      }, 1000);
      $('.buttons button').animate({
        backgroundColor: colors[color]
      }, 1000);
    });
  }
}

如您所见，它没有加载数据：https ://dist-lofgslojpd.now.sh

GitHub项目地址：https ://github.com/mbarra1945/Random-Quote-Machine

4

1 回答 1

0

查看您的控制台，您遇到了问题，因为您的外部 CSS 和 JS 资源的 URL 正在使用http://，但是您的站点正在运行https://（这是一个安全问题）。

您可以通过更改外部资源的绝对 URL 以删除 URL 的协议部分来解决此问题（即，如果http://...，请//...改用 - 删除http:）。这样做会导致浏览器在页面加载时加载资源，否则如果http://页面加载http://，它将加载资源。https://https://

于 2018-05-02T16:40:04.433 回答