如何在Azure B2C自定义页面中正确生成登录页面链接？

核心思路：利用B2C页面上下文参数手动构建登录链接 #

默认的getRedirectLink函数仅支持生成重置密码、注册等特定流程的链接，但我们可以通过页面内置的context对象获取关键参数，手动拼接出标准的登录页面URL，覆盖所有访问场景。

• 步骤1：提取上下文参数
  自定义页面的脚本中可以直接访问context对象，获取以下关键信息：

  • context.tenantId：你的B2C租户ID（格式如xxx.onmicrosoft.com）
  • context.policy：当前使用的用户流ID（如B2C_1_signup_signin）
  • context.clientId：应用注册的客户端ID
  • context.redirectUri：登录后的重定向URI

• 步骤2：编写链接生成函数
  在自定义页面的JavaScript中添加以下函数，自动拼接符合B2C授权规则的登录链接：

  function generateLoginUrl() {
      // 提取租户名称（去掉.onmicrosoft.com后缀）
      const tenantName = context.tenantId.split('.')[0];
      // 必要参数编码
      const encodedRedirectUri = encodeURIComponent(context.redirectUri);
      // 拼接完整登录链接
      return `https://${tenantName}.b2clogin.com/${tenantName}.onmicrosoft.com/${context.policy}/oauth2/v2.0/authorize?client_id=${context.clientId}&redirect_uri=${encodedRedirectUri}&response_type=code&scope=openid`;
  }
  

• 步骤3：在页面中添加登录链接
  在自定义重置密码或注册页面的HTML中，调用上述函数生成链接：

  <a href="#" onclick="window.location.href = generateLoginUrl(); return false;">返回登录页面</a>
  

为什么不用history.back()？ #

history.back()依赖浏览器的访问历史，若用户直接通过书签、外部链接访问重置密码/注册页面，该方法会跳转到之前的非B2C页面（甚至空白页），无法稳定回到登录流程，因此不推荐使用。

验证方案有效性 #

测试两种场景确保链接可靠：

1. 从登录页跳转至重置密码/注册页，点击链接确认能返回登录页
2. 直接访问重置密码/注册页的URL，点击链接确认能正确进入对应用户流的登录流程

内容的提问来源于stack exchange，提问作者Term1te