如何自定义DRF密码重置链接？适配React前端场景

可行性说明 #

完全可行，只需修改后端生成重置链接的逻辑，将默认的后端域名/端口替换为前端的即可。

具体实现步骤 #

1. 修改信号处理函数中的链接生成逻辑

你当前的信号接收函数里，reset_password_url是通过后端请求上下文生成的后端地址，直接替换为前端的基础地址即可。

修改后的代码示例（直接硬编码前端地址）：

@receiver(reset_password_token_created)
def password_reset_token_created(sender, instance, reset_password_token, *args, **kwargs):
    """
    Handles password reset tokens
    When a token is created, an e-mail needs to be sent to the user
    :param sender: View Class that sent the signal
    :param instance: View Instance that sent the signal
    :param reset_password_token: Token Model Object
    :param args:
    :param kwargs:
    :return:
    """
    # send an e-mail to the user
    context = {
        'current_user': reset_password_token.user,
        'username': reset_password_token.user.username,
        'email': reset_password_token.user.email,
        # 替换为前端的密码重置确认页面地址
        'reset_password_url': "http://localhost:3002/api/password_reset/confirm/?token={}".format(
            reset_password_token.key)
    }

    # render email text
    email_html_message = render_to_string('email/user_reset_password.html', context)
    email_plaintext_message = render_to_string('email/user_reset_password.txt', context)

    msg = EmailMultiAlternatives(
        # title:
        "Password Reset for {title}".format(title="Some website title"),
        # message:
        email_plaintext_message,
        # from:
        "noreply@somehost.local",
        # to:
        [reset_password_token.user.email]
    )
    msg.attach_alternative(email_html_message, "text/html")
    msg.send()

更优雅的方式（通过配置文件管理）：

• 在settings.py中添加配置项：

  FRONTEND_PASSWORD_RESET_CONFIRM_URL = "http://localhost:3002/api/password_reset/confirm/"
  

• 修改信号函数中的代码：

  from django.conf import settings
  
  @receiver(reset_password_token_created)
  def password_reset_token_created(sender, instance, reset_password_token, *args, **kwargs):
      # ... 其他代码不变
      context = {
          # ... 其他变量不变
          'reset_password_url': "{}?token={}".format(
              settings.FRONTEND_PASSWORD_RESET_CONFIRM_URL,
              reset_password_token.key)
      }
      # ... 其他代码不变
  

2. 前端处理逻辑补充

用户点击邮件中的链接后，前端页面需要：

• 从URL中提取token参数
• 展示密码重置表单，收集用户的新密码
• 调用后端的密码重置确认接口（通常是POST请求到http://localhost:8000/api/password_reset/confirm/），传递token和新密码参数，完成密码重置流程。

模板文件说明 #

你现有的模板文件user_reset_password.html无需修改，因为它直接使用reset_password_url变量，只要该变量生成的是正确的前端链接即可。

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