Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ASP.NET MVC 內建驗證擴充與活用技巧 -twMVC#3

twMVC
July 14, 2012

ASP.NET MVC 內建驗證擴充與活用技巧 -twMVC#3

撰寫網頁的時候你是否對於表單驗證很厭煩?

尤其現在網頁對於使用者經驗(UX)相當的注重,之前我們可以偷懶只寫後端驗證,現在不做前端驗證會被笑...

俗話說的好,程式設計師要懶,本次課程將和你介紹如何利用 ASP.NET MVC 內建的招式簡單的做出品質不錯的前後端驗證,而且彈性超大,你愛怎麼擴充就怎麼擴充,經常性寫到表單的開發人員千萬不要錯過。

http://mvc.tw

twMVC

July 14, 2012
Tweet

More Decks by twMVC

Other Decks in Technology

Transcript

  1.  因為你懶  因為你懶  因為你懶  因為你懶  因為你懶

     因為你懶  因為你懶  因為你懶  因為你懶  因為你懶 不做驗證的十個理由? 9
  2. 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便

     IClientValidatable  IValidatableObject ASP.NET MVC 內建驗證的好處 11
  3. 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便

     IClientValidatable  IValidatableObject ASP.NET MVC 內建驗證的好處 記住他們就夠了,一直就在這轉了 12
  4. ASP.NET MVC 內建驗證的好處 從 ASP.NET MVC 3.0 以後改用 jQuery 實作

     jQuery.Validate 擴充方便  IClientValidatable  IValidatableObject 一次的工就可以實作前後端驗證 記住他們就夠了,一直就在這轉了 13
  5. 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便

     IClientValidatable  IValidatableObject 一次的工就可以實作前後端驗證 ASP.NET MVC 內建驗證的好處 理論上 記住他們就夠了,一直就在這轉了 14
  6. 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便

     IClientValidatable  IValidatableObject 一次的工就可以實作前後端驗證  Unobtrusive ASP.NET MVC 內建驗證的好處 理論上 記住他們就夠了,一直就在這轉了 15
  7. Required • 不可空白 StringLength • 字串長度範圍 Compare • 比對 RegularExpression

    • 正則表示式 Remote • 真後端假前端自定驗證 AllowHtml • 反 HTML 驗證 ASP.NET MVC 內建驗證有哪些 16
  8.  Required  不可空白  StringLength  最大字數限制  最小字數限制

     字數範圍限制  Compare  欄位值比較 ASP.NET MVC 內建驗證介紹 17
  9. 18

  10. 20

  11.  RegularExpression  正則表示式  超強 ASP.NET MVC 內建驗證介紹 ^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-

    z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0- \uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e- \x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01- \x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0- \uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900- \uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|- |\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900- \uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0- \uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0- \uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$ 22
  12.  RegularExpression  正則表示式  超強  HTML 會透漏 Pattern

     安全性上的隱憂 圖片解千愁  微軟釋出的免費工具 SDL Regex Fuzzer  http://www.microsoft.com/en-us/download/details.aspx?id=20095 ASP.NET MVC 內建驗證 • http://msdn.microsoft.com/zh-tw/magazine/ff646973.aspx#MtViewDropDownText • http://www.dotblogs.com.tw/johnny/archive/2010/09/08/17607.aspx 24
  13. 26

  14.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優

    ASP.NET MVC 內建驗證介紹 http://goo.gl/Z5Yhi 但是有 Bug ´_ゝ` 27
  15.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優

     在 Area 中無法正確呼叫的解法參考 http://demo.tc/Post/756 ASP.NET MVC 內建驗證介紹 但是有 Bug ´_ゝ` 28
  16. 29

  17.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優

     在 Area 中無法正確呼叫 ASP.NET MVC 內建驗證介紹 但是有 Bug ´_ゝ` 不過還有地雷 … 30
  18.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優

     在 Area 中無法正確呼叫  後端是不會理會 Remote 的 ASP.NET MVC 內建驗證介紹 不過還有地雷 … 但是有 Bug ´_ゝ` 31
  19. 32

  20. 33

  21.  AllowHtml  可個別允許單一欄位輸入 HTML  優點  不必修改 <httpRun

    time RequestValidationMode="2.0" />  比 [ValidateInput(false)] 安全  缺點  不得使用 FormCollection ASP.NET MVC 內建驗證介紹 34
  22. 35

  23. 38

  24. 40

  25.  必須將此類別宣告為 sealed class  需要繼承 ValidationAttribute 抽象類別  必須覆寫

    IsValid 方法  GetClientValidationRules的ValidationType一定要小 寫 撰寫自定驗證注意事項 41
  26. 44

  27. 聯絡資訊 Blog: http://demo.tc Google+: http://demo.tc/+ Facebook: https://fb.me/demo.fan Plurk: http://plurk.com/demoshop 47

    http://is.gd/XFN6Wk (所有 ASP.NET MVC3 驗證介紹實作與擴充 系列的文章 第1頁 | demo小鋪) 衍生學習