לעבור (חלקית) ל-HTML 5 מבלי לפגוע בשימושיות של הטופס

בעת הפיתוח של HTML 5 בוצעו מספר שינויים בתגים קיימים, שמוסיפים כמות גדולה של שימושיות וקלים מאוד להטמעה. הטפסים, לדוגמא, השתנו לבלי היכר לצורך התאמה לעולם של היום: מובייל (כמובן) ומקלדות שמגיבות למצב, צרכים שעד היום מומשו בעזרת Javascript היום הם חלק בלתי נפרד מהשפה, והיופי הגדול שלהן הוא הנפילה שלהם לאחור: דפדפנים שאינם תומכים ב-HTML 5 לא ישימו לב להבדל.

נעבור על כמה דברים שאפשר לשנות בקלות בקוד מבלי לפגוע בשימושיות שלו.

DOCTYPE

מדהים איך משהו שהיה כמעט קללה בעבר (לך תמצא מה ה-DOCTYPE הרלוונטי!) הפך כיום ל-

<!DOCTYPE HTML>

פשוט וקליל.

INPUT

כאן נכנסת הגדולה האמיתית של HTML 5. השימוש ב-INPUT היה כל כך נפוץ עד היום, לכל כך הרבה צרכים שונים, שזה היה עניין של זמן עד שיעשו משהו גאוני. בעבר, HTML נבנתה כך שאם היו מחסירים את סיווג ה-INPUT, השפה הייתה מניחה שהתכוונת ל-TYPE=TEXT. בזכות זה, היום כל הסוגים החדשים שנוצרו נופלים חזרה לאחור ל-TYPE=TEXT, ולכן ניתן לשנות את ה-TYPE לסוגים החדשים מבלי לחשוש מנפילה בשימושיות.

למה שנרצה לשנות את זה, אתם בטח שואלים. הסיבות רבות, אבל בעיקר: מערכות ההפעלה של המובייל מתאימות את המקלדת אותה הן מקפיצות לשדה אותם אנחנו ממלאים. כך שאם אנחנו מקלידים אימייל, לדוגמא, מקש "@" או "@gmail.com" ישתרבבו למקלדת האותיות, בעוד שתווים כמו $ או # יעלמו. בנוסף, נוספות פונקציונאליות חדשות (לדוגמא, X קטן שמוחק את התוכן שהוקלד).

ואיך משתמשים בזה? בקלות. בוחרים את  הסוג הרלוונטי ומוסיפים TYPE= עם שם הסוג. כדאי לקרוא על הסוגים השונים, אבל אני אסקור את החשובים בינם.

TYPE=SEARCH

הלהיט התורן, שווה להחליף כל TYPE=TEXT רגיל אליו, כי הוא לא משנה כמעט כלום, רק מוסיף X קטן בתוך התא שמאפשר מחיקה של התוכן.

TYPE=EMAIL

מאפשר מקלדת EMAIL במידה והדפדפן תומך בזה.

TYPE=URL

מאפשר מקלדת נוחה להקלדת כתובת במידה ונתמכת, לדוגמא מתווספים מקשים כגון ".com" או "/" במקלדות מובייל.

TYPE=COLOR

פותח Color Picker שמאפשר לבחור צבע.

TYPE=DATE

מאפשר בחירה של תאריך.

