Включение автоматического сохранения паролей в Microsoft Edge WebView2

Если надстройка предлагает пользователям войти, Microsoft Edge WebView2 может предложить сохранить учетные данные и заполнить их при следующем входе пользователей. В этой статье показан минимальный шаблон HTML и JavaScript для активации запроса на сохранение пароля WebView2 в надстройках Office в Windows.

Поток входа

Сначала создайте форму входа на HTML-странице надстройки. Форма должна содержать поля имени пользователя и пароля, а также кнопку для отправки учетных данных. Используйте стандартные поля учетных данных HTML: type="text" для имени пользователя и type="password" пароля. Примером является минимальный необходимый HTML-код.

<div>
  <label for="username">Username:</label><br/>
  <input type="text" id="username" name="username" /><br/>

  <label for="password">Password:</label><br/>
  <input type="password" id="password" name="password" /><br/>

  <button id="btn" type="button">Sign in</button>
</div>

В обработчике событий нажатия кнопки входа вызовите библиотеку проверки подлинности, чтобы войти в систему пользователя. После завершения входа перенаправьте на новую страницу. Когда WebView2 обнаруживает поля перенаправления и учетных данных, он может предложить пользователям сохранить учетные данные.

async function btnSignIn() {
  // Get the username and password credentials entered by the user.
  const username = document.getElementById("username").value;
  const pwd = document.getElementById("password").value;

  try {
    // Sign in the user. This is a placeholder for the actual sign-in logic.
    await signInUser(username, pwd);

    // Redirect to a success page to trigger the password autosave.
    window.location.href = "/home.html";
  }
  catch (error) {
    console.error("Sign in failed: " + error);
    return;
  }
}

Что видят пользователи

Когда пользователи вводят учетные данные в надстройке, а надстройка перенаправляется на новую страницу, WebView2 спрашивает, хотят ли они сохранить имя пользователя и пароль. Когда надстройка в следующий раз запрашивает учетные данные, WebView2 заполняет сохраненные сведения об учетной записи.

Диалоговое окно Из WebView2 с запросом пользователя, если он хочет сохранить свое имя пользователя и пароль.

Удаление сохраненных учетных данных

Пользователи могут удалить сохраненные пароли, удалив папку локального кэша WebView2 по адресу %LOCALAPPDATA%\Microsoft\Office\16.0\Wef\webview2\. Если надстройка использует автоматическое сохранение пароля, задокументируйте это расположение папки, чтобы пользователи могли удалить сохраненные учетные данные.

Связанные материалы

  • Last updated on