javascript - 使用ajax从API获取图像

标签 javascript php jquery ajax

我的控制台中没有收到任何错误,但我想要得到的只是thumbnail_url,它是 php 文件中的 json。在控制台中显示它是一个数组字符串我如何访问它?

编辑: 我能够执行我想要的输出,但问题是最后一个对象是浏览器中唯一输出的对象。

<?php 
//Set API user and password
$API_USER = 'username';
$API_PASS = 'password';
//Set parameters to make cURL call to Duda
$ch = curl_init();
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
curl_setopt($ch, CURLOPT_URL, 'sampleurl');
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_USERPWD, $API_USER.':'.$API_PASS);
curl_setopt($ch, CURLOPT_HTTPAUTH, CURLAUTH_BASIC);
curl_setopt($ch, CURLOPT_TIMEOUT, 10);
curl_setopt($ch, CURLOPT_HTTPHEADER, array('Content-Type: application/json'));
curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "GET");
//execute cURL call and get template data
$output = curl_exec($ch);
//check for errors in cURL
if(curl_errno($ch)) {
    die('Curl error: ' . curl_error($ch));
}
//echo $output;
print_r($output);
?>

这是我们的 html 和 ajax 请求:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Ajax Preview</title>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>

<script>


  $(function() {
   var $data = $('#content');
   $.ajax({
     method:'GET',
     dataType:'json',
     url:'https://syncslider-ehnoxx07.c9users.io/temp.json',
     success: function (data) {
        $.each(data, function(i,data){
          $data.html('<img src=' + data.thumbnail_url + '>');
      });
    }
  });
});    
    </script>
</head>
<body>
<div id="content"></div>
</body>
</html>

最佳答案

这里出了一些问题,首先你的 javascript 不完整。 Ajax 函数和 jQuery 就绪都没有正确关闭。

$(function() {

var $data = $('#content');
$.ajax({
   type:'GET',
   dataType:'jsonp',
   url:'https://syncslider-ehnoxx07.c9users.io/default-preview-template.php',
   success: function (data) {
   $('#content').html(data)
 });
});

我不是 PHP 方面的专家,也许其他人可以解释一下这部分。但在我看来,代码中缺少 json 响应 header 。

此外,$data 变量从未使用过,您可以将其删除或在成功回调中提供它。

关于javascript - 使用ajax从API获取图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39695618/

相关文章:

javascript - bootstrap 3 自定义滚动固定导航,带淡入淡出效果

javascript - 使用 javascript 将剪贴板中的图像粘贴到 acrobat 表单中

php - ACF 中的转发器字段为空

javascript - 需要 jQuery 内容 slider

jquery - 隐藏的 div 高度(改变我的建议)

javascript - dom 节点上的自定义事件监听器

php - 清理 jsonp 回调的最佳方法?

PHP 在 WordPress 循环中的 DIV 内添加每 2 个项目

php - phpUnit 中的假 $_SERVER 变量

ruby-on-rails - 如何在 Ajax 请求处理期间显示动画图标 - Rails 3