【问题标题】:Ajax, redirect and DELETEAjax、重定向和删除
【发布时间】:2014-10-08 16:00:25
【问题描述】:

为了遵守 Laravel 约定,我希望我的用户在使用销毁路由时发出 DELETE 请求。

为了避免在每个删除链接上设置繁琐的表单,我使用了这段 jQuery 代码,它将任何带有 method="delete" 属性的 atags 转换为 DELETE 请求:

$(function() {
  $("a[method='delete']").on('click', function(event) {
    event.preventDefault();
    target = this.getAttribute('href')
    request = new XMLHttpRequest()
    request.open('delete', target, false);
    request.send();
  });
});

这段代码几乎可以完成这项工作。但是,当我的控制器在销毁方法中处理 DELETE 请求时,它们应该重定向用户。例如,如果他破坏了一个资源,他应该被重定向到资源索引。

我正在尝试找到一种干净的方式来做到这一点,而无需使用特殊的 JSON 正文进行响应,而只需使用标准的 303 重定向。

你知道怎么做吗?

【问题讨论】:

标签: javascript jquery rest http laravel


【解决方案1】:

我不喜欢使用 Javascript 来执行此操作。相反,我使用Form 宏为我的 RESTful 资源插入删除按钮。 (我假设你有 destroy 方法的别名,或者使用 Laravel 的 Route::resource() 不带前缀,否则进行相应调整。)

Form::macro('delete', function($resource, $id) {

    $form_parameters = array(
        'method' => "DELETE",
        'url'    => URL::route("$resource.destroy", $id),
    );

    return Form::open($form_parameters)
            . Form::submit('Delete')
            . Form::close();
});

然后,使用刀片模板,我可以编写如下内容:

{{ Form::delete('post', 1) }}

最后,在假设的 post 控制器的 destroy 方法中正常执行 303 重定向。

return Redirect::to(URL::route('post.index'), 303);

【讨论】:

    【解决方案2】:

    我找到了一个可行的解决方案,它使 JavaScript 函数有点脏,但保持 HTML 的其余部分干净。它的工作原理是创建一个带有发布请求和隐藏方法属性的虚拟表单并提交它,从而处理请求并重定向用户。

    请记住,您必须在提交之前将表单附加到 DOM,否则某些浏览器会忽略表单提交。

    $(function() {
      $("a[method='delete']").on('click', function(event) {
    
        event.preventDefault();
        target = this.getAttribute('href')
    
        form_string = "<form method=\"POST\" action=\"" + target + "\" accept-charset=\"UTF-8\"><input name=\"_method\" type=\"hidden\" value=\"DELETE\"></form>"
    
        form = $(form_string)
        form.appendTo('body');
        form.submit();
      });
    });
    

    【讨论】:

    • 这就是我认为的一种可能的解决方法,只有我会使用form[0].submit(),并且我会编写代码以使提交不会被CSRF-rejected。
    猜你喜欢
    • 2021-09-09
    • 2015-03-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-07-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多