TYPE=NUMBER (כולל תתי פקדים כגון MAX, MIN, STEP וכו')

מאפשר בחירה של מספר ופקדים כגון העלאה והורדה של מדרגה.

VALIDATE

פונקציונליות נהדרת שמתתמשקת עם תאי ההקלדה, לדוגמא, בשדה מסוג EMAIL תיבדק תקינות האימייל ובמידה ולא תקין תוקפץ הערה שמבקשת לתקן את השדה. במידה והשדה מוגדר כ-REQUIRED, הטופס לא ייתקבל ללא השדה הזה. שימושיות לדוגמא:

<input type="email" required validate>

האימות מתבצע אוטומטית על ידי HTML 5, אבל אם לא רוצים אותו ניתן לבטל אותו.

<form novalidate>

נקודה חשובה בהקשר אבטחת מידע (פשוט כי זה אני) אסור להסתמך על האימות הזה! זו פונקציונליות נחמדה למשתמשים קלילים, אבל תמיד יש לבדוק את הנתונים גם בצד השרת. אימות בצד המשתמש כפוף למניפולציות וניתן בקלות לעקוף אותו בעזרת הדפדפנים החדשים והכלים שלהם למפתחים. לדוגמא, הקונסול של כרום (כלים לפתחים) והתוסף FIREBUG לפיירפוקס מאפשרים לערוך את טפסי ה-HTML לפני השליחה שלהם, ולהוסיף NOVALIDATE כפי שתיארתי או לשנות את האימות.

AUTOFOCUS

אחד הפתרונות הנוחים ביותר שהוטמעו יחד עם HTML 5. בעבר היה נהוג להגדיר פוקוס על שדה בעת טעינת ה-DOM ב-JavaScript. היום, קיימת פונקציונליות מובנית ב-HTML 5 שמאפשרת בדיוק את זה – AUTOFOCUS. ניתן לציין רק אחד כזה, מן הסתם, בטופס.

<input name="search" type="search" autofocus>

PLACEHOLDER

עוד פתרון שהיה ממומש בעבר עם JavaScript הוא טקסט שמופיע בתוך השדה עד לנקודה שבה המשתמש עורך אותו, וכשהמשתמש לוחץ עליו הוא נעלם. יש לציין שבמידה והדפדפן לא תומך בפונקציה, הוא לא יציג כלום בתוך התא, אבל זה גם מה שהיה קורה לפני כן.

<input name="search" type="search" placeholder="Please Enter Your Query">

כל הדרכים שמפורטות מעלה בעלות מנגנון נפילה לאחור, כך שחוסר תמיכה לא משפיע על השימושיות של האתר, ויחד עם זאת תמיכה משפרת משמעותית את החוויה של המשתמש.

מידור הרשאות עבור משתמשים במסד הנתונים

כחלק מההתגוננות מפני פריצות חשוב מאוד לדאוג למידור הרשאות. גם במידה והאתר שלכם הוא האתר הכי פריץ בעולם, אם המשתמש שמריץ את השאילתות במסד הנתונים שלכם ממודר, אתם יכולים להיות קצת יותר רגועים. ולמה? כי גם אם מישהו יצליח לנצל את הפרצות באתר שלכם לצורך הרצה של קוד זדוני, הוא לא יוכל לעשות פעולות חמורות במיוחד, שיגרמו לנזק ממשי, כמו מחיקה של נתונים. עם זאת, הוא עדיין יוכל להעמיס על השרת ואף להפיל את ה-DB במקרים קיצוניים, כך שאין להסתמך רק על כך.

פקודות בעלות פוטנציאל הרס גדול

DROP TABLE table;
TRUNCATE TABLE table;
DELETE FROM table;

מה ההבדלים בין הפעולות?

המשותף לשלושת הפקודות הן שהן שלושתן מסוכנות מאוד, ולכן אנו לא רוצים שלמשתמש ה-Viewer של האתר יהיה הרשאות לבצע אותן. יחד עם זאת, לכל פקודה ייעוד שונה:

בעוד הפקודות Drop ו- Truncate פועלות ברמת טבלה, Delete פועלת ברמת השורה. הפקודה Drop מוחקת טבלה לאלתר (גם את הטבלה עצמה וגם את הערכים שבה), Truncate מוחקת את כל הערכים שבטבלה (אך לא את הטבלה עצמה), ו-Delete נועדה למחוק שורות שעומדות בתנאי WHERE כלשהו, אבל תמחק את כל השורות במידה ולא יצוין תנאי כזה. שימו לב שבעת ביצוע Truncate נאבד גם מידע על מונים, בעוד במחיקה של שורות בעזרת פקודת Delete לא נאבד זאת.

בנוסף, Drop ו- Truncate הן פקודות Data Definition Language (פקודות DDL) ופקודות אלה הן פקודות Autocommit. לעומתן, הפקודה DELETE היא פקודת Data Manipulation Language (פקודות DML). כלומר, ניתן לבצע חזרה לאחור (Roll Back) למצב הטבלה לאחר פקודת Delete, בעוד שלאחר הקשת הפקודות Drop ו-Truncate מתבצע Commit אוטומטי ולכן לא ניתן לחזור אחורה*.

אז כיצד ממדרים את המשתמש?

תמיד חשוב לזכור שאין להריץ אף פעם את האתר בעזרת משתמש עם הרשאות מלאות. זה קורה המון, וזה מוות ידוע מראש שניתן היה למנוע.

בבנייה של אתר חדש תמיד עליכם ליצור משתמש ייעודי לפעולות טריביאליות כמו SELECT, INSERT או UPDATE בלבד, ורק בעזרתו להתחבר אל ה-DB מהאתר. הסיבה לכך היא שאת רוב הפעולות האדמיניסטרטיביות (כמו DROP בדוגמא הקיצונית) לא מבצעים כל יום, ולכן אין שום סיבה שמשתמש זה יוכל לבצע פעולה זאת.

ניצור משתמש חדש ב-Database כך:

CREATE USER 'site' IDENTIFIED BY 'password';

ניצור תפקיד viewer שירכז את ההרשאות שיינתנו לכל משתמש לקריאה בלבד:

CREATE ROLE 'viewer' IDENTIFIED BY 'password';

הרשאות אך ורק על טבלאות התוכן של האתר, אליהן הוא התפקיד צריך לקבל, בצורה הזו:

GRANT 'access' -- select, execute, all ...
ON 'object_name' -- Table name
TO 'viewer'; -- Role name 

על מנת להסיר לתפקיד הרשאה, נשתמש בפקודה REVOKE:

REVOKE 'access' -- drop, select, execute, all...
ON 'table_name' -- any table
TO 'viewer'; 

שימוב לב כי במידה והמשתמש הוא ה-Owner של הטבלה והיא נמצאת בסכימה של המשתמש, לא ניתן יהיה לקחת ממנו את ההרשאה לעשות DROP לטבלה זו. במקום זאת נצטרך לשנות לטבלה סכמה או ליצור משתמש חדש מחוץ לסכימה.

ALTER TABLE 'table_name'
OWNER TO 'new_owner'

וניתן את התפקיד למשתמש שיצרנו:

GRANT 'viewer' TO 'site' -- Grant the role we created to the user

זה הכל להפעם. הגדרה נכונה של משתמשים יכולה למנוע הרבה מאוד כאב ראש, כאשר לא עושים Escaping נכון לקלט.

האותיות הקטנות: 

* החל מגרסא 10g מסד הנתונים של Oracle בנוי בארכיטקטורת Flashback. טכנולוגיית Flashback שומרת נקודות זמן שנוצרות לאחר סיום של כל טרנזקציה ומאפשרת לשלוף מידע מנקודת זמן קודמת, לראות את כל השינויים שנעשו בשורות מסוימות בין שתי נקודות זמן וכן לחזור אחורה לנקודות קודמות, על מנת לשחזר טבלאות ו-Indexים מטעויות אנוש או כשלים לוגיים, כמו Drop לא רצוי.

על מנת לשפעל Flashback עליכם להקיש בזמן מצב Archive Log:

ALTER SYSTEM SET DB_FLASHBACK_RETENTION_TARGET=2880;
ALTER DATABASE FLASHBACK ON

וכדי לבצע את השחזור עצמו:

FLASHBACK TABLE table TO BEFORE DROP [RENAME TO new_name]
-- or
FLASHBACK DATABASE TO TIMESTAMP(SYSDATE-1/24);

מדריך: בדיקות קלט ושיטות התגוננות מפני SQL Injection

הזרקת SQL היא אף פעם לא דבר נעים, וזה תקף במיוחד כשזה קורה לאתר שלך. בחלק החמישי של המדריך התחלתי להסביר על מספר שיטות להתמודדות עם הזרקות SQL. עם זאת, כדאי שאני אשים את הדגש על בדיקות הקלט מהמשתמש, וזה מה שאעשה בפוסט זה.

כמו שאמרתי בעבר, אף פעם אין לסמוך על המשתמש שיכניס קלט תקין. גם אם רוב המשתמשים שלכם תמימים, תמיד תהיה פרצה, וזה סיכון שאסור לקחת. בדיוק בגלל זה חשוב להקפיד על מספר כללים חשובים מאוד בעת קבלת קלט מהמשתמש:

  1. דעו מה אתם מצפים לקבל.
    במידה ואתם מצפים לקבל סוג משתנה כלשהו (לדוגמא, מספר שלם – Integer, או תו בודד וכו'), עליכם תמיד לבצע בדיקה לקלט! כך למשל, במידה ואתם מקבלים משתנה Integer, תמיד שימו לב להמיר את המשתנה שמתקבל ל-Integer. ככה תיפטרו ממספר לא מבוטל של ג'יפה בדרך. במידה ואתם יודעים שאתם מצפים לתו בודד (לדוגמא כאשר אתם בונים מנגנון סינון עפ"י אות), תמיד תוכלו לקחת מהמחרוזת שמתקבלת מהמשתמש אך ורק את התו הראשון, ורק את התו הבודד שלקחתם תוכלו לקחת אל השאילתה.
  2. נטרו את הקלט, וחפשו מילות SQL.
    במידה ואתם בכל זאת לא יודעים מה המשתמש יכניס (שימו לב שממש לא רצוי לעבוד כך!), תמיד עליכם לשער שהמשתמש מנסה להשתמש במילים שמורות של שפת SQL. לכן עליכם לנטר מילות חיבור נפוצות ב-SQL, לדוגמא, UNION, SELECT, DROP.
    הסתייגות: שפת SQL היא שפה פשוט נורא, והרבה פעמים המילים Select, Union, Drop הן מילים לגיטימיות שיכולות להגיע ממשתמש לגיטימי, לכן יש להפנות תשומת לב לבדיקת הקלט.
  3. חסכו בהרשאות למשתמש שמבצע את השאילתות באתר.
    צרו משתמש חדש במסד עבור הצגת האתר ותנו לו הרשאות קריאה בלבד על טבלאות ספציפיות מהמסד. שימו לב שניתן להגדיר עבור משתמש הרשאות ספציפיות ושהמשתמש הזה לא נועד להיות מנהל מערכת, כך שאין שום צורך שהמשתמש שמציג את האתר יוכל להקיש את הפקודה DROP TABLE. כמו כן, גם Union (שנשמע תמים), יכול להיות נוראי כשזה מגיע לשליפות SQL. בעזרת Union פשוט ניתן "לחבר" בין הטור בטבלה שאותו העמוד צריך להציג, לבין טור סיסמאות המשתמשים באתר.
    הערה: כתבתי מדריך מפורט למידור הרשאות במשתמשים במסדי נתונים.
  4. בטלו פלטי הודעות השגיאה.
    אם כבר מנסים לפרוץ לכם את האתר, לפחות שלא יראו מה שהם עושים.
  5. הצפינו את המידע.
    צאו מנקודת הנחה שהכל כשל, ושההאקר הצליח להגיע אל המידע למרות הכל. לכן תמיד עדיף לבצע הצפנה של מידע רגיש וחשוב ולא לשמור אותו במסד הנתונים כ-Plain Text. האופציה הטובה ביותר היא לשמור Salted Hash במסד הנתונים, במקום את הסיסמא, ואת האותנטיקציה לבצע במהלך אימות הקלט.

ההתגוננות, כשלעצמה, היא קשה. יש אינספור אפשרויות ואינסוף מקומות בהם אנו יכולים להיתפס עם המכנסיים למטה. לכן חשוב לי להדגיש את החשיבות בתכנות נכון מהרגע שבו האתר נבנה. תמיד תלכו בעקבות המדריך הזה, זה יפחית את הסיכויים שלכם לאבד את כל מה שבניתם.

Google I/O 2012 – גוגל מראה לכולם מי הבוס

אם שמעתם או לא, בין התאריכים 27-29 ביוני התקיים אחד האירועים הגדולים בתחום המובייל העולמי. אני מדבר כמובן על Google I/O, שהתקיים במרכז מוסקוני בסאן פרנסיסקו, בו הוכרזו לא פחות מ-3 אבני דרך בעולם המחשוב הנייד, יחד עם הצגה של אינספור שירותים ומוצרים של גוגל. שלוש ההכרזות הגדולות קרו כבר ביממה הראשונה, ואני מדבר כמובן על אנדרויד 4.1 (Android 4.1 Jelly Bean), הטאבלט הראשון של גוגל (שנקרא Nexus 7), ומכשיר הזרמת מדיה סלוני (Nexus Q).

אירוע הפתיחה היה בהחלט מרשים. ההכרזות הגיעו בזו אחר זו, וכבר כשחשבנו שראינו הכל, סרגיי ברין נכנס (ממייסדי גוגל), עטור במשקפי המציאות הרבודה של גוגל. Project Glass הדהים את הקהל, כאשר צוות של פעלולנים צנחו צניחה חופשית, קפצו בעזרת אופניים, ביצעו סנפלינג על חלונות הבניין וקפצו אל הבמה, כל זה – כאשר הם מרכיבים את המשקפיים החכמים. אי אפשר שלא לחשוב שהמצגת המרשימה והפעלולים היו מפגן כוח מרשים, כזה שאמור לאותת למתחרות (ואפל בראשן) מי החברה הגדולה והחזקה בשוק היום.

Google Nexus 7, Google Nexus Q, Android 4.1 "Jelly Bean"

Android 4.1 "Jelly Bean"

כמו תמיד, גם הפעם מכשיר ה-Galaxy Nexus של גוגל זוכה לקבל את עדכון מערכת ההפעלה "Jelly Bean" באופן אקסלוסיבי ראשון.

בין החידושים שייכנסו לגרסא החדשה של מערכת ההפעלה ייכנס Google Now, שדרוג הכרחי של שירות החיפוש של Google במכשירי Android לאור הצטרפותה של Siri, העוזרת הקולית, אל מערך האייפון והאייפד של אפל. Google Now עושה את מה שגוגל עושה הכי טוב – מספקת תשובות, ומהר. השירות מקבל כבר היום ביקורות נהדרות, מבחני ההשוואה של בלוגרים ברחבי העולם מראים כי גוגל מספקת תוצאות מדויקות, מצוינות ושזמני התגובה מהירים משל סירי. עם זאת, אין לשכוח כי סירי נמצאת כיום על מיליוני מכשירים, ושרתיה עמוסים מאוד בנסיון לעמוד בעומס הבקשות כל רגע נתון, ואילו Google Now מספק תשובות למספר מוגבל מאוד של מכשירים כרגע. בשורה משמחת נוספת, היא תמיכה בשפה העברית בחיפוש הקולי.

כמו כן הגרסא החדשה של מערכת ההפעלה תחדש את תחום ה-Notifications לגמרי, בפעם הראשונה נוכל "להגדיל" התרעות על מנת לחשוף כפתורים מותאמים אישית עבור כל התרעה, וכן לקבל מידע נוסף שלא יכלנו לקבל בשורת ההתרעה הקודמת.

גם Google Play תשודרג, ומהיום במקום להוריד מחדש אפליקציה על מנת לשדרג אותה, נוכל להוריד רק את קטע הקוד שהשתנה מהגרסא הקודמת. גוגל מוסרת שלפי בדיקתם, תחסך הורדה של כ-70% מהאפליקציה בכל פעם.

Nexus Q

במהלך יוצא דופן ביום הראשון גוגל הכריזה על כדורגל מעוצב. סתם, מדובר ב-Streamer (מכשיר להזרמת מדיה לטלוויזיה או רמקולים חיצוניים) לכל דבר, שמתממשק בצורה אלגנטית עם הסמארטפון או הטאבלט, שמסוגל להקרין סרט ישירות מ-Google Play או להשמיע מוזיקה היישר מהמדיה שנקנתה בחנות של גוגל. גם פה כמו ב-Apple TV, לא נראה כי המוצר יגיע אל השוק הישראלי (וגם אם כן, סביר להניח שלא יהיה הרבה מה לעשות איתו).

Nexus 7

הטאבלט של גוגל הגיע. קטן וקומפקטי (רק 7 אינץ'), לא נראה כי הטאבלט הזה הוא מה שיישבור את נתח השוק המטורף של האייפד. עם זאת, הטאבלט הזה הוא ירייה ראשונה בקרב. הטאבלט מגיע עם מעבד מרובע ליבות עוצמתי (אם כי על המעבד הוטלה מגבלת שימוש) Tegra 3 של Nvidia, מסך 7 אינץ' (קטן יחסית לשוק הטאבלטים כיום), מצלמה קדמית בלבד ומערכת הפעלה Android 4.1 Jelly Bean. נראה כי גוגל מהמרת בכל כוחה על טכנולוגיית הענן, שכן זהו ההסבר ההגיוני היחיד לנפח האחסון המוגבל (8GB או 16GB בגרסא המוגדלת).

המחיר מפתה, רק 200$ לגרסאת ה-8GB ואילו 250$ לגרסאת ה-16GB.