Запрещено (CSRF-токен отсутствует или неверен.): /audio

У меня есть сайт с кнопкой для загрузки аудио mp3 на пост. проблема, когда я нажимаю на кнопку, она открывает новый / (http://localhost:8000/audio) на самом деле просто http://localhost:8000. и когда я вижу terimal, есть сообщение об ошибке

Запрещено (CSRF-токен отсутствует или неверен.): /audio

в то же время на моем сайте возникает ошибка с сообщением об ошибке

Запрещено (403) Проверка CSRF не удалась. Запрос прерван.

Help Причина отказа:

CSRF-токен отсутствует или неверен. В общем, это может произойти, когда существует настоящая подделка межсайтовых запросов, или когда механизм CSRF в Django был использован неправильно. правильно. Для POST форм вам необходимо убедиться в том, что:

Ваш браузер принимает cookies. Функция view передает запрос в метод render шаблона. В шаблоне есть {% csrf_token %} внутри каждой POST-формы, которая нацелена на внутренний URL. внутренний URL. Если вы не используете CsrfViewMiddleware, то вы должны использовать csrf_protect для всех представлений, которые используют тег шаблона csrf_token, а также а также в тех, которые принимают данные POST. Форма имеет действительный CSRF токен. После входа в систему на другой вкладке браузера или нажатия кнопки назад после входа в систему, вам может потребоваться перезагрузить страницу с формой, поскольку после входа в систему маркер сменяется. Вы видите раздел справки раздел этой страницы, потому что у вас установлено DEBUG = True в вашем Django файл настроек. Измените это значение на False, и только начальное сообщение об ошибке будет отображаться только начальное сообщение об ошибке.

Вы можете настроить эту страницу, используя параметр CSRF_FAILURE_VIEW.

я хочу, чтобы я мог загрузить файл песни mp3 с помощью django без базы данных (только локально). и песня может быть определена информацией, такой как исполнитель, продолжительность, жанр, и т.д.

и вот мой код: 

urls.py
from django.contrib import admin
from django.conf.urls import url
from . import views
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from django.urls import path, re_path
from django.conf import settings
from django.conf.urls.static import static


urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^decode/$', views.decode),
    url(r'^$', views.homepage),
    path('audio', views.Audio_store),
]

urlpatterns += staticfiles_urlpatterns()

views.py:

from django.http import HttpResponse
from django.shortcuts import render
from django.views.decorators.csrf import ensure_csrf_cookie
from subprocess import call
from django.core.files import File
from django.views.decorators.csrf import csrf_exempt
import subprocess
from MusicLockApp.forms import AudioForm

@ensure_csrf_cookie
def homepage(request):
    # return HttpResponse('homepage')
    return render(request, 'homepage.html')

def decode(request):
    # return HttpResponse('about')
    return render(request, 'decode.html')

    #@csrf_exempt
def obfuscate(request):
    print("HI")
    if request.method == 'GET':
        return HttpResponse("Hi")

    if request.method == 'POST':
        print("files: " + str(request.FILES))
        print("posts: " + str(request.POST))

        if len(request.POST) > 0:
            handle_uploaded_file(request.FILES['audio_file'])

    return HttpResponse("The form was valid!")

def handle_uploaded_file(f):
    with open('temp.mp3', 'wb+') as destination:
        for chunk in f.chunks():
            destination.write(chunk)

    subprocess.check_call("ffmpeg -y -i temp.mp3 temp.wav", shell=True)

def Audio_store(request):
    if request.method == 'POST':
        form = AudioForm(request.POST, request.FILES or None)
        if form.is_valid():
            form.save()
            return HttpResponse('SUKSES BRUH')
    else:
        form = AudioForm()
    return render(request, 'homepage.html', {'form' : form})

models.py:

from django import forms
from django.db import models

class Audio_store(models.Model):
    record=models.FileField(upload_to='media/mp3')
    class Meta:
        db_table='Audio_store'

forms.py:

from django import forms 
from MusicLockApp.models import *

class AudioForm(forms.ModelForm):
    class Meta:
        model=Audio_store
        fields=['record']

добавьте settings.py:

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, 'assets'),
)

MEDIA_URL = '/mp3/'

MEDIA_ROOT = os.path.join(BASE_DIR, 'mp3')

сценарий домашней страницы.html:

<script>
        var file = undefined;
        var audio_formats = ["mp3"];
        
        // using jQuery
        function getCookie(name) {
          var cookieValue = null;
        
          if (document.cookie && document.cookie !== '') {
            var cookies = document.cookie.split(';');
            for (var i = 0; i < cookies.length; i++) {
              var cookie = jQuery.trim(cookies[i]);
              // Does this cookie string begin with the name we want?
              if (cookie.substring(0, name.length + 1) === (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                break;
              }
            }
          }
        
          return cookieValue;
        }
        
        function fileAdded() {
          var x = document.getElementById("audio-file");
          file = x.files[0];
          var msg = document.getElementById("message");
        
          if (file != undefined) {
            x = file.name.split(".");
            var ext = x[x.length - 1];
        
            if (audio_formats.indexOf(ext) == -1) {
              msg.innerHTML = ext + " is not an audio file!";
            } else {
              msg.innerHTML = file.name + " has been successfully added!";
            }
          } else {
            msg.innerHTML = "Please select an audio file to obfuscate!";
          }
        }
        
        function obfuscate() {
          if (file == undefined)
            alert("Choose an audio file!");
          else {
            var obfuscateButton = document.getElementById("obfuscate-button");
            obfuscateButton.innerHTML = "Proccessing...";
            var xhr = new XMLHttpRequest();
            var url = "http://127.0.0.1:8000/obfuscator/obfuscate/";
            var method = 'POST';
            xhr.onreadystatechange = function() {
              if(xhr.readyState === 4 && xhr.status === 200) {
                  obfuscateButton.innerHTML = "Done!"
              }
            }
            xhr.open(method, url, true);
        
            xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
        
            var formData = new FormData();
            formData.append("audio_file", file);
            formData.append("file_name", file.name)
            xhr.send(formData);
          }
        }
        </script>


.dsnupload {
    background-color: #fbc786;
    color: white;
    text-align: center;
    font-weight: bold;
    padding: 20px;
}

.dsnupload:hover {
    background-color: #c88f5c;
    color: white;
    font-weight: bold;
    text-align: center;
}
<div class="row" style="margin-right: 10px;">
                            <form action="audio" method="post" enctype="multipart/form-data">
                            {% csrf_token %^}
                            {{ form }}
                            <button type="submit" class="dsnupload" id="audio-file" onchange="fileAdded()">
                                <i class="large material-icons" style="font-size: 50pt; margin-top: 10px;">audiotrack</i>
                                <p style="font-weight: bold; color: white;">Insert file audio (mp3)</p>
                            </button>
                            <p id="message"></p>
                            </form>
                        </div>

Вернуться на верх