отображение массива байтов как изображение в угловых js

Question

У меня есть изображение в базе данных. Я хочу вернуть изображение и отобразить его на веб-странице с помощью угловых js. После получения данных у меня есть массив байтов. Как отправить данные на страницу html. У меня проблемы с приведенным ниже кодом. Просьба помочь.
Когда я нажимаю ссылку для просмотра изображения, страница отправляет 2 запроса на сервер вместо одного. Он отправляет запрос непрерывно 2 раза.

Примечание: Я попытался использовать ссылку ниже .. Но это не сработало

AngularJS - Show byte array content as image

Ниже приведен файл мой JS

app.controller('aboutCtrl', function($scope,$http,$location) { 
$scope.message = 'This is Add new order screen'; 
var url = '/Angular/login'; 
    $http.get(url).success(function(result) { 

     $scope.image = result.image; 
    }) 
}); 
//html 
<img data-ng-src="data:image/PNG;base64,{{image}}"> 

файл класса Java

public String getImage() throws FileNotFoundException{ 
    String byteStr=null; 
    try 
    { 
     Connection con= DbConnect.getConnection(); 
     String sql ="select * from image_data where id=1"; 
     PreparedStatement ps=con.prepareStatement(sql); 
     ResultSet rs = ps.executeQuery(); 

     while(rs.next()) 
     { 
      Blob b=rs.getBlob(2); 
      byte barr[]=b.getBytes(1,(int)b.length()); 

      byteStr = new String(barr); 
     } 
    }catch(Exception e){ 
     e.printStackTrace();  
    } 
    return byteStr; 

} 

Код сервлета

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
    // TODO Auto-generated method stub 
    System.out.println("inside get"); 
    JSONObject result= new JSONObject(); 
    Retreive rt = new Retreive(); 
    result.put("image", rt.getImage()); 
    response.setContentType("application/json"); 
    PrintWriter out = response.getWriter(); 
    out.write(result.toString()); 
    out.flush(); 
    out.close(); 

} 

Answer 1

Похоже, что ваш image не является кодировкой base64, но все же этот массив байтов. Вы должны кодироваться его первым, чтобы использовать его как этот <img data-ng-src="data:image/PNG;base64,{{image}}">

Проверьте документацию AngularJS - Show byte array content as image

Вы также можете попробовать этот подход https://gist.github.com/jonleighton/958841