Home > Blockchain >  Ckeditor upload picture in laravel project
Ckeditor upload picture in laravel project

Time:11-25

I have integrated ckeditor in my laravel project, and when i try add a picture in the text after i click on save post. I Get an error in the console. POST https://encode.ba/admin/lista-vijestis/4 403 (Forbidden) The upload working fine, permission on the storage folder is set properly and of course, don't record my post it seems to me that the server is blocking something, I'm not sure, that's why I'm asking, maybe someone has a similar experience I downloaded the project to my computer and ran it on a local server and everything works fine.

here is a screenshot enter image description here

enter image description here

Here is first screen shot when i try add post.

CodePudding user response:

In your html page:

 <textarea name="description" placeholder="Enter the Description"></textarea>

In script:

<script src="https://cdn.ckeditor.com/4.12.1/standard/ckeditor.js"></script>
<script>
    CKEDITOR.replace('description', {
        filebrowserUploadUrl: "{{ route('admin.product.uploadMedia', ['_token' => csrf_token()]) }}",
        filebrowserUploadMethod: 'form'
    });
</script>

create Route:

Route::post('product/img', [ProductController::class, 'uploadMedia'])->name('admin.product.uploadMedia');

In Controller:

public function uploadMedia(Request $request)
{
    if ($request->hasFile('upload')) {
        $originName = $request->file('upload')->getClientOriginalName();
        $fileName = pathinfo($originName, PATHINFO_FILENAME);
        $extension = $request->file('upload')->getClientOriginalExtension();
        $fileName = $fileName . '_' . time() . '.' . $extension;
        $path = storage_path('app/public/tmp/uploads');
        $fileName = $request->file('upload')->move($path, $fileName)->getFilename();

        $CKEditorFuncNum = $request->input('CKEditorFuncNum');
        $url = asset('storage/tmp/uploads/' . $fileName);
        $msg = 'Image uploaded successfully';
        $response = "<script>window.parent.CKEDITOR.tools.callFunction($CKEditorFuncNum, '$url', '$msg')</script>";

        @header('Content-type: text/html; charset=utf-8');
        echo $response;
    }
    return false;
}
  • Related