Django CKEditor 图片上传没有出现

Question

这是 Django Ckeditor image browser not finding images 的副本，但我认为那里的答案是错误的（其中有一个明显的错误，其中有一个未定义的变量，更不用说缺少 Python 缩进了） .

我正在使用 Django CKEditor 5.0.3 和 Django 1.9.6。我可以在我的管理员中上传图片，但它们在管理员中显示为红色 X，并且不会出现在我的网站上。

我还在为 MEDIA_ROOT 之类的东西苦苦挣扎，但我想我做对了：

STATIC_URL = '/static/'

STATICFILES_DIRS = (
    os.path.join(BASE_DIR, "static"),
)

MEDIA_URL = "image_upload/"
MEDIA_ROOT = os.path.join(BASE_DIR, "image_upload")

CKEDITOR_UPLOAD_PATH = 'uploads/'
CKEDITOR_IMAGE_BACKEND = "pillow"
CKEDITOR_UPLOAD_SLUGIFY_FILENAME = False

我的 urls.py，包括我尝试清理链接的答案：

from django.conf import settings
from django.conf.urls import url, include
from django.conf.urls.static import static
from django.contrib import admin
from mainsite.views import HomepageView, AboutView, ContactView
from django.contrib.staticfiles.urls import staticfiles_urlpatterns

urlpatterns = [
    url(r'^admin/', admin.site.urls, name="admin"),
    url(r'^$', HomepageView.as_view(), name="homepage"),
    url(r'^about/', AboutView.as_view(), name="about"),
    url(r'^contact/', ContactView.as_view(), name="contact"),
    url(r'^blog/', include("blog.urls", namespace="blog")),
    url(r'^ckeditor/', include('ckeditor_uploader.urls')),
]

urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

if settings.DEBUG:
    urlpatterns += [
        url(r'^media/(?P<path>.*)$',
            'django.views.static.serve', {
                'document_root': settings.MEDIA_ROOT,
            }
        ),
    ]

urlpatterns += staticfiles_urlpatterns()

Answer 1

使用 CKEDITOR_UPLOAD_PATH = 'uploads/' 使 django-ckeditor 将图像上传到 /media/uploads/，例如：

settings.py:

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static/'),
]
STATIC_URL = '/static/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media/')
MEDIA_URL = '/media/'
CKEDITOR_UPLOAD_PATH = 'uploads/'

当使用 Django 的开发服务器时，默认提供静态文件而不是媒体文件，因此您可以强制服务器考虑它们，下面的 url 配置应该有效。

urls.py:

from django.conf.urls import url, include
from django.contrib import admin
from django.conf import settings
from django.views.static import serve
from .views import HomeView

urlpatterns = [
    url(r'^admin/', admin.site.urls),
    url(r'^$', HomeView.as_view(), name='home'),
    url(r'^ckeditor/', include('ckeditor_uploader.urls')),

# serving media files only on debug mode
if settings.DEBUG:
    urlpatterns += [
        url(r'^media/(?P<path>.*)$', serve, {
            'document_root': settings.MEDIA_ROOT
        }),
    ]

old example 中缺少的函数 patterns 是我认为在 Django 1.6 或 1.7 上使用的旧函数。

Answer 2

将 Django 1.8 与 django-ckeditor 5.3.0 一起使用时，我遇到了与上述完全相同的症状（上传文件有效，但 <img> 标记的 src 属性设置不正确，导致预览中出现红色 "X" 并在发布时导致图像链接损坏）。

然而，就我而言，我不必在 urls.py 中更改任何内容。我的问题是我有：

CKEDITOR_UPLOAD_PATH = os.path.join(MEDIA_ROOT, "ckeditor")

所以我的错误是 CKEDITOR_UPLOAD_PATH 我希望 ckeditor 上传到的路径（合乎逻辑，不是吗？）。

修复方法是将上面的行更改为

CKEDITOR_UPLOAD_PATH = "ckeditor"

事后看来，我可以看到这如何让 django-ckeditor 能够使用 MEDIA_ROOT 进行上传并使用 MEDIA_URL 进行服务。我仍然认为有人应该这样说："Don't use the full path when setting CKEDITOR_UPLOAD_PATH!"

我希望这能为其他人节省一些时间。

Answer 3

安装ckeditor后，执行以下操作：

In Settings.py: add 'ckeditor' and 'ckeditor_uploader' into INSTALLED_APPS. Add CKEDITOR_UPLOAD_PATH = 'uploads_directory/' (Do not join MEDIA_ROOT with the upload_directory, ckeditor will take the MEDIA_ROOT as its root upload directory)

In your models files: USE : from ckeditor_uploader import RichTextUploadingField and modify your required model field to type RichTextUploadingField

In urls.py: add re_path(r'^ckeditor/', include('ckeditor_uploader.urls')) into urlpatterns

Answer 4

@Mohammed-tayab 的解决方案稍加修改就对我有用：

from ckeditor_uploader.fields import RichTextUploadingField

Answer 5

对于 Django 4 在 django-ckeditor 中启用图像或文件上传的步骤是：

1.安装 django-ckeditor

pip install django-ckeditor

2。更新 settings.py

添加文件上传路径：

CKEDITOR_UPLOAD_PATH = "uploads/"

在INSTALLED_APPS中添加ckeditor,ckeditor_uploader:

INSTALLED_APPS = [
    ...

    # plugins
    'ckeditor',
    'ckeditor_uploader'
]

3。更新 urls.py

在urlpatterns中添加path('ckeditor/', include('ckeditor_uploader.urls'))：

urlpatterns = [
                  ...
                  path('ckeditor/', include('ckeditor_uploader.urls')),
              ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

4。在models

中使用RichTextUploadingField

from ckeditor_uploader.fields import RichTextUploadingField

class ResearchTopic(models.Model):
    title = models.CharField(max_length=200)
    description = RichTextUploadingField()

测试：

Django==4.0.4
django-ckeditor==6.4.0

参考文献：

django-ckeditor documentation

Django CKEditor 图片上传没有出现

Django CKEditor Image Uploads not appearing

python

django

ckeditor