No result when sending POST request to Google App Engine through JQuery
I'm trying to send a POST request to my GAE app through JQuery AJAX but I get no response data back. I have a very simple servlet that simply echo the "msg" I pass in. Also overriding doOptions.
@Override
protected void doOptions(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException
{
resp.setHeader("Access-Control-Allow-Origin", "*");
resp.setHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
resp.setHeader("Access-Control-Max-Age", "1728000");
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException
{
resp.setContentType("text/javascript");
resp.setCharacterEncoding("utf-8");
String msg = req.getParameter("msg");
resp.getWriter().print(msg);
}
Here is how I called through JQuery AJAX
var parameters = {msg:"hello"};
$.ajax({
type: 'POST',
url: service_url,
data: parameters,
success: successhandler,
error: errorhandler
})
If I look at my interaction through FireBug, I see this.
First, JQuery sends out an OPTIONS request
Host lessondesigner.appspot.com
User-Agent Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
Accept text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language en-us,en;q=0.5
Accept-Encoding gzip,deflate
Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Aliv开发者_如何转开发e 115
Connection keep-alive
Origin lessondesigner.appspot.com
Access-Control-Request-Me... POST
Access-Control-Allow-Orig... *
Access-Control-Allow-Meth... GET, POST, OPTIONS
Access-Control-Max-Age 1728000
Date Mon, 06 Sep 2010 01:11:56 GMT
Content-Type text/html
Server Google Frontend
Content-Length 0
Next sending out the POST request
Host lessondesigner.appspot.com
User-Agent Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2.8) Gecko/20100722 Firefox/3.6.8
Accept application/json, text/javascript, */*
Accept-Language en-us,en;q=0.5
Accept-Encoding gzip,deflate
Accept-Charset ISO-8859-1,utf-8;q=0.7,*;q=0.7
Keep-Alive 115
Connection keep-alive
Content-Type application/x-www-form-urlencoded; charset=UTF-8
Referer lessondesigner.appspot.com/testAjax.html
Content-Length 21
Origin lessondesigner.appspot.com
Pragma no-cache
Cache-Control no-cache
Content-Type text/javascript; charset=utf-8
Content-Encoding gzip
Date Mon, 06 Sep 2010 01:11:56 GMT
Server Google Frontend
Cache-Control private, x-gzip-ok=""
Content-Length 25
However, I get nothing back in the response! It works fine if I use Curl.
curl -d "msg=hello" lessondesigner.appspot.com/lessondesigner
I get back
"hello"
Does anyone know why this is? Also, why is JQuery doing an OPTIONS request first? It's not even cross domain.
Figured out. It's a Cross-Origin Resource Sharing issue. Here's a great article on it.
http://hacks.mozilla.org/2009/07/cross-site-xmlhttprequest-with-cors/
Basically if a HTTPRequest header contains an "origin" field, the server must reply with a "Access-Control-Allow-Origin" response. In my case, I was doing it in the OPTIONS request but not doing it in the POST request. Therefore firefox was not returning my content data. To fix it, I have to do this.
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException
{
resp.setHeader("Access-Control-Allow-Origin", "*");
resp.setContentType("text/javascript");
resp.setCharacterEncoding("utf-8");
String msg = req.getParameter("msg");
resp.getWriter().print(msg);
}
Try flushing the writer
精彩评论