hello, I have an ajax request that sends a file to django, it is saying 
that the csrf token is missing but i copied my other ajax request that are 
working. I'm sure it has something to do with trying to pass a file to 
upload.

I get a 403 and csrf missing return.

base.html

    <script type='text/javascript' src=
'http://code.jquery.com/jquery-1.8.2.js'></script>
    <script type="text/javascript">
        $(document).ready(function() {  
                    $("#create_token").click(function() {
                            var username = 
document.getElementById("username").value;
                            $.ajax({
                                url : "/gettoken/", 
                                type : "POST",
                                dataType: "json", 
                                data : {
                                    csrfmiddlewaretoken: '{{ csrf_token }}',
                                    create_token: 'create_token',
                                    username: username,
                                    },
                                    success : function(json) {
                                        
document.getElementById('output').innerHTML = ('Token: ' + json['token']);
                                    },
                                    error : function(xhr,errmsg,err) {
                                        console.log(xhr.status + ": " + 
xhr.responseText);
                                        
document.getElementById('output').innerHTML = "Token:" + " Request Failed.";
                                    }
                                    
                            });
                            return false;  
                    }); 
    
                    $("#add_friend").click(function() {
                            var token = 
document.getElementById("friend_token").value;
                            $.ajax({
                                url : "/addfriend/", 
                                type : "POST",
                                dataType: "json", 
                                data : {
                                    csrfmiddlewaretoken: '{{ csrf_token }}',
                                    add_friend: token,
                                    },
                                    success : function(json) {
                                        
document.getElementById('output').innerHTML = (json['message']);
                                    },
                                    error : function(xhr,errmsg,err) {
                                        console.log(xhr.status + ": " + 
xhr.responseText);
                                        
document.getElementById('output').innerHTML = "Request Failed.";
                                    }
                                    
                            });
                            return false;  
                    }); 
    
                    $("#uppropic").click(function() {
                            var file = 
document.getElementById("profile_pic").files[0];
                            console.log(file);
                            $.ajax({
                                url : "profilepic/", 
                                type : "POST",
                                dataType: "json", 
                                processData: false,
                                data : {
                                    csrfmiddlewaretoken: '{{ csrf_token }}',
                                    profile_pic: file,
                                    },
                                    success : function(json) {
                                        
document.getElementById('output').innerHTML = (json['message']);
                                    },
                                    error : function(xhr,errmsg,err) {
                                        console.log(xhr.status + ": " + 
xhr.responseText);
                                        
document.getElementById('output').innerHTML = " Request Failed.";
                                    }
                                    
                            });
                            return false;  
                    }); 
                    
                                                            
                });



home.html

    {% extends "base.html" %}
    {% block title %}
    {% for user in user_data %}
        {{user.username}}
    {%endfor%}
    {% endblock %}
    {% block content %}
        {% for user in user_data %}
            Username: {{user.username}}<br>
            First Name: {{user.first_name}}<br>
            Last Name: {{user.last_name}}<br>
            About: {{user.about}}<br>
            Title: {{user.title}}<br>
        {%endfor%}
        Friends:
        {% for friend in friend_data %}
            {{friend}}<br>
        {%endfor%}
                {% if is_user_profile %}
            <form method='POST' >
            {% csrf_token %}
            <input type='text' name='friend_token' id='friend_token'>
            <button id='add_friend' name = 'add_friend' value='add_friend' > 
Add Friend </button>
            </form>
            
            <form method='POST' >
            {% csrf_token %}
            <button id='create_token' name = 'create_token' value=
'create_token' > Create Token </button>
            {% for user in user_data %}
            <input type='hidden' id='username' value='{{user.username}}'>
            {%endfor%}
            </form>
             
             <p id='output'>
             </p>
             {%endif%}
             
             <form method='POST'>
            {% csrf_token %}
            <input type='file' name='profile_pic' id='profile_pic'>
            <button id='uppropic'> Upload Profile Pic</button>
            {% for user in user_data %}
            <input type='hidden' id='username' value='{{user.username}}'>
            {%endfor%}
            </form>
             
        <a href="/logout/">Logout</a>
    {% endblock %}



