CODEWITHSUNDEEP
backbone.jsfetch
miro
miro

Reputation: 809

error fetching backbone model (works in chrome but not in firefox and ie9)

I have one service that returns proper data in chrome but ends in error for firefox and ie9. It looks like the GET returns 200 OK code, but still ends in error callback. I'm fetching data via backbonejs (with jquery.getJson and with ajax I'm getting the same result). The same result I'm getting also if I try to fetch data from remote server or locally.

Chrome: Version 23.0.1271.64 m FF: 16.0.2 IE9: 9.0.8112.16421

wcf:

[OperationContract]
[WebInvoke(Method = "GET", UriTemplate = "/getData/{name}", BodyStyle = WebMessageBodyStyle.Wrapped, ResponseFormat = WebMessageFormat.Json)]
List<Names> getData(string name);

serviceUrl:

"http://serverABC:4000/myService.svc/getData/test"

fetching from javascript: via backbone or jqueryGetJson():

$.getJSON("http://serverABC:4000/myService.svc/getData/test", function () {
      alert("success");
  })
  .success(function () { alert("second success"); })
  .error(function (result) {
      console.log('error:', result);
   })

result: "http://serverABC:4000/myService.svc/getData/test 200 OK 70ms"

headers:

Response Headers
Cache-Control   private
Content-Length  6544
Content-Type    application/json; charset=utf-8
Date    Fri, 16 Nov 2012 14:09:46 GMT
Server  Microsoft-IIS/7.5
Set-Cookie  ASP.NET_SessionId=s3aguluzip0dw135glbxlwwf; path=/; HttpOnly
X-AspNet-Version    4.0.30319
X-Powered-By    ASP.NET
Request Headers
Accept  application/json, text/javascript, */*; q=0.01
Accept-Encoding gzip, deflate
Accept-Language en-US,en;q=0.5
Connection  keep-alive
Host    svgwbip93:4000
Origin  http://localhost:51280
Referer http://localhost:51280/Default.aspx?ReturnUrl=%2f
User-Agent  Mozilla/5.0 (Windows NT 6.1; WOW64; rv:16.0) Gecko/20100101 Firefox/16.0

result from debug:

readyState 0
responseText ""
status 0
**statusText "error"**
abort function()
always function()
complete function()
done function()
error function()
fail function()
getAllResponseHeaders function()
getResponseHeader function()
overrideMimeType function()
pipe function()
progress function()
promise function()
setRequestHeader function()
state function()
statusCode function()
success function()
then function()
toString function()

Response: - is empty (this is most probably the problem (but as I mentioned in Chrome I'm getting correct json data)

EDIT 1: I tried to get raw response with fiddler and I'm getting the JSON. The big question is that why callback falls to error. Here is my raw response:

HTTP/1.1 200 OK
Cache-Control: private
Content-Length: 29
Content-Type: application/json; charset=utf-8
Server: Microsoft-IIS/7.5
Set-Cookie: ASP.NET_SessionId=kuv3g0r2dgmu5bpaoayj5lic; path=/; HttpOnly
X-AspNet-Version: 4.0.30319
X-Powered-By: ASP.NET
Date: Fri, 16 Nov 2012 19:32:58 GMT

{"PlatformDrawingsResult":[]}

I verified the json - it seems OK, so what can be the problem....hmm. I forgot to mention that I'm using also requirejs (not sure if that will bring some light,..)

Cheers, Miro

Upvotes: 4

Views: 1894

Answers (1)

miro
miro

Reputation: 809

The solution is (thanks to jwkeenan) :

I put this line at the beggining of each method in my web service and now all browsers work.

HttpContext.Current.Response.AddHeader("Access-Control-Allow-Origin", "*");

and to get it to work in ie9 I needed to add this to my web app:

$.support.cors = true;

Upvotes: 3

Related Questions