Skip to content

CKEditor

CKEditorUploadAdapter

ckeditor에서 업로드를 위한 어댑터.

TIP

업로드 API는 Response 값은 아래와 같이 Array에 src 값을 포함하여야함.
(upload_files Schema의 객체 리스트로 return을 기본으로)

json
[
    {
        "src": "dev/sample.png"
    }
]
vue
<script setup lang="ts">
import Editor from 'ckeditor5-custom-build';

const editor = Editor;

const editorConfig = ref({});
const editorData = ref();

const onReady = (editor: any) => {
    editor.plugins.get('FileRepository').createUploadAdapter = (loader: any) => {
        return new CKEditorUploadAdapter(
            loader,
            "https://api.jupiterstudio.co.kr/api/v1/upload",
            'https://cdn.jupiterstudio.co.kr'
        );
    };
};
</script>

<template>
    <div>
        <ckeditor
            :editor="editor" 
            @ready="onReady" 
            v-model="editorData" 
            :config="editorConfig" 
        />
    </div>
</template>