Question

我有一个简单的重置密码表单屏幕。当用户通过“恢复”按钮提交时，该页面会发布到http://localhost:8080/api/v1/accountmanagement/user/password_reset。在该端点中，验证用户的电子邮件，然后生成散列成链接的散列，该链接由系统通过电子邮件发送给用户。一切正常，就是这样，我想要发生的是当用户点击恢复按钮时，我希望它们保留在恢复密码页面上。我打算做的只是取消隐藏一句“谢谢你提交恢复密码请求等”。显示div不是问题（可能使用普通的javascript - 我没有js框架 - 也许使用jQuery），只是当用户点击恢复按钮时，帖子请求转到其余的api因此更改正在显示的页面。

我尝试在表单中添加target="_blank"，但它无效。我的前端只用html和thymeleaf编写。

可能有一个简单的解决方案，我只是缺少。

resetPassword.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
  <title>Reset Password</title>
  <link href="css/main.css" rel="stylesheet"/>
</head>
<body>

<div>
  <div>
    <h2>Recover your password</h2>
    <p>To recover your password follow the instructions below to reset your password.</p>
  </div>

  <form th:action="@{/api/v1/accountmanagement/user/password_reset}" method="post"
        id="resetPasswordForm" th:object="${account}" target="_blank">
    <div id="field_email">
      <label for="email">Enter your email address :</label>
      <p>Enter the email address with your account.</p>
      <div><input type="text" id="email" name="email" th:field="*{email}"/></div>
    </div>

    <div id="successRecover" style="display: none;">
      An email has been sent to your email address. The email contains instructions to reset your password.
    </div>
    <div th:if="${param.error}" class="login-panel_error error">Error.</div>
    <div>
      <button type="submit" class="btn-primary">
        <i class="fa fa-spin fa-spinner hidden"></i>
        <span>Recover</span>
      </button>
    </div>
  </form>
</div>

</body>
</html>

PasswordManagementController.java

@Controller
@RequestMapping("/api/v1/accountmanagement")
public class PasswordManagementController {

    @Autowired
    private PasswordResetService passwordResetService;

    private Logger LOG = LoggerFactory.getLogger(this.getClass());

    @RequestMapping(value = "/user/password_reset", method = RequestMethod.POST)
    public ResponseEntity processResetPassword(@ModelAttribute(value = "account") Account account,
                                               BindingResult result, HttpServletRequest request) {
        LOG.info("account email " + account.getEmail());

        // build the hash here for hashUrl

        if (account != null) {
            if (!StringUtil.isBlank(account.getEmail())) {
                try {
                    passwordResetService.processResetPassword(account, hashUrl);
                } catch (AccountConfigException ace) {
                    // deal with exception here.
                    // return
                } catch (Exception e) {
                    // deal with exception here.
                    // return
                }
                return new ResponseEntity(HttpStatus.OK);
            } else {
                // deal with an exception here.
                // return
            }
        } else {
            // deal with an exception here.
            // return
        }
    }
}

Answer 1

如果您在成功请求的情况下返回ResponseEntity，您确实会被重定向。我不知道你如何处理错误，但你可能想要做的是将控制器方法的返回类型更改为String。这样，您可以在成功响应的情况下重定向到同一页面，同时将boolean值传递给将决定呈现successRecover div的模型，而无需任何Javascript。

新处理程序：

@RequestMapping(value = "/user/password_reset", method = RequestMethod.POST)
public String processResetPassword(@ModelAttribute(value = "account") Account account, Model model) {
    // build the hash here for hashUrl
    try {
        passwordResetService.processResetPassword(account, hashUrl);
    } catch (AccountConfigException ace) {
        // deal with exception here.
        // return
    } catch (Exception e) {
        // deal with exception here.
        // return
    }
    model.addAttribute("isOK", true);

    return "index";
}

然后在视图中：

<div id="successRecover" th:if="${isOK}">
    An email has been sent to your email address. The email contains instructions to reset your password.
</div>

提交帖子请求，但使用spring mvc

1 个答案: