Play框架中登录验证失败时添加Flashing消息的实现咨询

嘿，我来帮你搞定这个需求！你想要的是仅在登录凭证验证失败时展示Flash提示，同时保留已有的隐式消息（比如表单字段的验证错误）展示功能对吧？咱们一步步调整代码来实现：

1. 控制器代码调整（精准触发Flash消息） #

你的现有验证逻辑方向是对的，但需要明确区分「表单字段验证失败」和「用户名/密码无效」两种场景，只在后一种场景下触发Flash消息：

// 登录页面的Action：需要声明implicit request，确保模板能访问Flash上下文
def login = Action { implicit request =>
  Ok(views.html.login(MyForm.form))
}

// 登录验证的Action
def authenticate = Action.async { implicit request =>
  MyForm.form.bindFromRequest().fold(
    // 场景1：表单字段验证失败（比如用户名为空、格式不对）
    formWithErrors => {
      Future.successful(BadRequest(views.html.login(formWithErrors)))
      // 这里用隐式消息展示字段错误，不需要Flash
    },
    // 场景2：表单格式合法，验证用户名密码有效性
    userData => {
      if (!isValidCredentials(userData.username, userData.password)) {
        // 验证失败：重定向到登录页并添加Flash错误消息
        Future.successful(
          Redirect(routes.Admin.login)
            .flashing("error" -> "Invalid Username or Password")
        )
      } else {
        // 验证成功：跳转到后台首页
        Future.successful(Redirect(routes.Admin.dashboard).withSession("userId" -> userData.username))
      }
    }
  )
}

2. 模板代码调整（条件渲染Flash消息） #

你的模板已经注入了MessagesRequestHeader，可以通过它访问请求中的Flash消息。我们只需要在模板里做个判断：如果存在"error"类型的Flash消息，就渲染出来，同时保留原有的隐式消息展示：

@(data: Form[MyForm])(implicit message: MessagesRequestHeader)
<html>
<body>
  <!-- 仅在登录验证失败时显示的Flash消息 -->
  @message.request.flash.get("error").map { errorMsg =>
    <div class="alert alert-danger" role="alert">
      @errorMsg
    </div>
  }

  <!-- 登录表单 -->
  @helper.form(action = routes.Admin.authenticate()) {
    @helper.CSRF.formField

    <!-- 用户名输入框 -->
    <div class="form-group">
      <label for="username">Username</label>
      <input type="text" id="username" name="username" value="@data("username").value.getOrElse("")" class="form-control">
      <!-- 隐式消息：展示表单字段的验证错误 -->
      @data("username").error.map { error =>
        <small class="text-danger">@Messages(error.message)</small>
      }
    </div>

    <!-- 密码输入框 -->
    <div class="form-group">
      <label for="password">Password</label>
      <input type="password" id="password" name="password" class="form-control">
      <!-- 隐式消息：展示表单字段的验证错误 -->
      @data("password").error.map { error =>
        <small class="text-danger">@Messages(error.message)</small>
      }
    </div>

    <button type="submit" class="btn btn-primary">Login</button>
  }
</body>
</html>

最终效果： #

• 当用户提交的表单字段不符合规则（比如用户名空、格式错误），会在对应字段下方显示隐式错误提示
• 当表单格式合法，但用户名/密码不匹配时，页面顶部会显示Flash错误提示

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