【问题标题】:how so I respond to user while POST is processing?如何在 POST 处理时回复用户?
【发布时间】:2014-07-05 03:15:19
【问题描述】:

我有一个表单,它接受一个 json 文件并 POST 到服务器端进程。这是一个漫长的过程,我想通过多条消息将其进度实时反馈给用户。

我有什么选择?

此过程可能需要 10-15 分钟或更长时间。我不是在寻找答案“AJAX”。不止于此。

这是我得到的表格:

    <form method="POST" accept-charset="UTF-8" class="smart-form" id="import-course" enctype="multipart/form-data">
        <fieldset>
            <div class="row">
                <section class="col col-md-12">
                    <label class="input input-file">
                        <input class="button" name="import" type="file">
                    </label>
                </section>
            </div>
        </fieldset>
        <footer>
            <button class="btn btn-primary" id="submit-import-file" type="button">Save</button>
            <a onclick="history.back();" class="btn btn-default">Cancel</a>
        </footer>
     </form>

这是我的 ajax:

$(document).ready(function(){
        $("#submit-import-file").on('click',function(){
            console.log('click');
            $('#import-course').hide();
            var formData = new FormData($('#import-course')[0]);
            $.ajax({
                url: '{{URL::route("courses.import")}}',  //Server script to process data
                type: 'POST',
                xhr: function() {  // Custom XMLHttpRequest
                    var myXhr = $.ajaxSettings.xhr();
                    if(myXhr.upload){ // Check if upload property exists
                        myXhr.upload.addEventListener('progress',progressHandlingFunction, false); // For handling the progress of the upload
                    }
                    return myXhr;
                },
                //Ajax events
                success: function(data){
                    console.log(data);
                },
                // Form data
                data: formData,
                //Options to tell jQuery not to process data or worry about content-type.
                cache: false,
                contentType: false,
                processData: false
            });
        });
    });

function progressHandlingFunction(e){
    console.log(e);
}

这是我的服务器端注意的cmets。

$errors = 0;
$file = Input::file('import');
$fileName = $file->getClientOriginalName();
$destinationPath = app_path()."/storage/files/";
$file->move($destinationPath, $fileName);
$course = json_decode(File::get($destinationPath.$fileName));
if(!File::isDirectory($destinationPath.$course->code)){
    File::makeDirectory($destinationPath.$course->code,0777,true,true);
    //message back directory created
}
foreach($course->file as $file){
    if(FileManger->processfile($file)){
        //message back $file->name imported
    }else{
       //message back error importing $file->name
    }
}
return "import complete";

所以现在.. 在此过程中,我如何将评论区域发送回用户。不是之后。

【问题讨论】:

  • 了解异步性,实现一个简单的 JS 解决方案,享受 - 将是我的建议选项
  • 即使使用 AJAX,当您使用 return 时,您也会在过程中的某个时刻收到 1 个响应。这不是我要找的。这些过程最多可能需要 10-15 分钟。
  • 我已经使用 AJAX 来发布数据并在流程完成时做出响应。问题是,如果我尝试在进程内的点发回多条消息,ajax 调用将在第一个停止。

标签: php post


【解决方案1】:

您应该使用Ajax 将数据发布到php 页面而不刷新。下面的代码将显示“正在加载”,直到 ajax 调用完成。您可以使用 gif 或其他东西。完成进度条/百分比更难,但您可以将此答案作为参考。 PHP Ajax Upload Progress Bar

$.ajax({
  url: "domain.com/url",
  type: "POST", 
  data: data, 
  cache: false,
  beforeSend: function() {
    $('#response').html("Loading");
  },
  success: function(data) {
    $('#response').html(data);
  }
}

【讨论】:

  • 我不是在寻找上传进度条,因为无法衡量 100%。文件本身只需几秒钟即可上传。是文件的处理需要很长时间。
  • 明白,所以我提供的代码就足够了。但是您必须阅读一些有关如何执行 Ajax 调用的信息,或者向我们提供一些代码来帮助您。
【解决方案2】:

您仍然可以使用 jquery 进度条。将处理进度写入 UI,并根据处理进度计算某种形式的百分比。当然,这假设处理过程不止一个步骤......!一步从 0 到 100% 的进度条并不是很有用。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-10-30
    • 2017-08-24
    • 1970-01-01
    • 2012-10-20
    • 1970-01-01
    • 2017-10-03
    相关资源
    最近更新 更多