Ошибка HTTPS в развернутом проекте React

Question

Я пытался разместить свой проект React на GH Pages. Развертывание работало нормально, но когда я пытаюсь найти картинки, я получаю следующую ошибку

http_browser.js:47 Mixed Content: The page at 
'https://pimmesz.github.io/react-giphy/' was loaded over HTTPS, but 
 requested an insecure XMLHttpRequest endpoint 
'http://api.giphy.com/v1/gifs/search? 
q=h&limit=10&rating=g&api_key=MYAPIKEY'. This request has been blocked; the 
content must be served over HTTPS.

Похоже, Giphy API делает http запрос вместо https, Есть ли способ изменить URL-адрес по умолчанию, который использует API?

import React, { Component } from 'react';

import giphy from 'giphy-api';

import Search from './search.jsx';
import Gif from './gif.jsx';
import GifList from './gif_list.jsx';

class App extends Component {
  constructor(props) {
    super(props);

    this.state = {
      gifs: [],
      gif: "xBoysJgwhLEZtAjbY1"
    }
  }

  search = (query) => {
    giphy('APIKEY').search({
      q: query,
      limit: 10,
      rating: 'g'
    }, (err, res) => {
      this.setState({gifs: res.data})
    });
  }

  select = (id) => {
    this.setState({gif: id})
  }


  render() {
    const gifs = this.state.gifs;
    return (
      <div>
        <div className="left-scene">
          <Search search={this.search}/>
          <Gif id={this.state.gif} select={this.select}  />
        </div>
        <div className="right-scene">
          <GifList gifs={gifs} select={this.select} />
        </div>
      </div>
    );
  }
}

export default App;

Answer 1

Изменено выполнение API giphy на

const url = `https://api.giphy.com/v1/gifs/search?q=${query}&limit=10&rating=g&api_key=MY_API_KEY`
      fetch(url)
      .then(results => { return results.json();
      }).then(data => {
        this.setState({gifs: data.data});
      });

РЕДАКТИРОВАТЬ

Нашел другой способ!

Установка https в true может быть сделана как опция в вызове giphy api

giphy({ apiKey: "MY_API_KEY", https: true })