CODEWITHSUNDEEP
pythonflaskckeditorckeditor4.xflask-admin
Sadme Rame
Sadme Rame

Reputation: 429

Flask Admin Ckeditor Image Upload

For Flask Admin How is it possible to upload images in Text area with editor ?

I need simpler version than this:

https://github.com/greyli/flask-ckeditor

Upvotes: 0

Views: 1872

Answers (1)

Sadme Rame
Sadme Rame

Reputation: 429

from flask_ckeditor import *
csrf = CSRFProtect(app)
csrf.init_app(app)

ckeditor = CKEditor(app)

app.config['CKEDITOR_SERVE_LOCAL'] = False
app.config['CKEDITOR_HEIGHT'] = 400
app.config['CKEDITOR_FILE_UPLOADER'] = 'upload'
app.config['UPLOADED_PATH'] = os.path.join(basedir, 'uploads')

@app.route('/files/<filename>')
@csrf.exempt
def uploaded_files(filename):
    path = app.config['UPLOADED_PATH']
    return send_from_directory(path, filename)

import uuid

@app.route('/upload', methods=['POST'])
@csrf.exempt
def upload():
    f = request.files.get('upload')
    extension = f.filename.split('.')[1].lower()
    if extension not in ['jpg', 'gif', 'png', 'jpeg']:
        return upload_fail(message='Image only!')
    unique_filename = str(uuid.uuid4())
    f.filename = unique_filename + '.' + extension
    f.save(os.path.join(app.config['UPLOADED_PATH'], f.filename))
    url = url_for('uploaded_files', filename=f.filename)
    return upload_success(url=url)

in edit.html in flask admin

<script>
    CKEDITOR.plugins.addExternal( 'filebrowser', '/static/ckeditor/filebrowser/', 'plugin.js' );
    CKEDITOR.config.extraPlugins = 'filebrowser';
    CKEDITOR.config.filebrowserBrowseUrl  = '/upload';
<script>

This works for flask admin to upload images

https://github.com/greyli/flask-ckeditor I used this

Upvotes: 2

Related Questions