Блог

Я следую руководству django-editorjs (пакет django) по https://medium.com/analytics-vidhya/integrating-editorjs-with-django-7a30127d0771 . Всякий раз, когда я пытаюсь загрузить изображение, я получаю эту ошибку csrf: Запрещено (токен CSRF отсутствует или неверен.): /media/ImageUpload/ Я настроил корень и URL-адрес носителя, и я могу просмотреть образец изображения, из которого он был получен ‘http://127.0.0.1:8000/media/imageUpload/example.jpg «и, похоже, это работает на средства массовой информации. Однако в этом руководстве используется загрузка изображений с помощью @exempt_csrf и @require_csrf_token, и, похоже, это вызывает проблему csrf. Я пробовал обходные пути (например: https://github.com/editor-js/image/issues/45 ), добавляя дополнительные запросы с помощью токена csrf, но он продолжает показывать ту же ошибку.

Вот мой код:

#urls.py (приложение)

 from django.urls import path, include
from .views import upload_image_view
from django.views.decorators.csrf import csrf_exempt, csrf_protect

urlpatterns = [
    path('imageUpload/', csrf_exempt(upload_image_view)),
]
 

#urls.py (проект)

 from django.conf import settings
from django.conf.urls.static import static
from django.contrib import admin
from django.urls import path, include
from django.views.generic.base import TemplateView

urlpatterns = [
    path('post/', include('post.urls'), name='post'),
    path('', TemplateView.as_view(template_name='home.html'), name='home'),
]

if settings.DEBUG:
    urlpatterns  = static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
    urlpatterns  = static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
 

#views.py (функциональная часть)

 from django.shortcuts import render, get_object_or_404, reverse, redirect
from django.http import HttpResponse, HttpResponseRedirect, JsonResponse
from django.views.decorators.csrf import ensure_csrf_cookie, requires_csrf_token, csrf_exempt
from django.core.files.storage import FileSystemStorage

@requires_csrf_token
def upload_image_view(request):
    f=request.FILES['image']
    fs = FileSystemStorage()
    filename = str(f).split('.')[0]
    file = fs.save(filename, f)
    fileurl = fs.url(file)
    
    return JsonResponse({'success' :1, 'file': {'url': fileurl }})
 

#models.py

 class Post(models.Model):
    title = models.CharField(max_length=200)
    desc = EditorJsField(
        editorjs_config={
            "tools": {
                "Table": {
                    "disabled": False,
                    "inlineToolbar": True,
                    "config": {"rows": 2, "cols": 3,},
                },
                "Image": {
                    "config" : {
                        "endpoints": {
                            "byFile" : 'http://127.0.0.1:8000/media/imageUpload/',
                            "byUrl": 'http://localhost:8000/media/imageUpload/',
                        },
                        "additionalRequestHeaders":[{"Content-Type":'multipart/form-data', "X-CSRF-TOKEN": "{{csrf_token}}" }] #setting it as token(like example from github) won't work because it shows error that it is not defined. I don't know how to call from models.py any idea?
                    }
                }
            }
        }
    )
 

Я пробовал другие варианты x-csrf-token, такие как call token, и использовал ‘const csrftoken = getCookie (‘csrftoken’);’ В javascript и т. Д., Но я продолжаю пытаться выяснить.

Есть идеи?

Оказывается, пересмотр конечной точки решил проблему. Ранее я использовал полный URL папки мультимедиа, например ‘http://127.0.0.1:8000/media/imageUpload /’. Это дало мне запрещенную ошибку csrf. Я также пытался использовать ‘/ ImageUpload /’, но это выдало мне ошибку ‘не найдено’. Поскольку существует основной проект и выполняется приложение post, мне пришлось указать маршрут следующим образом: ‘/post/ImageUpload /’