Alright, I'm new to Backbone.js, and am just trying to get a simple collection fetch working.
On the server side, I'm sending the following JSON I've verified that this comes down in the response body:
[{"id":1,"user_id":1,"last_name":"Smith","first_name":"Bob","date_of_birth":"1980-01-06T05:00:00Z","created_at":"2013-04-26T00:50:00Z","updated_at":"2013-04-26T00:50:00Z"},{"id":2,"user_id":1,"last_name":"Smith","first_name":"Roger","date_of_birth":"1985-01-01T05:00:00Z","created_at":"2013-04-27T04:00:00Z","updated_at":"2013-04-27T04:00:00Z"}]
This passes JSONLint
I've got my server running at localhost:8080 in a Jetty (Scala/Scalatra), and my client side stuff being served out of nginx running at localhost:8083. I think I've got CORS support working correctly. In any case, I'm getting a 200 response along with my JSON.
The Request looks like this (Opera dev console):
GET /api/persons HTTP/1.1
User-Agent: Opera/9.80 (X11; Linux x86_64) Presto/2.12.388 Version/12.15
Host: localhost:8080
Accept-Language: en-US,en;q=0.9
Accept-Encoding: gzip, deflate
Referer: http://localhost:8083/
Connection: Keep-Alive
Accept: */*
X-Requested-With: XMLHttpRequest
Origin: http://localhost:8083
The Headers in the response are:
HTTP/1.1 200 OK
Access-Control-Allow-Origin: http://localhost:8083
Access-Control-Allow-Credentials: true
Content-Type: application/json;charset=UTF-8
Server: Jetty(8.1.8.v20121106)
This was tripping my fetch's error callback. So, next I wrote a regular jquery $.getJSON(), then the same req in $.ajax form. No luck.
I finally added some checks in an $.ajaxSetup (oh, coffeescript, btw):
$.ajaxSetup
error: (jqXHR, exception) ->
if jqXHR.status == 0
alert('Not connect.
Verify Network.')
else if jqXHR.status == 404
alert('Requested page not found. [404]')
else if jqXHR.status == 500
alert('Internal Server Error [500].')
else if exception == 'parsererror'
alert('Requested JSON parse failed.')
else if exception == 'timeout'
alert('Time out error.')
else if exception == 'abort'
alert('Ajax request aborted.')
else
alert('Uncaught Error.
' + jqXHR.responseText)
The 'parsererror' is being triggered. So, huh. I'm missing something obvious, I know it.
You should make sure that the CORS is activated on jQuery too by using the xhrField.withCredentials
setting.