Ajax:Chome扩展:PHP Issueloading图像

时间:2016-06-19 01:38:08

标签: javascript php jquery mysql ajax

我尝试从MySQL服务器中提取图像,并且总是返回错误。我已经尝试了几个小时来找到内容安全策略的工作,但我无法弄清楚这个。现在图像帧被加载但图像不会被设置。这是我的代码。

inputImages.php

<?php
    $server_name = "localhost";
    $my_user = ""; //taken out for stackoverflow question
    $my_passcode = ""; //taken out for stackoverflow question
    $db_name = ""; //taken out for stackoverflow question
    $conn = mysqli_connect($server_name, $my_user, $my_passcode, $db_name);
    if (!$conn)
    {
        die("Could not connect");
    }
    else //Hopefully this runs instead  
    {
        try
        {
            $sql_query = mysqli_query($conn, "SELECT * FROM `adDatabase`");
            while ($row = mysqli_fetch_array($sql_query))
            {
                $id = $row['ID'];
                $img = $row['img'];
                $image = '<img src="data:image/png;base64,'.base64_encode( $row['img'] ).'" style="height: 12em; width: 12em" >';
                echo $image;
            }
        }
        catch(Exception $e)
        {
            echo $e;
        }
    }
?>

带有ajax请求的js文件

window.onload = function()
{
    $.ajax({
        url: '', //taken out for stackoverflow question
        success: function(data)
        {
            $(".latest-ads").html(data);
        }
    });
}

但没有任何加载,我收到此错误

  

jquery.js:5873拒绝加载图片&#39;数据:image / png; base64,iVBORw0KGgoAAAANSUhEUgAAAkAAAAHkCAYAAADW / 5BTAAAYK2lDQ ... FCoBAoBAqBQqAQOFIEarf3kTZcsV0IFAKFQCFQCBQCN0fg // rs0Cqe5CYQAAAAAElFTkSuQmCC&#39;因为它违反了以下内容安全策略指令:&#34; default-src *&#34;。请注意&#39; img-src&#39;没有明确设置,所以&#39; default-src&#39;被用作后备。

我不是在尝试加载脚本。我正在尝试加载图像但图像未呈现或正在读取。

编辑 - 评论中要求的材料 - manifest.json

{
    "manifest_version": 2,
    "name": "Smart Lead Advertisment",
    "version": "1.0",
    "description": "Smart Lead Advertisment, helping you advertise in a more effecient way.",
    "author": "Smart Lead Advertisment",
    "browser_action": {
        "default_popup": "html/popup.html",
        "default_title": "Click here"
    },
    "content_scripts": [
        {
            "matches": ["http://*/", "https://*/", "file:///*/"],
            "js": ["js/jquery.js", "js/bootstrap.min.js", "js/ad-injection.js"]
        }
    ]
}

1 个答案:

答案 0 :(得分:1)

尝试从for (....)返回base64字符串,在php <img>创建success元素,设置$.ajax() src } <img>表示data URI字符串

&#13;
&#13;
base64
&#13;
$(function() {
  // `base64` portion of `data URI` returned from request; e.g., `php`
  var blob = new Blob(["iVBORw0KGgoAAAANSUhEUgAAAH4AAAB2CAYAAAAOcCflAAAABHNCSVQICAgIfAhkiAAAAShJREFUeJzt0UERACAMwLCBf89DBo8mCnrXM7M75NzfAfxhfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR9lfJTxUcZHGR/1AAkJAuo+1B/zAAAAAElFTkSuQmCC"], {
    type: "text/plain"
  });

  $.ajax({
    url: URL.createObjectURL(blob),
    success: function(data) {
      console.log(data);
      // create `data URI`; e.g.; `data:MIME;base64,` concatenate 
      // `base64` string returned from request
      var img = $("<img>", {
        src: "data:image/png;base64," + data
      });
      $("#latest-ads").html(img)
    }
  })
})
&#13;
&#13;
&#13;