jquery - 无法调用GIPHY API

我有一个文本框和一个搜索按钮。根据用户输入，我想查询Giphy api来获取匹配的Gif。但是我的ajax调用总是出错。
有谁能够帮助我，

 $('#button2').click(function() {
   var srchParam = $('#srcCriteria').val();

   $.ajax({
    url: "http://api.giphy.com/v1/gifs/search?q=dog&api_key=dc6zaTOxFJmzC",
    type: "GET",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(response) {
   alert("hello");
    //console.log(response.data[0].bitly_url);
   },
  error: function(xhr, status, error) {
     alert("bye");
   }
 });
});

这是jsfiddle链接：https://jsfiddle.net/Appy169/faedybhf/12/

最佳答案

问题出在jsfiddle上的url上。如果您检查控制台，则会看到以下消息：


阻止加载混合的活动内容“ http://api.giphy.com/v1/gifs/search?q=test&api_key=dc6zaTOxFJmzC”


这是什么意思？这意味着您正在从http调用https。

仅用于测试，您可以将URL更改为//api.giphy.com/v1/gifs/search?q=" + $('#srcCriteria').val() + "&api_key=dc6zaTOxFJmzC

您会看到它有效。

更新了工作JSFIDDLE。

关于jquery - 无法调用GIPHY API，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42575181/