ASP.NET MVC Validation
快速開發系列
 美商微軟最有價值專家(ASP.NET) 連任第四屆
 藍色小舖 資訊專家貢獻獎
 demo小鋪 作者
 twMVC 聯合創辦人之一
講者介紹
2
 此次內容有很多爛哏,笑不出來也請笑…
 過程中如果有任何問題歡迎打斷
 隨時歡迎上廁所,不用怕傷了我的心。
 講電話請離席,我們不想知道你的祕密。
 本投影片所包含的商標與文字皆屬原著作者所有。
 本投影片使用的圖片皆從網路搜尋。...
預防針
我看新聞都可以這樣寫來規避版權,我應該也可以吧
 此次內容有很多爛哏,笑不出來也請笑…
 過程中如果有任何問題歡迎打斷
 隨時歡迎上廁所,不用怕傷了我的心。
 講電話請離席,我們不想知道你的祕密。
 本投影片所包含的商標與文字...
 活動頁面使用者回填的資料都很假?
 電話填寫不確實資料庫很髒?
 每個欄位都要驗證很麻煩,驗證重點就好!
 前端驗證只是帥不想花時間寫?
 寫好前端頁面就軟了,後端就相信前端吧?
你有沒有過以下情境?
5
你有沒有過?
 活動頁面使用者回填的資料都很假?
 電話填寫不確實資料庫很髒?
 每個欄位都要驗證很麻煩,驗證重點就好!
 前端驗證只是帥不想花時間寫?
 寫好前端頁面就軟了,後端就相信前端吧?
6
你的網站一絲不掛嗎?
7
不做驗證的十個理由?
8
 因為你懶
 因為你懶
 因為你懶
 因為你懶
 因為你懶
 因為你懶
 因為你懶
 因為你懶
 因為你懶
 因為你懶
不做驗證的十個理由?
9
如果驗證是要我們焦頭爛額 那我就讓你們看見內建的驕傲
10
從 ASP.NET MVC 3.0 以後改用 jQuery 實作
 jQuery.Validate
擴充方便
 IClientValidatable
 IValidatableObject
ASP.NET MVC 內建驗證的好處
11
從 ASP.NET MVC 3.0 以後改用 jQuery 實作
 jQuery.Validate
擴充方便
 IClientValidatable
 IValidatableObject
ASP.NET MVC 內建驗證的好處
記住...
ASP.NET MVC 內建驗證的好處
從 ASP.NET MVC 3.0 以後改用 jQuery 實作
 jQuery.Validate
擴充方便
 IClientValidatable
 IValidatableObject
一...
從 ASP.NET MVC 3.0 以後改用 jQuery 實作
 jQuery.Validate
擴充方便
 IClientValidatable
 IValidatableObject
一次的工就可以實作前後端驗證
ASP.NE...
從 ASP.NET MVC 3.0 以後改用 jQuery 實作
 jQuery.Validate
擴充方便
 IClientValidatable
 IValidatableObject
一次的工就可以實作前後端驗證
 Unob...
Required
• 不可空白
StringLength
• 字串長度範圍
Compare
• 比對
RegularExpression
• 正則表示式
Remote
• 真後端假前端自定驗證
AllowHtml
• 反 HTML 驗證
ASP...
 Required
 不可空白
 StringLength
 最大字數限制
 最小字數限制
 字數範圍限制
 Compare
 欄位值比較
ASP.NET MVC 內建驗證介紹
17
18
 RegularExpression
 正則表示式
 超強
ASP.NET MVC 內建驗證介紹
19
20
 RegularExpression
 正則表示式
 超強
ASP.NET MVC 內建驗證介紹
21
 RegularExpression
 正則表示式
 超強