views.py

    @login_required  
    @csrf_protect       
    def upload_profilepic(request):
        context = {}
        if request.method == 'POST':
            post_data = request.POST.copy()
            profile_pic = post_data['profile_pic']
            print post_data, profile_pic
            handle_uploaded_file(request.FILES['file'])
            context.update({'message':'You must select a file to upload.'})
            return HttpResponse(simplejson.dumps(context), content_type=
'application/json')   
        else:
            context.update({'message':'You must select a file to upload.'})
            return HttpResponse(simplejson.dumps(context), content_type=
'application/json')   



consoleoutput

    File { name: "10923328_1112855418728180_5377511192406844214_n.png", 
lastModified: 1421116207673, lastModifiedDate: Date 2015-01-13T02:30:07.673Z
, size: 664332, type: "image/png" } home:56
    "403: 
    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta http-equiv="content-type" content="text/html; charset=utf-8">
      <meta name="robots" content="NONE,NOARCHIVE">
      <title>403 Forbidden</title>
      <style type="text/css">
        html * { padding:0; margin:0; }
        body * { padding:10px 20px; }
        body * * { padding:0; }
        body { font:small sans-serif; background:#eee; }
        body>div { border-bottom:1px solid #ddd; }
        h1 { font-weight:normal; margin-bottom:.4em; }
        h1 span { font-size:60%; color:#666; font-weight:normal; }
        #info { background:#f6f6f6; }
        #info ul { margin: 0.5em 4em; }
        #info p, #summary p { padding-top:10px; }
        #summary { background: #ffc; }
        #explanation { background:#eee; border-bottom: 0px none; }
      </style>
    </head>
    <body>
    <div id="summary">
      <h1>Forbidden <span>(403)</span></h1>
      <p>CSRF verification failed. Request aborted.</p>
    
    
    </div>
    
    <div id="info">
      <h2>Help</h2>
        
        <p>Reason given for failure:</p>
        <pre>
        CSRF token missing or incorrect.
        </pre>
        
    
      <p>In general, this can occur when there is a genuine Cross Site 
Request Forgery, or when
      <a
      
href='http://docs.djangoproject.com/en/dev/ref/contrib/csrf/#ref-contrib-csrf'>Django's
      CSRF mechanism</a> has not been used correctly.  For POST forms, you 
need to
      ensure:</p>
    
      <ul>
        <li>Your browser is accepting cookies.</li>
    
        <li>The view function uses <a
        
href='http://docs.djangoproject.com/en/dev/ref/templates/api/#subclassing-context-requestcontext'><code>RequestContext</code></a>
        for the template, instead of <code>Context</code>.</li>
    
        <li>In the template, there is a <code>{% csrf_token
        %}</code> template tag inside each POST form that
        targets an internal URL.</li>
    
        <li>If you are not using <code>CsrfViewMiddleware</code>, then you 
must use
        <code>csrf_protect</code> on any views that use the 
<code>csrf_token</code>
        template tag, as well as those that accept the POST data.</li>
    
      </ul>
    
      <p>You're seeing the help section of this page because you have 
<code>DEBUG =
      True</code> in your Django settings file. Change that to 
<code>False</code>,
      and only the initial error message will be displayed.  </p>
    
      <p>You can customize this page using the CSRF_FAILURE_VIEW 
setting.</p>
    </div>
    
    </body>
    </html>
    "



-- 
You received this message because you are subscribed to the Google Groups 
"Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email 
to django-users+unsubscr...@googlegroups.com.
To post to this group, send email to django-users@googlegroups.com.
Visit this group at http://groups.google.com/group/django-users.
To view this discussion on the web visit 
https://groups.google.com/d/msgid/django-users/3f57f4f8-5f92-403b-950c-c6a524dceb38%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply via email to