预填充 Okta 注册小部件

要预填充Okta注册小部件，您需要执行以下步骤：

1. 引入所需的库和样式表：

<link rel="stylesheet" type="text/css" href="https://global.oktacdn.com/okta-signin-widget/5.5.0/css/okta-sign-in.min.css">
<script src="https://global.oktacdn.com/okta-signin-widget/5.5.0/js/okta-sign-in.min.js" type="text/javascript"></script>

2. 创建一个具有预填充属性的配置对象：

var config = {
  baseUrl: 'https://your-okta-domain.com',
  clientId: 'your-client-id',
  redirectUri: 'https://your-redirect-uri.com',
  authParams: {
    display: 'page',
    responseMode: 'fragment',
    responseType: 'code',
    scopes: ['openid', 'email'],
  },
  i18n: {
    en: {
      'primaryauth.title': 'Sign up',
      'primaryauth.username.placeholder': 'Email',
      'primaryauth.username.tooltip': 'Enter your email',
      'primaryauth.password.placeholder': 'Password',
      'primaryauth.password.tooltip': 'Enter your password',
      'primaryauth.submit': 'Create account',
      'primaryauth.signin': 'Already have an account? Sign in',
    },
  },
  prefill: {
    username: 'john.doe@example.com',
  },
};

3. 在HTML中创建一个div元素，用于渲染Okta注册小部件：

<div id="okta-widget-container"></div>

4. 初始化Okta注册小部件：

var oktaSignIn = new OktaSignIn(config);
oktaSignIn.renderEl(
  { el: '#okta-widget-container' },
  function success(res) {
    if (res.status === 'SUCCESS') {
      console.log('Registration successful');
    }
  }
);

在上述代码示例中，您需要替换以下值：

• https://your-okta-domain.com：您的Okta域名。
• your-client-id：您的Okta客户端ID。
• https://your-redirect-uri.com：注册成功后重定向到的URI。
• john.doe@example.com：要预填充的用户名。

请注意，这只是一个示例，您可能需要根据您的特定需求进行更改和调整。