无法同时加载我的HTML页面加载的base64图像

，我有一个onload函数写在AngularJS这将让来自服务器的图像文件的一个base64字符串，我存储在$ scope.product.image这个字符串的base64。当我尝试显示此base64 字符串时，我在控制台中收到ERR_INVALID_URL错误。无法同时加载我的HTML页面加载的base64图像

错误消息是这样的：GET：数据：图像/ JPG; base64,9j_4AAQSK ..........网：ERR_INVALID_URL

我的HTML看起来像这样

<section ng-show="product.image"> 
      {{product.image}} /* This actually displays the content of base64 string. This confirms that value is reaching properly*/ 
      <img ng-src="{{'data:image/jpg;base64,'+product.image}}"/> 
</section>

我app.js看起来像这样

$scope.onload = function() 
{ 
    $http({method:'GET', url:'rest/product/onLoad'}) 
    .success(function (response){ 
     $scope.product.image = response.image; 

    }); 
};

我<img data-ng-src="data:image/jpg;base64,{{product.image}}">但没有运气尝试。

如何加载一个base64字符串作为形象？

来源

2016-07-14 arun kumar

无法看到你的代码的任何问题。你有没有尝试复制'ng-src'值并将其放入浏览器地址栏中以检查数据网址是否有效？ – MMhunter

当我尝试加载ng-src值（即data-ng-src =“data：image/jpg; base64，** base64字符串值**）时，它表明无法访问此网站。问题与我的base64字符串我写了一个web服务，它将从本地机器（即c：\ images）将图像转换为base64，并将其作为对angularJS的响应发送。在angularJS中，我已将响应值$ scope.product.image。当我用NG-SRC加载这个值，我得到这个错误。什么我错过？ –

u得到错误意味着数据URL本身是不对的。

由于您的前缀是正确的，必须有以base64字符串所得到的问题。

尽量把传输数据的URL在浏览器的地址栏，并检查其是否工作正常。

来源

2016-07-14 15:03:42 MMhunter

当我尝试加载NG-SRC值（即数据-NG-SRC =“data：image/jpg; base64，** base64字符串值**），它表示无法到达此网站。我的base64字符串有问题吗？我写了一个web服务，它将图像从本地机器（即c：\ images）转换为base64，并将其作为对angularJS的响应发送。在angularJS中，我已将响应值分配给$ scope.product.image 。当我尝试使用ng-src加载这个值时，我得到这个错误。我错过了什么？ –

也许你应该检查你的webservice中生成的base64是否先运行。如果它是正确的，当你在浏览器的地址栏中输入'data：image/jpg; base64，base64 string value'时，窗口中会出现图像。如果webservice中的内容正确生成了，也许你应该检查它是否与你在客户端获得的内容相同（在angularjs中）。 – MMhunter

我从webservice收到相同的值。我通过在html中显示$ scope.product.image值来检查它，它显示正确。我写了一个单独的java代码，以此base64值作为输入，解码为图像并将其写入图像文件，并且图像正常显示。 –

-1

尝试使用为以下：

ng-src="data:image/jpg;base64,{{product.image}}"

来源

2016-09-06 09:33:02 envy

来电图像数据通这样的函数：

<img data-ng-src="{{getImage(product.image)}}" />

在控制器

：

$scope.getImage = function(data){ 
    return 'data:image/jpeg;base64,' + data; 
}

来源

2016-09-06 11:20:05

无法同时加载我的HTML页面加载的base64图像

回答

相关问题