title: how can I solve csrf verification failed
body: <p>I'm trying to create form that uploads a zip file to the server. But everytime I click the submit I keep getting <code>CSRF verification failed</code> error. This is my html code:</p>
  
  <pre><code>&lt;form method="POST" name="form-import-file" enctype="multipart/form-data"&gt;
      &lt;div&gt;
          &lt;input type="file" id="file" name="file" accept=".zip"/&gt;
          &lt;input type="submit" value="Upload file"&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  &lt;div class="url-csrf" data-csrf="{{ csrf_token }}"&gt;&lt;/div&gt;
  &lt;div class="url-import-file" data-url-import-file="{% url 'intent:import_file' %}"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>In my .js code:</p>
  
  <pre><code>$("form[name='form-import-file']").submit(function(e) {
      var formData = new FormData($(this)[0]);
      alert(formData);
      var json_data = {'csrfmiddlewaretoken' : $('.url-csrf').attr('data-csrf'), 'file': formData };
      $.ajax({
          url: $('.url-import-file').attr('data-url-import-file'),
          type: "POST",
          data: json_data,
          success: function (msg) {
              alert(msg)
          },
          cache: false,
          contentType: false,
          processData: false
      });
     e.preventDefault();
  });
  </code></pre>