javascript - 使用Ajax GET和POST类型调用相同的 Controller 方法

Question

嗨，我是Grails和Groovy的新手。请帮助我解决以下有关使用ajax调用来调用 Controller 方法的问题。
该代码背后的场景是，每当用户无法记住密码时，便使用用户名恢复密码。我在下面详细解释了代码流。
应用程序从下面的auth.gsp页开始:

<form action='${postUrl}' method='POST' id='loginForm' autocomplete='off'>
    <input type='text' name='j_username' id='username'/>
    <input type='password' name='j_password' id='password'/>
    <input type='submit' id="submit" value='${message(code: "default.button.login")}'/>
    <a href="#" id="recovery-link" recovery-url="<g:createLink controller='recoverPassword' action='recoverPassword'/>"><g:message code="etranscripts.forgotPassword"/></a>
</form>

当我单击 anchor 标记的“忘记密码”链接时，它将调用以下ajax方法:

<script>
$(document).ready(function () {
    $('#recovery-link').click(function () {
    var url = $(this).attr('recovery-url')

    $.ajax({
    url: url,
    dataType: "html"
    }).done(function (html) {
    $('#loginForm').replaceWith(html)
    $('#sign-in-instruct').text('<g:message code="js.resetEnterName"/>')
    }).fail(function (jqXHR, textStatus) {
    console.log("Request for url failed: " + url)
    })

    event.preventDefault()
    return false
    });
});

上述调用的 Controller 方法如下。

def recoverPassword = {
    println "RecoverPassword method of ctrl....."
    if (!request.post) {
        // show the form
        render(template: "recoverPassword" )
        return
    }
//some other stuff based on the input conditions.

上面的ajax调用成功的输出模板是:

<div id="recover-password" >
<ul>
    <li>
        <span><g:textField name="username" id="username" value="" /></span>
        <input type='submit' id="submit-username-link" recovery-url="<g:createLink controller='recoverPassword' action="recoverPassword"/>" value='Submit'/>
    </li>
</ul>

直到这里，我的代码才能完美运行。但是问题从这里开始。
即当我在模板的用户名字段中输入一些值并单击提交时，它应调用以下ajax方法。

$(document).on('click', '#submit-username-link', function (event) {

var url = $(this).attr('recovery-url')
var username = $('input#username').val();
$.ajax({
    url: url,
    type: "POST",
    data: {username:username},
    dataType: "json"
}).done(function (responseJson) {
    $('#sign-in-instruct').text(responseJson.message)
    $('div.copyright').css('margin','74px 0px 0px 140px')
    $('#home-link').show()
    if ( responseJson.status == 'success') {
        $('#recover-password').remove()
    }
}).fail(function (jqXHR, textStatus) {
    $('#recover-password').remove()
    $('#sign-in-instruct').text(textStatus)
    console.log("Failed to send the email " + textStatus)
})

event.preventDefault()
return false
});

事实是，url指的是 Controller 的相同方法，但唯一的变化是使用了POST类型，并且将在使用if条件的方法内部将其考虑在内(即 Controller 的其他一些东西)
这些GET和POST类型的方法调用按如下所示在URLMappings.groovy文件中进行配置。

"/recoverPassword/recoverPassword"(controller: 'recoverPassword') {
        action = [GET: "recoverPassword", POST: "recoverPassword"]
    }

这个问题的全部摘要是，对于相同的 Controller 方法，GET请求有效，但POST类型的ajax调用无法到达 Controller 的方法。

我在这里做错什么吗？请帮我解决这个问题。提前致谢 :-)

Answer 1

过于复杂。为什么不在 Controller 中为GET(呈现表单)使用单独的功能，而为POST(用于处理恢复密码)使用单独的功能呢？

还可以查询https://en.wikipedia.org/wiki/KISS_principle