In GWT how do I display an image from the appengine server given the string version of the blobstore key

Question

In GWT how do I display an image from the appengine server side blobstore given the string version of the key?

I think I have stored an image as a blob on the appengine. can someone tell me if it's correct?

try 
                            {
                                FileService fileService = FileServiceFactory.getFileService();
                                AppEngineFile file = fileService.createNewBlobFile(content_type, fileName);
                                boolean lock = true;
                                FileWriteChannel writeChannel = fileService.openWriteChannel(file, lock);
                                byte[] b1 = new byte[BUFFER_SIZE];
                                int readBytes1;
                                while ((readBytes1 = is.read(b1)) != -1) 
                                {
                                    writeChannel.write(ByteBuffer.wrap(b1, 0, readBytes1));
                                }

                                writeChannel.closeFinally();
                                item_image_blob_key = fileService.getBlobKey(file).getKeyString();
                            } 
                            catch (Exception e) 
                            {
                                System.out.println(e.getLocalizedMessage());
                                e.printStackTrace(response.getWriter());
                            }

I sent the key back to the client and I am trying to present the image. I tried using :

ImagesService imagesService = ImagesServiceFactory
                .getImagesService();

        // Get the image serving URL
        String imageUrl = imagesService.getServingUrl(blobKey);

but it is deprecated so I tried:

 ImagesService imagesService = ImagesServiceFactory.getImagesService();
              ServingUrlOptions suo = ServingUrlOptions.Builder.withBlobKey(blobKey);
              String image_url = imagesService.getServingUrl(suo);

              item.setProperty("image_url", image_url);

Now I get a URL which looks like this:

http://0.0.0.0:8888/_ah/img/5nXYgHwfiMmblDFldDXSew

and get create an image on the client thus:

String image_url = result.get_image_url();
                    System.out.println("image url is: " + image_url);

                    Image image = new Image();
                    image.setUrl(image_url);

                    RootPanel.get("dynamicDate").add(image);

Only a default image icon appears on the UI

so I created a servlet which accesses the blobstore thus:

import java.io.IOException;

import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;

import com.google.appengine.api.blobstore.BlobKey; import com.google.appengine.api.blobstore.BlobstoreService; import com.google.appengine.api.blobstore.BlobstoreServiceFactory;

public class ImageServlet extends HttpServlet { private static final long serialVersionUID = 1L;

@Override public void doGet(HttpServletRequest req, HttpServletResponse res) throws IOException { String blob_key = req.getParameter("blob-key");

    if (blob_key != null) 
    {
      BlobKey blobKey = new BlobKey(blob_key);
      BlobstoreService blobstoreService = BlobstoreServiceFactory.getBlobstoreService();

      blobstoreService.serve(blobKey, res);
    } 
    else 
    {
      res.sendError(400, "One or more parameters are not set");
    }

} }

and a client http request:

RequestBuilder requestBuilder = new RequestBuilder(RequestBuilder.GET, "/itemmanager/image");

                    try 
                    {
                        Request request = requestBuilder.sendRequest(null, new RequestCallback() {

                        public void onError(Request request, Throwable exception) 
                        {
                           System.out.println(exception.getMessage());
                        }

                        public void onResponseReceived(Request request, Response response) 
                        {
                            System.out.println("so far so good");
                            System.out.println(response.getHeadersAsString());

                          if (200 == response.getStatusCode()) 
                          {

                          } 
                          else 
                          {
                            // Handle the error.  Can get the status text from response.getStatusText()
                          }
                        }       
                          });
                        } catch (RequestException e) {
                          // Couldn't connect to server        
                        }

I seem to be getting text how do i get an input stream or something i can get an image with?

Rubber Duck Rubber Duck · Accepted Answer · 2013-06-28T07:52:32

Finally after two days of scouring Google and stack-overflow and trying I got it!

On the server I got the upload url thus:

 ImagesService imagesService = ImagesServiceFactory.getImagesService();
              ServingUrlOptions suo = ServingUrlOptions.Builder.withBlobKey(blobKey);
              String image_url = imagesService.getServingUrl(suo);

              item.setProperty("image_url", image_url);

The appengine API produced a url which didn't work on the local mode [I think it has to do with sop cross platform issues]

http://0.0.0.0:8888/_ah/img/mR9SOTSEizec4gZYsRnuEw

but it provided a clue: namely the /_ah/img/ part of the String

So I decided to try it and gave this URL to the image "/_ah/img/mR9SOTSEizec4gZYsRnuEw" Here is the client side code.

String imageKey = result.get_image_key();
                    System.out.println("category is: " + result.get_category() + "   image blob key is: " + imageKey);

                    String image_url = result.get_image_url();
                    System.out.println("image url is: " + image_url);

                    //This doesn't work at least locally
                    /*Image image = new Image();
                    image.setUrl(image_url);

                    RootPanel.get("dynamicDate").add(image);*/

                    Image image2 = new Image();
                    image2.setUrl("/_ah/img/" + imageKey);

                    RootPanel.get("dynamicDate").add(image2);

In GWT how do I display an image from the appengine server given the string version of the blobstore key

1 Answers