Implements CORS using Backbone.js and Rails3

I encountered "406 Not Aceeptable" issue when my Backbone.js application fetch models in json from Rail server using CORS. Because this is a CORS call, I always doubt if something is wrong in my CORS headers, but it is Rails who causes the problem, because it tries to handle the request as HTML, see the log:

Started GET "/components/1" for 127.0.0.1 at 2012-05-14 07:48:08 -0700
Processing by ComponentsController#show as HTML
  Parameters: {"id"=>"1"}
Completed 406 Not Acceptable in 1424ms (ActiveRecord: 1283.8ms)

The reason why I got this error is that my application is supposed to accept and respond JSON only. So my controller only responds a JSON result.

  def show
    set_access_control_headers
    @components = ComponentModel.today_component_status(params[:id]).first
    respond_to do |format|
      format.json { 
        render :json => @components 
      } 
    end
  end 

This page is very helpful on stackoverflow: http://stackoverflow.com/questions/9241045/backbone-client-with-a-remote-rails-server