Tuesday, September 13, 2016

Re: construct image from Serverside to client side in GWT

Hi Ramanan,

Few months ago I had to view different pictures within a popup widget, wich are taken from the server side.
Here is a resume about how I made it (but I am not sure the solution is very secure) :

imagePopup = new Image();
popup = new PopupPanel();
popup.setWidget(imagePopup);

.....

I discard details about the functionnality with selecting a particular row into a grid, going from the view side to the presenter side of the MVP model used with events, etc), but regarding the following line, the picture is automatically retrieved and vie<ed through the browser :
.....


imagePopup.setUrl(GWT.getHostPageBaseURL() + "photos/photo1.jpg"); // server side, from root directory of the web site, pictures are putted into a photos subdirectory

=> when you reset the url with another picture file, rerefresh of the picture occurs.
=> some people could be right by saying that pictures are not secured but perhaps it could help you

Regards,

Eddy

Le vendredi 17 juin 2016 12:08:38 UTC+2, Ramanan Nathamuni a écrit :
Hello all,

my requirement is an image getting from server to GWT client.

from the client side, I send a message through AsyncCallBack method and the server response Serializable byte[] object. when getting this object,  I am parsing as String object. but the image could get.

the steps i followed

1.client side  Asynccallback method is

CommandMessage msg = new CommandMessage(itemId, "get-image-data");

cmain.ivClient.execute(msg, new AsyncCallback<ResponseMessage>() {

                @Override
                public void onFailure(Throwable caught) {
                    //add(new Label("Problem in Getting Map"));

                }

                @Override
                public void onSuccess(ResponseMessage result) { 
                 
                        here I am getting result.data is "data:india/png;base64,parsedString"     
               
                        Image image = new Image(result.data.toString());

                        canvas.add(image);                        //but I could not getting Image
                 
                }
            });



2. parsing the byte[] object from serverside

@Override
    public cti.gwtdemo.client.rpc.ResponseMessage execute(cti.gwtdemo.client.rpc.CommandMessage commandMessage) throws Exception {
        cti.item_system.CommandMessage cmdMsg = CVT(commandMessage);
        cti.gwtdemo.client.rpc.ResponseMessage rsMsg = CVT(getItemService().execute(cmdMsg));
        byte[] bytes = (byte[]) rsMsg.data;
        String base64 = com.google.gwt.user.server.Base64Utils.toBase64(bytes);
//here converting process
        String[] s = rsMsg.args[0].split(" ");
        s[0] = s[0].replace(".", "/");               // the string s[0] contains image name with type ie india.png and i replaced as india/png
        rsMsg.data="data:"+s[0]+";base64,"+base64;                                      //"data:images/png;base64," + base64; ---------------------> Actually I stuck here.  ( As per mentioned in   http://gurselkoca.blogspot.in/2010/12/construction-of-gwt-image-from-byte.html )
      
       (in rsMsg.data now contains ......... "data:india/png;base64, parsedString")
      
         return rsMsg;
    }

 protected cti.item_system.CommandMessage CVT(cti.gwtdemo.client.rpc.CommandMessage cm) {

        return new cti.item_system.CommandMessage(cm.itemId, cm.command, cm.args, cm.data);   //Server Side data
    }

    protected cti.gwtdemo.client.rpc.ResponseMessage CVT(cti.item_system.ResponseMessage rm) {

        return new cti.gwtdemo.client.rpc.ResponseMessage(rm.command, rm.itemId, rm.result, rm.args, rm.data); //after getting data it set to client side
    }

please Help me, and  what stands for "data:images/png;base64," + base64;

Thanks in Advance
Ramanan

--
You received this message because you are subscribed to the Google Groups "GWT Users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at https://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.

No comments:

Post a Comment