django-csrf使用和禁用

form表單使用csrf

a. 基本應用
    form表單中添加
    {% csrf_token %}

b. 全站禁用
    # 'django.middleware.csrf.CsrfViewMiddleware',

c. 局部禁用
    'django.middleware.csrf.CsrfViewMiddleware',
    
    from django.views.decorators.csrf import csrf_exempt

    @csrf_exempt
    def csrf1(request):

        if request.method == 'GET':
            return render(request,'csrf1.html')
        else:
            return HttpResponse('ok')
d. 局部使用
    # 'django.middleware.csrf.CsrfViewMiddleware',
    
    from django.views.decorators.csrf import csrf_exempt,csrf_protect

    @csrf_protect
    def csrf1(request):

        if request.method == 'GET':
            return render(request,'csrf1.html')
        else:
            return HttpResponse('ok')

ajax提交數據

Ajax提交數據時候,攜帶CSRF:
a. 放置在data中攜帶

<form method="POST" action="/csrf1.html">
    {% csrf_token %}
    <input id="user" type="text" name="user" />
    <input type="submit" value="提交"/>
    <a onclick="submitForm();">Ajax提交</a>
</form>
<script src="/static/jquery-1.12.4.js"></script>
<script>
    function submitForm(){
        var csrf = $('input[name="csrfmiddlewaretoken"]').val();
        var user = $('#user').val();
        $.ajax({
            url: '/csrf1.html',
            type: 'POST',
            data: { "user":user,'csrfmiddlewaretoken': csrf},
            success:function(arg){
                console.log(arg);
            }
        })
    }

</script>
                
b. 放在請求頭中
            
<form method="POST" action="/csrf1.html">
    {% csrf_token %}
    <input id="user" type="text" name="user" />
    <input type="submit" value="提交"/>
    <a onclick="submitForm();">Ajax提交</a>
</form>
<script src="/static/jquery-1.12.4.js"></script>
<script src="/static/jquery.cookie.js"></script>

<script>
    function submitForm(){
        var token = $.cookie('csrftoken');
        var user = $('#user').val();
        $.ajax({
            url: '/csrf1.html',
            type: 'POST',
            headers:{'X-CSRFToken': token},
            data: { "user":user},
            success:function(arg){
                console.log(arg);
            }
        })
    }
</script>
相關文章
相關標籤/搜索