title: Django: Form submission in ajax style without csrf token
body: <p>I am new to django. Suppose I have a form and I would like to submit a file to the server in ajax.</p>
  
  <p>I notice that the server has HTTP 403 error when I don't specify the csrf token in the post statement (correct behaviour), but somehow the file can still be able to upload to the server...</p>
  
  <p>Here is my sample code:</p>
  
  <p>models.py (include model and form):</p>
  
  <pre><code>from django.db import models
  from django.forms import ModelForm
  
  # Create your models here.
  class Dummy(models.Model):
      myfile = models.FileField(upload_to='temp')
  
  class DummyForm(ModelForm):
      class Meta:
          model = Dummy
          fields = ['myfile',]
  </code></pre>
  
  <p>views.py:</p>
  
  <pre><code># Create your views here.
  class TestFormView(View):
  def get(self, request):
      form = DummyForm()
  
      context = { 'form' : form }
      print form
      return render(request, 'testform.html', context)
  
  def post(self, request):
      print request.FILES
      form = DummyForm(request.POST, request.FILES)
      print form.is_valid()
      print form.errors
      print form.is_bound
      if form.is_valid():
          form.save()
  
      print Dummy.objects.all().count()
      return render(request, 'testform.html')
  </code></pre>
  
  <p>testform.html:</p>
  
  <pre><code>&lt;form id="myForm" action="testform/" method="post" enctype="multipart/form-data"&gt;
  {% csrf_token %}
   &lt;input id="id_myfile" type="file" size="60" name="myfile"&gt;
   &lt;input type="submit" value="Ajax File Upload"&gt;
  &lt;/form&gt;
  
  &lt;div id="progress"&gt;
      &lt;div id="bar"&gt;&lt;/div&gt;
      &lt;div id="percent"&gt;0%&lt;/div &gt;
  &lt;/div&gt;
  &lt;br/&gt;
  
  &lt;div id="message"&gt;&lt;/div&gt;
  
  &lt;script&gt;
  $(document).ready(function()
  {
  
  var options = {
  beforeSend: function()
  {
      $("#progress").show();
      //clear everything
      $("#bar").width('0%');
      $("#message").html("");
      $("#percent").html("0%");
  },
  uploadProgress: function(event, position, total, percentComplete)
  {
      $("#bar").width(percentComplete+'%');
      $("#percent").html(percentComplete+'%');
  
  },
  success: function()
  {
      $("#bar").width('100%');
      $("#percent").html('100%');
  
      alert("done!");
  
  },
  complete: function(response)
  {
      $("#message").html("&lt;font color='green'&gt;"+response.responseText+"&lt;/font&gt;");
  },
  error: function()
  {
      $("#message").html("&lt;font color='red'&gt; ERROR: unable to upload files&lt;/font&gt;");
  
  }
  
  };
  
   $("#myForm").ajaxForm(options);
  
   $("#myForm").submit(function(event) {
      event.preventDefault();
  
      var $form = $(this);
      var url = $form.attr('action');
  
      $.post("testform/", { myfile: $('#myfile').val()});
  
      return false;
  
   });
  
  });
  
  &lt;/script&gt;
  </code></pre>
  
  <p>Of course if I put the csrf token in the $post function, I get HTTP 200.</p>
  
  <p>My concern is that will this create security hole because it looks like anyone can upload files to the server?</p>
  
  <p>Thanks!</p>