django-ckeditor上传的图像上的绝对路径

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了django-ckeditor上传的图像上的绝对路径相关的知识,希望对你有一定的参考价值。

我与django-rest-framework结合使用django-ckeditor。我提供一些带有绝对url的图像,没有任何问题。但是ckeditor上传的图像和文件用作相对路径,由于它们位于不同的域,因此无法在客户端显示。

这里是我所得到的例子:

{
    image: "http://example.com/media/myimage.png",
    body: "<p><a href="/media/ckeditor/myfile.pdf">download my file</a></p>"
}

这就是我想要得到的:

{
    image: "http://example.com/media/myimage.png",
    body: "<p><a href="http://example.com/media/ckeditor/myfile.pdf">download my file</a></p>"
}

编辑:这将是我的示例的模型:

from django.db import models
from ckeditor_uploader.fields import RichTextUploadingField

image: models.ImageField()
body: RichTextUploadingField(blank=True,null=True)
答案

我将使用自定义序列化程序来解决此问题:

from rest_framework import serializers


def relative_to_absolute(url):
    return 'http://127.0.0.1:8000' + url


class FileFieldSerializer(serializers.Field):
    def to_representation(self, value):
        url = value.url
        if url and url.startswith('/'):
            url = relative_to_absolute(url)
        return url

当filefield.url包含相对URL时,将调用relative_to_absolute()作为域的前缀。

这里我只是使用一个常量字符串;您可以将其保存在您的设置中,或者,如果已安装Django Site框架,请按以下方式进行检索:

from django.contrib.sites.models import Site

domain=Site.objects.get_current().domain

自定义序列化程序的示例用法:

class Picture(BaseModel):
    ...
    image = models.ImageField(_('Image'), null=True, blank=True)
    ...


class PictureSerializer(serializers.ModelSerializer):
    image = FileFieldSerializer()
    class Meta:
        model = Picture
        fields = '__all__'

RichTextUploadingField的变化

[另一方面,如果您使用的是CKEditor的RichTextUploadingField,则您的字段基本上是一个TextField,其中html片段保存在图像上上传。

在此HTML片段中,CKEditor将使用相对路径引用上载的图像,这有很好的理由:

  • 如果更改域名,您的网站仍然可以使用
  • 开发实例将在本地主机上工作
  • 毕竟,我们使用的是Django,而不是WordPress;)

所以,我不会碰它,而是在运行时在自定义序列化程序中修复路径:

SEARCH_PATTERN = 'href=\"/media/ckeditor/'
SITE_DOMAIN = "http://127.0.0.1:8000"
REPLACE_WITH = 'href=\"%s/media/ckeditor/' % SITE_DOMAIN

class FixAbsolutePathSerializer(serializers.Field):

    def to_representation(self, value):
        text = value.replace(SEARCH_PATTERN, REPLACE_WITH)
        return text

或者,域可以保存在设置中:

from django.conf import settings

REPLACE_WITH = 'href=\"%s/media/ckeditor/' % settings.SITE_DOMAIN

或从Django Site框架中检索,如下所示:

from django.contrib.sites.models import Site
REPLACE_WITH = 'href=\"{scheme}{domain}/media/ckeditor/'.format(
    scheme="http://",
    domain=Site.objects.get_current().domain
)

您可能需要根据CKEditor的配置调整SEARCH_PATTERN;越具体越好。

示例用法:

class Picture(BaseModel):
    ...
    body = RichTextUploadingField(blank=True,null=True)
    ...


class PictureSerializer(serializers.ModelSerializer):
    body = FixAbsolutePathSerializer()
    class Meta:
        model = Picture
        fields = '__all__'

以上是关于django-ckeditor上传的图像上的绝对路径的主要内容,如果未能解决你的问题,请参考以下文章

如何设置最大图像大小以在 django-ckeditor 中上传图像?

django-ckeditor 上传图片以外的文件

如何为使用 Django-CKEditor 上传的图像创建 uuid4 文件名?

Django-CKEditor 图片上传

ckeditor_uploader动态图像上传路径

如何在管理员中使用 django-ckeditor 在服务器上上传文件和浏览器文件?