问题:文件上传完成时如何调用JS回调?

我正在为带有 appengine 后端的应用创建前端上传。

我想做的是一个文件上传解决方案,我不想使用 plupload 或那些现成的解决方案。

我基本上将图像提交到 iframe,然后在上传时放置封面。然后在它完成后,我执行了一个 ajax 调用来获取下一个要渲染的视图的图像 ID。但是,总是在上传完成之前调用渲染,因此我没有从后端获取任何图像 ID。谁能帮忙?

这是我的上传代码

perform_input3:(event)=>
    event.preventDefault()
    $('#product-input-3').hide()
    $('#product-input-3').submit()
    $('#upload-cover').show()
    item_id = $('#item3_id').val()
    app.views.imageselect.render(item_id)

app.views.imageselect.render(item_id) 如下:

render:(data)=>
    @item_id = data
    item_id = @item_id
    $.ajax(
        url: '/get_image_list/'
        type: 'GET'
        dataType: 'json'
        data: {item_id: item_id}
        success:(data) =>
          @payload = data
          $(@el).append imageSelectTemplate(@payload)
          return @
    )

我不想使用 setTimeout 功能,因为它不会根据连接速度灵活。任何帮助将不胜感激 :)

解答

从本质上讲,您的问题归结为:您希望等待对服务器进行 Ajax 调用,直到您请求的数据可用。从服务器获取通知很棘手(取决于您的后端是如何实现的),因此解决问题的最佳方法可能是定期(例如每秒一次)进行 Ajax 调用,直到您从服务器获得成功的响应。

这是一些应该这样做的代码:

do ajaxCall = =>
  $.ajax
    url: '/get_image_list/'
    type: 'GET'
    dataType: 'json'
    data: {item_id: item_id}
    success: (data) =>
      @payload = data
      $(@el).append imageSelectTemplate(@payload)
    error: ->
      setTimeout ajaxCall, 1000