בדיקה לזיהוי תכונות של Credential Management API

Eiji Kitamura

סיכום

אפשר להגביר את האבטחה באמצעות WebAuthn באמצעות אימות המבוסס על פרטי כניסה עם מפתח ציבורי, ובקרוב תהיה תמיכה גם ב-Chrome, ב-Firefox וב-Edge (עם המפרט המעודכן). הוא מוסיף אובייקט Credential מסוג חדש, אבל עלול לגרום לשיבושים באתרים שמשתמשים ב-API לניהול פרטי הכניסה, בלי שהתכונה תזהה את הסוגים הספציפיים של פרטי הכניסה שבהם הם משתמשים.

אם אתם עושים זאת כרגע לצורך זיהוי תכונות

if (navigator.credentials && navigator.credentials.preventSilentAccess) {
    // use CM API
}

ביצוע פעולות אלה במקום זאת

if (window.PasswordCredential || window.FederatedCredential) {
    // Call navigator.credentials.get() to retrieve stored
    // PasswordCredentials or FederatedCredentials.
}

if (window.PasswordCredential) {
    // Get/Store PasswordCredential
}

if (window.FederatedCredential) {
    // Get/Store FederatedCredential
}

if (navigator.credentials && navigator.credentials.preventSilentAccess) {
    // Call navigator.credentials.preventSilentAccess()
}

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

מידע נוסף מפורט בהמשך.

מהו ה-Credential Management API

ה-API לניהול פרטי הכניסה (CM API) נותן לאתרים גישה פרוגרמטית לאחסון פרטי הכניסה של סוכן המשתמש, כדי לאחסן או לאחזר את פרטי הכניסה של המשתמש למקור הקריאה.

ממשקי ה-API הבסיסיים הם:

• navigator.credentials.get()
• navigator.credentials.store()
• navigator.credentials.create()
• navigator.credentials.preventSilentAccess()

במפרט המקורי של CM API מוגדרים 2 סוגים של פרטי כניסה:

• PasswordCredential
• FederatedCredential

PasswordCredential הוא פרטי כניסה שמכילים את מזהה המשתמש והסיסמה של המשתמש. FederatedCredential הוא פרטי כניסה שמכילים את מזהה המשתמש ומחרוזת שמייצגת ספק זהויות.

באמצעות שני פרטי הכניסה האלה, האתרים יכולים:

• מיד אחרי הנחיתה, המשתמש יכול להיכנס באמצעות פרטי כניסה מבוססי-סיסמה או פרטי כניסה מאוחדים שנשמרו בעבר (כניסה אוטומטית).
• מאחסנים את פרטי הכניסה המאוחדים או מבוססי-סיסמה שאיתם המשתמש נכנס.
• הקפדה על העדכניות של פרטי הכניסה של המשתמש (לדוגמה, לאחר שינוי סיסמה)

מה זה WebAuthn

WebAuthn (אימות באינטרנט) מוסיף פרטי כניסה למפתח ציבורי ל-CM API. לדוגמה, הוא מספק לאתרים שיטה סטנדרטית להטמעת אימות דו-שלבי באמצעות מכשירי מאמת חשבונות שתואמים ל-FIDO 2.0.

ברמה הטכנית, WebAuthn מרחיב את ה-CM API עם הממשק PublicKeyCredential.

מה הבעיה?

בעבר הנחינו מפתחים להשתמש בקוד הבא כדי לזהות את CM API:

if (navigator.credentials && navigator.credentials.preventSilentAccess) {
  // Use CM API
}

But as you can see from the descriptions above, the `navigator.credentials` is
now expanded to support public-key credentials in addition to password
credentials and federated credentials.

The problem is that user agents don't necessarily support all kinds of
credentials. If you continue feature detect using `navigator.credentials`, your
website may break when you are using a certain credential type not supported by
the browser.

**Supported credential types by browsers**
<table class="properties with-heading-tint"><tbody><tr>
<th></th>
<th>PasswordCredential / FederatedCredential</th>
<th>PublicKeyCredential</th>
</tr><tr><th>Chrome
</th><td>Available
</td><td>In development
</td></tr><tr><th>Firefox
</th><td>N/A
</td><td>Aiming to ship on 60
</td></tr><tr><th>Edge
</th><td>N/A
</td><td>Implemented with <a href="https://blogs.windows.com/msedgedev/2016/04/12/a-world-without-passwords-windows-hello-in-microsoft-edge/">older API</a>. New API (navigator.credentials) coming soon.
</td></tr></tbody></table>


## The solution
You can avoid this by modifying feature detection code as follows to explicitly
test for the credential type that you intend to use.

```js
if (window.PasswordCredential || window.FederatedCredential) {
    // Call navigator.credentials.get() to retrieve stored
    // PasswordCredentials or FederatedCredentials.
}

if (window.PasswordCredential) {
    // Get/Store PasswordCredential
}

if (window.FederatedCredential) {
    // Get/Store FederatedCredential
}

if (navigator.credentials && navigator.credentials.preventSilentAccess) {
    // Call navigator.credentials.preventSilentAccess()
}

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

כך אפשר לזהות את המשתמש PublicKeyCredential שנוסף ב-WebAuthn:

if (window.PublicKeyCredential) {
    // use CM API with PublicKeyCredential added in the WebAuthn spec
}

ציר הזמן

ההטמעה המוקדמת ביותר של WebAuthn היא Firefox ואנחנו מתכננים לשמור על יציבות בתחילת חודש מאי 2018.

סוף סוף

אם יש לך שאלות, אפשר לשלוח אותן לכתובת @agektmr או לכתובת agektmr@chromium.org.