ASP.NET MVC 內建驗證介紹
^((([a-z]|d|[!#$%&'*+-/=?^_`{|}~]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])...
 RegularExpression
 正則表示式
 超強
 HTML 會透漏 Pattern
ASP.NET MVC 內建驗證介紹
23
 RegularExpression
 正則表示式
 超強
 HTML 會透漏 Pattern
 安全性上的隱憂 圖片解千愁
 微軟釋出的免費工具 SDL Regex Fuzzer
 http://www.microsoft.co...
 Remote
 利用 AJAX 達到前端驗證,後端執行
 什麼都能玩
 效能相當優
ASP.NET MVC 內建驗證介紹
25
26
 Remote
 利用 AJAX 達到前端驗證,後端執行
 什麼都能玩
 效能相當優
ASP.NET MVC 內建驗證介紹
http://goo.gl/Z5Yhi
但是有 Bug ´_ゝ`
27
 Remote
 利用 AJAX 達到前端驗證,後端執行
 什麼都能玩
 效能相當優
 在 Area 中無法正確呼叫的解法參考
http://demo.tc/Post/756
ASP.NET MVC 內建驗證介紹
但是有 Bug ´_...
29
 Remote
 利用 AJAX 達到前端驗證,後端執行
 什麼都能玩
 效能相當優
 在 Area 中無法正確呼叫
ASP.NET MVC 內建驗證介紹
但是有 Bug ´_ゝ`
不過還有地雷 …
30
 Remote
 利用 AJAX 達到前端驗證,後端執行
 什麼都能玩
 效能相當優
 在 Area 中無法正確呼叫
 後端是不會理會 Remote 的
ASP.NET MVC 內建驗證介紹
不過還有地雷 …
但是有 Bug ´_ゝ...
32
33
 AllowHtml
 可個別允許單一欄位輸入 HTML
 優點
 不必修改 <httpRun time RequestValidationMode="2.0" />
 比 [ValidateInput(false)] 安全
 缺點...
35
 基於 jQuery Validate擴充
 Bool
 SingleVal
 MinMax
 Method
自定驗證
36
 基於 jQuery Validate擴充
 Bool
 SingleVal
 MinMax
 Method
自定驗證
37
38
沒有前端阿
39
40
 必須將此類別宣告為 sealed class
 需要繼承 ValidationAttribute 抽象類別
 必須覆寫 IsValid 方法
 GetClientValidationRules的ValidationType一定要小
寫...
 統一擴充於單一 js
 不透過 Submit 呼叫驗證方法
前端驗證小技巧
42
 商業邏輯驗證
 沒有前端驗證
 可以視為資料乾淨的最後防線
自定驗證(Model層級
43
44
表單驗證還不寫嗎?
45
表單驗證還不寫嗎?
46
聯絡資訊
Blog: http://demo.tc
Google+: http://demo.tc/+
Facebook: https://fb.me/demo.fan
Plurk: http://plurk.com/demoshop
47
h...
48
線上問券麻煩填寫
http://mvc.tw
 每週小型聚會,不定期有主題
 固定於每週四 19:30-21:30,不改時間,逢國定假日暫停一次
 議程會提前排定,也歡迎各位參加者分享開發經驗
 舉辦不定期研討會
 相關消息請密切注意 http://mvc.tw
49
twMVC...
http://mvc.tw
台灣 ASP.NET MVC 專業推廣團隊
Upcoming SlideShare
Loading in …5
×

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

1,411 views
1,259 views

Published on



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

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

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

http://mvc.tw

0 Comments
6 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,411
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
23
Comments
0
Likes
6
Embeds 0
No embeds

No notes for slide

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

  1. 1. ASP.NET MVC Validation 快速開發系列
  2. 2.  美商微軟最有價值專家(ASP.NET) 連任第四屆  藍色小舖 資訊專家貢獻獎  demo小鋪 作者  twMVC 聯合創辦人之一 講者介紹 2
  3. 3.  此次內容有很多爛哏,笑不出來也請笑…  過程中如果有任何問題歡迎打斷  隨時歡迎上廁所,不用怕傷了我的心。  講電話請離席,我們不想知道你的祕密。  本投影片所包含的商標與文字皆屬原著作者所有。  本投影片使用的圖片皆從網路搜尋。 預防針 3
  4. 4. 預防針 我看新聞都可以這樣寫來規避版權,我應該也可以吧  此次內容有很多爛哏,笑不出來也請笑…  過程中如果有任何問題歡迎打斷  隨時歡迎上廁所,不用怕傷了我的心。  講電話請離席,我們不想知道你的祕密。  本投影片所包含的商標與文字皆屬原著作者所有。  本投影片使用的圖片皆從網路搜尋。 4
  5. 5.  活動頁面使用者回填的資料都很假?  電話填寫不確實資料庫很髒?  每個欄位都要驗證很麻煩,驗證重點就好!  前端驗證只是帥不想花時間寫?  寫好前端頁面就軟了,後端就相信前端吧? 你有沒有過以下情境? 5
  6. 6. 你有沒有過?  活動頁面使用者回填的資料都很假?  電話填寫不確實資料庫很髒?  每個欄位都要驗證很麻煩,驗證重點就好!  前端驗證只是帥不想花時間寫?  寫好前端頁面就軟了,後端就相信前端吧? 6
  7. 7. 你的網站一絲不掛嗎? 7
  8. 8. 不做驗證的十個理由? 8
  9. 9.  因為你懶  因為你懶  因為你懶  因為你懶  因為你懶  因為你懶  因為你懶  因為你懶  因為你懶  因為你懶 不做驗證的十個理由? 9
  10. 10. 如果驗證是要我們焦頭爛額 那我就讓你們看見內建的驕傲 10
  11. 11. 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便  IClientValidatable  IValidatableObject ASP.NET MVC 內建驗證的好處 11
  12. 12. 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便  IClientValidatable  IValidatableObject ASP.NET MVC 內建驗證的好處 記住他們就夠了,一直就在這轉了 12
  13. 13. ASP.NET MVC 內建驗證的好處 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便  IClientValidatable  IValidatableObject 一次的工就可以實作前後端驗證 記住他們就夠了,一直就在這轉了 13
  14. 14. 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便  IClientValidatable  IValidatableObject 一次的工就可以實作前後端驗證 ASP.NET MVC 內建驗證的好處 理論上 記住他們就夠了,一直就在這轉了 14
  15. 15. 從 ASP.NET MVC 3.0 以後改用 jQuery 實作  jQuery.Validate 擴充方便  IClientValidatable  IValidatableObject 一次的工就可以實作前後端驗證  Unobtrusive ASP.NET MVC 內建驗證的好處 理論上 記住他們就夠了,一直就在這轉了 15
  16. 16. Required • 不可空白 StringLength • 字串長度範圍 Compare • 比對 RegularExpression • 正則表示式 Remote • 真後端假前端自定驗證 AllowHtml • 反 HTML 驗證 ASP.NET MVC 內建驗證有哪些 16
  17. 17.  Required  不可空白  StringLength  最大字數限制  最小字數限制  字數範圍限制  Compare  欄位值比較 ASP.NET MVC 內建驗證介紹 17
  18. 18. 18
  19. 19.  RegularExpression  正則表示式  超強 ASP.NET MVC 內建驗證介紹 19
  20. 20. 20
  21. 21.  RegularExpression  正則表示式  超強 ASP.NET MVC 內建驗證介紹 21
  22. 22.  RegularExpression  正則表示式  超強 ASP.NET MVC 內建驗證介紹 ^((([a-z]|d|[!#$%&'*+-/=?^_`{|}~]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])+(.([a- z]|d|[!#$%&'*+-/=?^_`{|}~]|[u00A0-uD7FFuF900-uFDCFuFDF0- uFFEF])+)*)|((x22)((((x20|x09)*(x0dx0a))?(x20|x09)+)?(([x01-x08x0bx0cx0e- x1fx7f]|x21|[x23-x5b]|[x5d-x7e]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])|(([x01- x09x0bx0cx0d-x7f]|[u00A0-uD7FFuF900-uFDCFuFDF0- uFFEF]))))*(((x20|x09)*(x0dx0a))?(x20|x09)+)?(x22)))@((([a-z]|d|[u00A0-uD7FFuF900- uFDCFuFDF0-uFFEF])|(([a-z]|d|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])([a-z]|d|- |.|_|~|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])*([a-z]|d|[u00A0-uD7FFuF900- uFDCFuFDF0-uFFEF]))).)+(([a-z]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])|(([a-z]|[u00A0- uD7FFuF900-uFDCFuFDF0-uFFEF])([a-z]|d|-|.|_|~|[u00A0-uD7FFuF900-uFDCFuFDF0- uFFEF])*([a-z]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF]))).?$ 22
  23. 23.  RegularExpression  正則表示式  超強  HTML 會透漏 Pattern ASP.NET MVC 內建驗證介紹 23
  24. 24.  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
  25. 25.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優 ASP.NET MVC 內建驗證介紹 25
  26. 26. 26
  27. 27.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優 ASP.NET MVC 內建驗證介紹 http://goo.gl/Z5Yhi 但是有 Bug ´_ゝ` 27
  28. 28.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優  在 Area 中無法正確呼叫的解法參考 http://demo.tc/Post/756 ASP.NET MVC 內建驗證介紹 但是有 Bug ´_ゝ` 28
  29. 29. 29
  30. 30.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優  在 Area 中無法正確呼叫 ASP.NET MVC 內建驗證介紹 但是有 Bug ´_ゝ` 不過還有地雷 … 30
  31. 31.  Remote  利用 AJAX 達到前端驗證,後端執行  什麼都能玩  效能相當優  在 Area 中無法正確呼叫  後端是不會理會 Remote 的 ASP.NET MVC 內建驗證介紹 不過還有地雷 … 但是有 Bug ´_ゝ` 31
  32. 32. 32
  33. 33. 33
  34. 34.  AllowHtml  可個別允許單一欄位輸入 HTML  優點  不必修改 <httpRun time RequestValidationMode="2.0" />  比 [ValidateInput(false)] 安全  缺點  不得使用 FormCollection ASP.NET MVC 內建驗證介紹 34
  35. 35. 35
  36. 36.  基於 jQuery Validate擴充  Bool  SingleVal  MinMax  Method 自定驗證 36
  37. 37.  基於 jQuery Validate擴充  Bool  SingleVal  MinMax  Method 自定驗證 37
  38. 38. 38
  39. 39. 沒有前端阿 39
  40. 40. 40
  41. 41.  必須將此類別宣告為 sealed class  需要繼承 ValidationAttribute 抽象類別  必須覆寫 IsValid 方法  GetClientValidationRules的ValidationType一定要小 寫 撰寫自定驗證注意事項 41
  42. 42.  統一擴充於單一 js  不透過 Submit 呼叫驗證方法 前端驗證小技巧 42
  43. 43.  商業邏輯驗證  沒有前端驗證  可以視為資料乾淨的最後防線 自定驗證(Model層級 43
  44. 44. 44
  45. 45. 表單驗證還不寫嗎? 45
  46. 46. 表單驗證還不寫嗎? 46
  47. 47. 聯絡資訊 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小鋪) 衍生學習
  48. 48. 48 線上問券麻煩填寫 http://mvc.tw
  49. 49.  每週小型聚會,不定期有主題  固定於每週四 19:30-21:30,不改時間,逢國定假日暫停一次  議程會提前排定,也歡迎各位參加者分享開發經驗  舉辦不定期研討會  相關消息請密切注意 http://mvc.tw 49 twMVC 每週聚會
  50. 50. http://mvc.tw 台灣 ASP.NET MVC 專業推廣團隊

×