How To Use React Ckeditor Upload File Image With Demo and Example Codes
This is a simple tutorial on how you can configure React Ckeditor wysiwyg library to handle file upload when users try to insert a picture into our editor, so the editor will upload the file to the server rather than providing the base64 string the default case by CKeditor. At first I feel like it may look very easy, and it should be because image upload is a standard feature in the editor so it doesn't need to be that complicated, but it turns out it’s far more complex than I thought. I read somewhere online that some people took days to solve just this problem. Firstable assume you have a backend API that will handle file upload into your server with this criteria. Request curl --location --request POST 'https://YOUR_API/upload_files' \ --form 'files=@"/D:/Pictures/my-image.jpg"' Response { "filename": "1622085846852.jpg" } Then on the react side, create a custom Ckeditor component that we can reuse that component anywhere on the...
