× 說心事 政治時事 生活 運動 汽車 機車 自行車 相機 科技 理財 旅遊美食 娛樂 健康 美麗時尚 人際關係 文學故事 關於《思書》
吃喝玩樂 關於《思書》


Rails 如何簡單回應 AJAX? 就用 json 啊


紅寶鐵軌客
來關注...
關注:紅寶鐵軌客
關注有什麼好處?:當作者有新文章發佈時,「思書日報」就會匯總自動通知您,讓您更容易與作者互動。
x
紅寶鐵軌客
Rails 使用中,折磨中,享受中......
Victorian vintage round cut ruby engagement ring in 14k yellow gold 7mm center vs g h 984
    很久以前就是個「寫程式的」,其實,什麼程式都不熟⋯⋯
     
    就,這會一點點,那會一點點⋯⋯
作者最新發佈的文章:
  • Rails 如何檢查 URL 是否存在?
  • Rails 為什麼要使用 escape_javascript?
  • Rails 使用 Javascript Ajax 很簡單
作者最近參與的討論:
  • Rails 常見資安陷阱與解決方法
現在就加入《思書》,你就可以關注本作者了!
《思書》是一個每個人的寫作與論壇平台,特有的隱私管理,讓你寫作不再受限,討論更深入真實,而且免費。 趕快來試試!
還未加入《思書》? 現在就登錄! 已經加入《思書》── 登入
Rails 使用中,折磨中,享受中......
2018/03/26
30   0  


在 AJAX 呼叫 Rails 的 Controller 後,我想最重要的就是知道 server 這邊處理的結果,一般我們都會用一個與 controller 同名的 view.js 去自動執行,一般都是 refresh 網頁啊,或是跳到另一個網址等等。

但有沒有更簡單的方法啊,我是這樣用的,直接上 code,少囉唆:

AJAX side:

// set the params
var id = $('#name').attr('data-name');
var a = JSON.stringify( Array );
$.ajax({
  type: "patch",
  url: "/controller_name/action/",
  data: { id: id, array: array },
  dataType: "json", /* 重點一 */
  error: function (jqXHR, textStatus, errorThrown) {
  // server 回應有問題.... 重點二
  whatever_fail();
  },
  success: function(data, textStatus, jqXHR) {
    // server 回應正常,再來看看處理的結果
  if (data.success != "true") { /* 重點三 */
// server 回應正常,下一步?
  whatever_success();
};
  }
});

Server side:

def action
  # 你的程式碼,重點四,用個變數來記錄結果,這裡是用 error 字串
  # return with json, 使用 data, 你可以用這傳回任何值
respond_to do |format|
if error.blank? # 重點五
format.js { render status: 200, json: {success: true, status: "ok", data: "ok" } }
else
format.js { render status: 200, json: {success: false, status: "fail", data: error } }
end
end
end

重點說明:

  • 重點一:AJAX 要指定回應的資料要以 json 的方式處理,所以 dataType: "json",
  • 重點二:AJAX 收到錯誤是指 server side 回應錯誤,一般是指認證不對啦,不處理啦,斷線啦,你也可以人工製造錯誤,在重點五中,把 status: 200 改成 4xx,5xx 等等,我不確定到底是一定要 200 還是二字頭都會被當成成功,但是不是二字頭是一定會被認回是錯誤的,用 status 碼來做結果判斷我不喜歡,應為在瀏覽器上,如果使用者打開發展工具,是會在 console 上看到錯誤回應的,當然,誰沒事會開發展工具,也對啦,所以是“我不喜歡。”
  • 重點三:就用 json 傳回來的值來當結果,這就可以用來判斷下一步了,發展工具上也不會顯示錯誤, json 也可以傳回來幾乎任何值,所以就很簡單方便好用,在這個例子中,我是使用 data.success 來傳結果,你可以用任何變數名啦,可以看重點五的指定方式。
  • 重點四:就在你程式中用個變數來記錄錯誤,這是我覺得最簡單的方法。
  • 重點五:這就是寫入 json 的方式,夠簡單吧,json: {success: false, status: "fail", data: error },這裡是說:data.success = false,data.status = "fail" 以及 data.data = error 字串。

AJAX 很好用,也方便,但是使用時,要盡量不要呼叫一大堆,畢竟,每一次呼叫都要重啟連線,雖然 AJAX 很快了,但是如果能整合成一個,會方便開發,提高性能,更可以少用很多的 call back。

關於作者
很久以前就是個「寫程式的」,其實,什麼程式都不熟⋯⋯
 
就,這會一點點,那會一點點⋯⋯


標籤: javascript x 3 jquery x 2 rails x 27 status code x 1 son x 1 ajax x 2

分享:


參與討論!
x
現在就加入《思書》,馬上參與討論!
《思書》是一個每個人的寫作與論壇平台,特有的隱私管理,用筆名來區隔你討論內容,讓你的討論更深入,而且免費。 趕快來試試!
還未加入《思書》? 現在就登錄! 已經加入《思書》── 登入