Javascript 无法加载base64映像

加载HTML页面时，我有一个用AngularJS编写的onload函数，它将从服务器获取图像文件的base64字符串，并将此base64字符串存储在$scope.product.image中。当我尝试显示此base64时 字符串，我在控制台中收到错误\u无效\u URL错误

错误消息如下所示：GET:data:image/jpg；base64,9j_4AAQSK。。。。。。。。。。网络：错误\u无效\u 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>

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

    });
};

我试过使用

，但运气不好

---

如何将base64字符串作为映像加载？

您得到的错误意味着数据url本身不正确

因为前缀是正确的，所以您得到的base64字符串中一定有问题

---

尝试将数据url放在浏览器的地址栏中，并检查其是否有效。

尝试按以下方式使用：

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

---

通过如下函数调用图像数据：

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

---

看不到您的代码有任何问题。当我尝试加载ng src值（即data ng src=“data:image/jpg；base64，base64字符串值）时，您是否尝试复制ng src值并将其放入浏览器地址栏以检查数据url是否有效，它表示无法访问此网站。我的base64字符串有问题吗。我编写了一个Web服务，它将从本地计算机（即c:\images）转换图像到base64并将其作为响应发送到angularJS。在angularJS中，我已将响应值分配给$scope.product.image。当我尝试使用ng src加载此值时，我收到此错误。我是否缺少任何内容？当我尝试加载ng src值时（即data ng src=“data:image/jpg；base64，base64字符串值），它说这个网站无法访问。我的base64字符串有问题吗。我编写了一个Web服务，它将一个图像从本地机器（即c:\images）转换为base64，并将其作为响应发送给angularJS。。在angularJS中，我将响应值分配给$scope.product.image。当我尝试使用ng src加载这个值时，我得到了这个错误。我遗漏了什么？也许你应该先检查一下在你的Web服务中生成的base64是否有效。如果是正确的，当你放入

数据时：image/jpg；base64，base64字符串值

在浏览器的地址栏中，窗口中将显示图像。如果webservice中的内容正确生成，也许你应该检查它是否与客户端（angularjs）中的内容相同。我通过在html中显示$scope.product.image值来检查这一点，它显示正确。我编写了一个单独的java代码，将这个base64值作为输入，解码成图像并将其写入一个图像文件中，图像就可以正常显示了。您可以尝试添加一个字符集值吗？如

数据：图像/jpeg；字符集=utf-8；base64、base64字符串值

，或者您确定您的图像是jpeg格式的吗？添加字符集不太可能。我在webservice中将一个jpg映像文件转换为base64。我的转换逻辑如下所示

FileInputStream-imageinfle=newfileinputstream（imageFile）；字节imageData[]=新字节[（int）imageFile.length（）]；imageInFile.read（图像数据）；imageDataString=Base64.encodeBase64URLSafeString（imageData）$scope.getImage = function(data){
    return 'data:image/jpeg;base64,' + data;
}