Django，如何处理获取请求

Question

I'm working on a Django project that uses a flatbed scanner. Since scanning takes a long time I must work around getting a timeout error. After searching and trying multiple things I ended up with threading an a fetch call.

How do I alter the fetch call to do what I want? I currently get send to a blank page that shows the dictionary that was returned by free_scan_crop . Please note that I am new to JavaScript. I just copied this bit of JS.

What I would like to happen:

• A modal shows up when the form is submitted
• When the scanner is done: send user to home page and show message

scan.html

<div class="modal fade" id="scanDocument" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="staticBackdropLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="staticBackdropLabel">Scanning</h5>
      </div>
      <div class="modal-body">
        Please wait...
      </div>
    </div>
  </div>
</div>

<script>
  formElem.onsubmit = async (e) => {
    e.preventDefault();

    let response = await fetch("{% url 'core:free_scan' %}", {
      method: 'GET',
      body: new FormData(formElem)
    });

    let result = await response.json();

    alert(result.message);
  };
</script>

views.py

def free_scan_crop(request):

    form = FreeScanForm(request.GET)
    if form.is_valid():
        file_name = form.cleaned_data['file_name']
        # Grab the rest of the fields from the form...

        x = threading.Thread(
            target=scan_crop,
            args=(request, file_name, top_left_x, top_left_y, bottom_right_x, bottom_right_y, dpi),
        )
        return x.start()  # Questions: is this correct?

        return JsonResponse({"scanning": True})

    # invalid form
    return JsonResponse({"scanning": False})

def scan_crop(request, file_name, top_left_x, top_left_y, bottom_right_x, bottom_right_y, dpi):

    # This method runs for a long time
    image = ScannerServiceConnection().scan_roi(
        top_left_x,
        top_left_y,
        bottom_right_x,
        bottom_right_y,
        dpi
    )

    if image is None:
        # No connection to the scanner
        messages.error(request, 'Check scanner service status')
    else:
        # store image
        image.save(<file_path>)
        messages.success(request, 'saved image')

    # Please note that I want to send a message to the user to inform them on the status of the scan
    return render(request, 'home.html')

Answer 1

A special thanks to vlaz for helping out via the JS chat.

The fetch call is now working like it should. I couldn't get fetch to show the modal so made a little function to do that.

The scanner is running as a service via rpyc . I had to disable the timeout setting to keep it from throwing timeout errors. Note, this Django application runs offline on the user's system.

rpyc.connect(
    host="localhost",
    port=18861,
    config={'sync_request_timeout': None},
)

scan.html

<form class="form" action="" method="post" id="free_scan_from">

{% csrf_token %}

{% bootstrap_form form %}

{% buttons %}
<button type="submit" id="save_button" class="btn btn-primary" onclick="modalFunction()" name="action"
  value="save_crop">
  <i class="fa fa-save"></i> Scan & Save
</button>
{% endbuttons %}

</form>


<script>
  // show the modal when the file_name field has a value
  function modalFunction() {
    if (document.getElementById("id_file_name").value !== "") {
      $('#scanBanknote').modal('show');
    }
  }
</script>

<script>
  const formElem = document.querySelector("free_scan_from")
  formElem.onsubmit = async (e) => {

    e.preventDefault();

    let response = await fetch("{% url 'core:free_scan' %}", {
      //cannot have a body with GET
      method: 'POST',
      body: new FormData(formElem)
    });

    let result = await response.text();

    alert(result);
  };
</script>

views.py

def free_scan_crop(request):
    form = FreeScanForm(request.POST)
    if form.is_valid():
        file_name = form.cleaned_data['file_name']
        # grab the rest of the fields

        image = ScannerServiceConnection().scan_roi(
            top_left_x,
            top_left_y,
            bottom_right_x,
            bottom_right_y,
            dpi
        )

        if image is None:
            messages.error(request, 'Check scanner service status')
        else:
            # store image
            image.save(<file_path>)
            messages.success(request, 'image saved')

        return render(request, 'free_scan_preview.html')

    # invalid form
    context = {'form': form}
    return render(request, "free_scan_crop.html", context)