Odczytywanie odpowiedzi JSON między domenami

Question

 <script> 
     $.ajaxSetup({contentType: 'application/json'}); 
     function submit_data(f){ 
      alert('submitting') 
      var data_string = $(f).serialize(); 
      $.ajax({ 
       url: "http://localhost:3000/application/1/contact_us.json?jsonpcallback=?"+data_string, 
       dataType: "jsonp", 
       type : 'post', 
       processData: false, 
       crossDomain: true, 
       contentType: "application/json", 
       jsonp: false, 
       jsonpcallback: result() 
      }); 
     } 

     function result(){ 
      alert('back in') 
      alert(data) 
     } 
     function jsonp1300279694167(){ 
      alert('dhoom') 
     } 
     </script> 

Mam skrypt powyżej kwerendy w całej domenie i księgowania danych w formularzu.
Wszystko wydaje się działać dobrze. Odpowiedź JSON można zobaczyć w konsoli firebug. Chcę przetwarzać komunikaty o stanie odpowiedzi i wyświetlać odpowiednio do użytkownika. Jak powinienem to osiągnąć?

---

UPDATE

Próbowałem jak sugeruje T.J. Crowder, ale nie mam jeszcze szczęścia. Zmodyfikowany kod jest poniżej

function submit_data(f){ 
    alert('submitting') 
    var data_string = $(f).serialize(); 
    $.ajax({ 
      url: "http://localhost:3000/application/1/contact_us.json?"+data_string, 
      dataType: "jsonp", 
      crossDomain: true, 
      success: handleSuccess() 
     }); 
} 



function handleSuccess(data) { 
    alert("Call completed successfully"); 
    alert(data); 
} 

to nie uzyskuje dostęp data i alarmuje undefined. Jeśli spróbuję przekazać go od success: handleSuccess(), spowoduje to błąd i przekierowanie z żądaniem http.

Otrzymuję odpowiedź z aplikacji Ruby on Rails. Oto metoda jestem uderzanie

def create 
    errors = ContactUsForm.validate_fields(params) 
    logger.info errors.inspect 
    if errors.blank? 
     respond_to do |format| 
     format.json {render :json => {:status => 'success'}.to_json} 
     end 
    else 
     respond_to do |format| 
     format.json {render :json => {:status => 'failure', :errors => errors}.to_json} 
     end 
    end 
    end 

Czy istnieje coś, że muszę skonfigurować w mojej aplikacji szyn

Answer 1

próbowałem wiele tutoriali w tym odpowiedzi powyżej, ale nie miał szczęścia.Więc realizowany jest coś jak poniżej

Formularz

<form action="" onsubmit="submit_data(this, '1'); return false;"> 
    // some form fields 
</form> 

Zatwierdź funkcję postaci

<script> 
    function submit_data(f, app_id){ 
    var data_string = $(f).serialize(); 
    $.ajax({ 
       url: "http://www.example.com/"+app_id+"/contact_us.js?"+data_string, 
       dataType: "jsonp", 
       crossDomain: true, 
      }); 
    } 

    function show_errors(jsonOb) 
    { 
     $("span.error").remove(); 
     $.each(jsonOb, function(key,val){ 
     $("#contact_us_form_"+key).after("<span class=error>"+val+"</span>") 
    }); 
    } 


</script> 

W moim kontroler

def create 
    @application = Application.find params[:application_code] 
    @errors = ContactUsForm.validate_fields(params, @application) 
    @application.save_contact_us_form(params[:contact_us_form]) if @errors.blank? 

    respond_to do |format| 
     format.js #{render :json => {:status => 'success'}.to_json} 
    end 
    end 

I wreszcie w create.js.erb

<% if @errors.blank? %> 
    window.location = "<%= @application.redirect_url %>" 
<% else %> 
    var errors = replaceAll('<%= escape_javascript(@errors.to_json)%>', "&quot;", "'") 
    var errors_json = eval('(' + errors + ')') 
    show_errors(errors_json); 
    function replaceAll(txt, replace, with_this) { 
    return txt.replace(new RegExp(replace, 'g'),with_this); 
    } 
<% end %> 

W ten sposób zadzwoniłem pod numer submit_form na formularzu i wywołałem funkcję javascript z serwera. I działa ... Ale nadal chciałbym mieć komentarze, jeśli to jest najgorsze rozwiązanie?

Answer 2

Jesteś blisko. Po prostu użyć zwrotnego success jak zwykle (widzieć ajax docs) nie szczególna:

$.ajax({ 
    url: "http://localhost:3000/application/1/contact_us.json?jsonpcallback=?"+data_string, 
    dataType: "jsonp", 
    type : 'post', 
    processData: false, 
    crossDomain: true, 
    contentType: "application/json", 
    jsonp: false, 
    success: function(data) { 
     // Use data here 
    } 
}); 

Również kod:

jsonpresponse: result() 

... Czy wezwanie funkcja result i następnie użyj jego wartości zwracanej dla właściwości jsonpresponse wywołania ajax. Jeśli chcesz użyć oddzielnej funkcji, to w porządku, ale nie obejmują (), więc:

$.ajax({ 
    url: "http://localhost:3000/application/1/contact_us.json?jsonpcallback=?"+data_string, 
    dataType: "jsonp", 
    type : 'post', 
    processData: false, 
    crossDomain: true, 
    contentType: "application/json", 
    jsonp: false, 
    success: result 
}); 

function result(data) { 
    // use `data` here 
} 

Również jestem pewien, że nie potrzebują/chcą parametr jsonp jeśli używasz success, więc:

$.ajax({ 
    url: "http://localhost:3000/application/1/contact_us.json?jsonpcallback=?"+data_string, 
    dataType: "jsonp", 
    type : 'post', 
    processData: false, 
    crossDomain: true, 
    contentType: "application/json", 
    success: result 
}); 

function result(data) { 
    // use `data` here 
} 

Wreszcie: Czy jesteś pewnychcesz ustawić contentType? Odnosi się to do zawartości serwera, która jest wysyłana na serwer, a nie do treści odbieranej z niego. Jeśli naprawdę publikujesz dane zakodowane w JSON na serwerze, świetnie, wszystko w porządku; ale wygląda na to, że korzystasz z funkcji jQuery: serialize, która nie wygeneruje JSON (tworzy łańcuch danych zakodowany przez URL). Więc prawdopodobnie chcesz również usunąć contentType, zarówno z połączenia, jak iz połączenia ajaxSetup.

Answer 3

Mam nadzieję, że jeśli można spróbować jQuery-JSONP
jQuery-JSONP How To

[Przykład]

$.getJSON('server-url/Handler.ashx/?Callback=DocumentReadStatus', 
    { 
     userID: vuserID, 
     documentID: vdocumentID 
    }, 
    function(result) { 
     if (result.readStatus == '1') { 
      alert("ACCEPTED"); 
     } 
     else if (result.readStatus == '0') { 
      alert("NOT ACCEPTED"); 
     } 
     else { 
      alert(result.readStatus); 
     } 
    });