1. #1
    Sencha User
    Join Date
    Mar 2013
    Location
    California
    Posts
    26
    Vote Rating
    1
    andjarnic is on a distinguished road

      0  

    Default Ext.Ajax.request with Jersey Rest API

    Ext.Ajax.request with Jersey Rest API


    Hi all,

    I am trying to identify a problem I am having that seems to be related to how the Ext framework makes requests to the server. It could be a server side issue, I am not sure, but it only occurs when using Ext to make an ajax request.

    I have a java/jersey/glassfish server set up on port 8888 (don't ask). I have my Ext-js 4.2 test site on port 80. The following code is used to make the request to my server:

    Code:
    Ext.Ajax.request({
    
                            headers : {
                                'Content-Type':'application/json',
                                'Accept' : 'application/json'
                            },
                            method: "GET",
                            url : "http://localhost:8888/test/v1/users",
                            success : function(response, options) {
                                alert(response.responseText);
                                Ext.Msg.alert("Message", response.responseText);
                                var data = Ext.decode(response.responseText);
                                Ext.Msg.alert("Message", data.msg);
                            },
                            failure : function(response, options) {
                                alert("FAILURE " + response.responseText);
                                var data = Ext.decode(response.responseText);
                                Ext.Msg.alert("Message", data.msg);
                            }
                        });
    When I use my browser to make a request to the URL, it returns a 200OK, and my server code has logging in it and I see that show up just fine. When I use my rest client (2 different ones) both also work fine.

    The problem is when I use the above code to the same URL. On my server side, I get a log trace indicating a JAXB component can't be found. I know JAXB/java are outside the scope of ext-js.. so I am not asking about that.. which is why it *might* be a server problem.

    What I am hoping for, especially from anyone with using ext-js and java/rest (jersey, resteasy, etc), if there is anything special I need to do with ext-js to make a request to a rest API. I would assume this should work fine.

    On the server side, when this request is issued from ext, my code doesn't even execute, which leads me to believe it's not mapping somehow to the right server method, and thus the jersey framework is just responding with a generic error (possibly) that unfortunately doesn't give me enough info to figure out what the problem may be. But I assume thus far, that for whatever reason the call from ext-js is not mapping correctly to the rest api path.

    Thank you for any ideas/help.

  2. #2
    Sencha Premium Member
    Join Date
    Dec 2007
    Posts
    38
    Vote Rating
    2
    babsjr77 is on a distinguished road

      0  

    Default


    Try setting com.sun.jersey.config.feature.Trace to true in your jersey servlet or filter configuration. It sets a bunch of debug HTTP response headers. Take a look at the HTTP headers the ExtJS request sends vs your other methods. I'm using Jersey with Ext.Ajax.request and do not add any additional headers. I also suggest removing "http://localhost:8888" in your URL and go with only "/test/v1/users". My typical jersey resource looks like:

    Code:
    @GET()
    @Produces({"application/json"})
    public Object foo() {
       return myFooObject;
    }
    Code:
    Ext.Ajax.request({
       method : 'GET',
       url : '/api/foo',
       callback : function() { }
    });

  3. #3
    Sencha User
    Join Date
    Mar 2013
    Location
    California
    Posts
    26
    Vote Rating
    1
    andjarnic is on a distinguished road

      0  

    Default


    Thank you for the reply..I'll try that.

    I thought of removing the localhost:8888 but the problem is.. my apache is port 80 where extjs is hosted at.. and glassfish with my rest web app is port 8888. How do I get the extjs to make a call to a diff port if I don't provide it? I am not an apache expert to be fair.. maybe there is a way to configure it to forward all calls to 8888?

  4. #4
    Sencha - Community Support Team hendricd's Avatar
    Join Date
    Aug 2007
    Location
    Long Island, NY USA
    Posts
    5,962
    Vote Rating
    10
    hendricd will become famous soon enough hendricd will become famous soon enough

      0  

    Default


    8888 vs 80 breaks the same-origin-policy rules, which would generally yield an OPTIONS pre-flight request that Jersey doesn't like much
    "be dom-ready..."
    Doug Hendricks

    Maintaining ux: ManagedIFrame, MIF2 (FAQ, Wiki), ux.Media/Flash, AudioEvents, ux.Chart[Fusion,OFC,amChart], ext-basex.js/$JIT, Documentation Site.


    Got Sencha licensing questions? Find out more here.


  5. #5
    Sencha User
    Join Date
    Mar 2013
    Location
    California
    Posts
    26
    Vote Rating
    1
    andjarnic is on a distinguished road

      0  

    Default


    Thanks for the heads up..I turned on jersey logging, and sure enough I see the incoming request now. Get this.. it's method is OPTIONS and it adds a _dc query param on the end of it. I've no idea why that is... I specifically set the request to GET method.. so any idea why it would change to OPTIONS and why a query param is added?

  6. #6
    Sencha User
    Join Date
    Mar 2013
    Location
    California
    Posts
    26
    Vote Rating
    1
    andjarnic is on a distinguished road

      0  

    Default


    Ok..I think I found some info on this now.. apparently you were correct in the removal of the http://localhost:8888... when using http:// firefox assumes a cross-domain request and changes the method to options (or extjs does.. not sure if one or both do).

    So now the problem is.. and possibly I will post a different thread topic on this.. how does one build a web interface with extjs that makes calls to a server component for ajax that resides at a different port (same domain)?

    Alright.. to finish this off.. I ended up putting my index.html, extjs, etc inside my JEE web app, but because of the way JEE apps deploy (with a context path), I had to use index.jsp and use a request parameter to properly match the path to the extjs, css and my app.js files. Now, it works. My rest call works as well. Glad it's working, just not easy to figure out..but thank you for pointing out the jersey logging option.. I've never used it (or had to) up until now.

  7. #7
    Sencha User
    Join Date
    Jun 2012
    Location
    Virginia, USA
    Posts
    40
    Vote Rating
    1
    rtirbany is on a distinguished road

      0  

    Default


    hi, might be a little late to this, but wanted to let you know that we've been using RESTEasy/Spring and ExtJS4.2 on tomcat without any of these issues. The web services all run under their own port, as does the Ext application, and both are on the same box. I'm about to move ExtJS over to an Apache server, but after reading your post I may be thinking twice.. If you're still interested in getting this to work as you'd initially set out to, I may be able to help and would be glad to go into more detail.

  8. #8
    Sencha User
    Join Date
    Mar 2013
    Location
    California
    Posts
    26
    Vote Rating
    1
    andjarnic is on a distinguished road

      0  

    Default


    Are you saying that you run your extjs app on one port (like 8080 or 80) and a separate web-app on another port, and you call the web-app from the extjs app with port info in the url and it works?

  9. #9
    Sencha User
    Join Date
    Jun 2012
    Location
    Virginia, USA
    Posts
    40
    Vote Rating
    1
    rtirbany is on a distinguished road

      0  

    Default


    Hi, sorry we had a deadline to meet and of course changing requirements.
    Yes this is what I'm referring to though after looking into it further and discussing w/ the other guys on the team I confirmed this isn't what we're doing after all. I still think it may be possible though if you set up Apache w/ rewrite rules and possibly alias and/or virtual hosts/ip (as long as you're not using a 301 /redirect) and making the requests as if they were hosted together.
    As long as you weren't 301/redirecting, ExtJS wouldn't have any knowledge of what's taking place within Apache.