Не удалось загрузить base64 image

при загрузке моей страницы HTML, у меня есть функция onload, написанная в AngularJS, которая получит строку base64 файла изображения с сервера, и я сохранил эту строку base64 в $ scope.product.image. когда я пытаюсь отобразить эту строку base64 , я получаю ERR_INVALID_URL ошибку в консоли.Не удалось загрузить base64 image

Сообщение об ошибке выглядит следующим образом: ПОЛУЧАЕТЕ: данные: изображения/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» и поместить его в адресную строку браузера, чтобы проверить, работает ли URL-адрес данных? – MMhunter

, когда я пытаюсь загрузить значение ng-src (т.е. data-ng-src = "data: image/jpg; base64, ** base64 string value **), говорится, что этот сайт не может быть достигнут. проблема с моей строкой base64. Я написал веб-сервис, где он преобразует изображение с локальной машины (то есть c: \ images) в base64 и отправит его как ответ на angularJS .. В angularJS я присвоил значение ответа $ scope.product.image. Когда я пытаюсь загрузить это значение с помощью ng-src, я получаю эту ошибку. все, что мне не хватает –

Ошибка u get означает, что сам URL-адрес данных неверен.

Поскольку ваш префикс верен, в строке base64 должны быть проблемы.

Попробуйте поместить URL-адрес данных в адресную строку браузера и проверить, работает ли он.

источник

2016-07-14 15:03:42 MMhunter

, когда я пытаюсь загрузить значение ng-src (т. е. data-ng-src = "data: image/jpg; base64, ** base64 string value **), говорится, что этот сайт не может быть достигнут. Есть ли проблемы с моей базой. Я написал веб-сервис, где он преобразует изображение с локальной машины (т.е. c: \ images) в base64 и отправит его как ответ на angularJS .. В angularJS я присвоил значение ответа $ scope.product.image , Когда я пытаюсь загрузить это значение с помощью ng-src, я получаю эту ошибку. ничего не пропало ?? –

Возможно, вам нужно проверить, работает ли base64, сгенерированный в вашем веб-сервисе. Если это правильно, когда вы поместите 'data: image/jpg; base64, base64 string value' в адресную строку браузера, в окне появится изображение. Если то, что в веб-сервисе правильно сгенерировано, возможно, вы должны проверить, совпадает ли это с тем, что вы получаете на стороне клиента (в angularjs). – MMhunter

Я получил такое же значение от webservice. Я проверил это, показав значение $ scope.product.image в html и отображая его правильно. Я написал отдельный код java, используя это значение base64 как входное, декодированное для изображения и записав его в файл изображения, и изображение идет правильно. –

-1

попробуйте использовать как ниже:

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

источник

2016-09-06 09:33:02 envy

данные вызов изображение THRU функции, как это:

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

в контроллере:

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

источник

2016-09-06 11:20:05

ответ

Смежные вопросы