آفلاین
user-avatar

استفاده از ckeditor

10 ماه پیش
توسط مهدی آپدیت شد
آفلاین
user-avatar
مستر X ( 531 تجربه )
2 سال پیش
تخصص : ادمین شبکه

سلام و عرض ادب
وقتتون بخیر
بنده در استفاده از ckeditor به مشکل برخوردم
البته مشکل من لود خود ckeditor نیست.

  1. بنده از وبسایت رسمی این گروه، نسخه 4.9.2 رو دانلود کردم.
  2. فولدر ckeditor رو در فولدر public از پروژه لاراول قرار دادم.
  3. آی دی textarea مربوطه رو انتخاب کردم و ckeditor رو فراخوانی کردم.
    به صورت زیر :

    <script src="/ckeditor/ckeditor.js"></script>
    <script>
        CKEDITOR.replace('body' ,{
            filebrowserUploadUrl : '/admin/panel/upload-image',
            filebrowserImageUploadUrl :  '/admin/panel/upload-image',
        });
    </script>

    تا اینجای کار به خوبی پیش رفت، و من نتیجه رو دیدم و ckeditor به درستی بارگذاری شد.
    مشکل از جایی شروع شد که خواستم از درون ckeditor عکسی آپلود کنم و استفاده کنم.
    طبق یکی از آموزش های همین سایت به صورت زیر عمل کردم:
    ابتدا route مورد نظر رو ایجاد کردم، به صورت زیر:

    $this->post('/admin/panel/upload-image', 'Admin\PanelController@UploadImageSubject');

    بعد در قسمت Middleware ها و فایل VerifyCsrfToken.php کد زیر رو قرار دادم:

    protected $except = [
        'admin/panel/upload-image'
    ];

    بعد تابع زیر رو در controller مربوطه ایجاد کردم. تابع uploadImageSubject در کنترلر PanelController

    public function uploadImageSubject()
    {
    
        $this->validate(request() , [
            'upload' => 'required|mimes:jpeg,png,bmp',
        ]);
    
        $year = Carbon::now()->year;
        $imagePath = "/upload/images/{$year}/";
    
        $file = request()->file('upload');
        $filename = $file->getClientOriginalName();
    
        if(file_exists(public_path($imagePath) . $filename)) {
            $filename = Carbon::now()->timestamp . $filename;
        }
    
        $file->move(public_path($imagePath) , $filename);
        $url = $imagePath . $filename;
    
        return "<script>window.parent.CKEDITOR.tools.callFunction(1 , '{$url}' , '')</script>";
    }

    توقع داشتم خیلی خوب پیش بره، البته سعی کردم دیباگ کنم، متوجه شدم، وقتی بارگذاری عکس رو انجام میدم، عکس بارگذاری میشه، ولی پاسخی به ckeditor فرستاده نمیشه، سعی کردم در اول همین تابع کد زیر رو قرار بدم تا متوجه بشم مشکل از کجاست:

    return request()->all();

    متوجه شدم در ویدویی که آقای سیدی قرار دادن: هنگام برگشت دادن اطلاعات ckeditor، اطلاعات زیر برگشت داده میشن:
    CKEditor
    CKEditorFuncNum
    ckCsrfToken
    langCode
    upload
    اما برای بنده فقط اطلاعات زیر برگشت داده میشه
    ckCsrfToken
    upload
    متذکر بشم تصویر به درستی در مسیری که مشخص کردم آپلود میشه، ولی به طبق چیزی که در بالا ذکر کردم، اطلاعات درستی از ckeditor برگشت داده نمیشه که من بخوام کد زیر رو بهش پاس بدم

    return "<script>window.parent.CKEDITOR.tools.callFunction(1 , '{$url}' , '')</script>";

مشکل از کجاست و باید چکار کنم؟

بهترین پاسخ انتخاب شده توسط مستر X
آفلاین
user-avatar
حسام موسوی
2 سال پیش

با سلام همونطور که در سمت نظرات گفتید بدلیل تغییر ورژن این مشکل براتون بوجود اومده یعنی در ورژن 4.9.2 این مشکل رو داشتید که با جا به جا کردن فایل ckeditor با فایل پروژه ای که در اختیارتون گذاشتم مشکل حل شد .
حالا چون ورژن ckeditor به کلی تغییر کرده . باید مستندات این پلاگین رو در لینک زیر مطالعه کنید یجورایی روش آپلود هم برای این ویرایشگر تغییر کرده
https://docs.ckeditor.com/ckeditor4/latest/guide/dev_file_upload.html

آفلاین
user-avatar
حسام موسوی ( 382339 تجربه )
2 سال پیش
تخصص : طراح و برنامه نویس

با سلام همونطور که در سمت نظرات گفتید بدلیل تغییر ورژن این مشکل براتون بوجود اومده یعنی در ورژن 4.9.2 این مشکل رو داشتید که با جا به جا کردن فایل ckeditor با فایل پروژه ای که در اختیارتون گذاشتم مشکل حل شد .
حالا چون ورژن ckeditor به کلی تغییر کرده . باید مستندات این پلاگین رو در لینک زیر مطالعه کنید یجورایی روش آپلود هم برای این ویرایشگر تغییر کرده
https://docs.ckeditor.com/ckeditor4/latest/guide/dev_file_upload.html

آفلاین
user-avatar
KraToS ( 498 تجربه )
2 سال پیش

@gharaeeim
به جای کدی که آقای موسوی گفتن این کد رو جایگزین کنین :
$response = [
"uploaded" => 1,
"filename" => $fileName,
"url" => $url,
"error" => ''
];

    return $response;

نوع توابعی که باید برگشت بدین تغییر کرده تو ورژن جدید تر

آفلاین
user-avatar
مهدی ( 13645 تجربه )
2 سال پیش
تخصص : برنامه نویس وب/اندروید

سلام منم توی پیاده سازی ادیتور به مشکل خوردم که امیدوارم با این روشها که گذاشتید حل بشه

آفلاین
user-avatar
TBF tec ( 395 تجربه )
2 سال پیش

@mahdidev
@gharaeeim

سلام .
من حدود 2 ساعت وقت گذاشتم و بالاخره تونستم از داخل مستندات CKEditor متوجه تغییرش بشم .
مشکل از اینجاست که شما در جایی که اسکریپت خودتون رو فراخوانی میکنید ، باید یک خط دیگه هم اضافه کنید و متد form رو بهش پاس بدید .
یعنی این خط( 'filebrowserUploadMethod : form' ) رو باید اضافه کنید
در کل میشه این :

    <script>
                CKEDITOR.replace( 'body', {
                    filebrowserUploadMethod : 'form',
                    filebrowserUploadUrl: '/admin/panel/upload-image',
                    filebrowserImageUploadUrl: '/admin/panel/upload-image',
            });
        </script>
آفلاین
user-avatar
مهدی ( 13645 تجربه )
2 سال پیش
تخصص : برنامه نویس وب/اندروید

آپلود تصاویر به صورت لوکال درست انجام می شه ولی بعد از اینکه پروژه رو روی هاست منتشر کردم تصاویر اصلا آپلود نمیشن. مشکل چیه؟
@tbf5005

آفلاین
user-avatar
بهزاد میرزازاده ( 1118 تجربه )
12 ماه پیش

سلام منم چند بار به این مشکلات برخوردم دو تا لینک ذیل رو مطالعه کنید و مشکلاتتون رو برای همیشه حل کنید
https://jobteam.ir/ProductUser/45-Laravel-file-manager
https://jobteam.ir/ProductUser/83-ckeditor-get-Document-Position

آفلاین
user-avatar
مهدی ( 13645 تجربه )
10 ماه پیش
تخصص : برنامه نویس وب/اندروید

@tbf5005
@mirzazadehbehzad
آپلود تصویر داخل ادیتور به خوبی انجام میشه و توی پست منتشر شده هم به خوبی نمایش داده میشه. ولی وقتی میخوام پست رو ویرایش کنم عکس درست نمایش داده نمیشه.
یعنی توی قسمت src آدرس روت اصلی پروژه درج نمیشه. چطوری میشه این مورد رو حل کرد؟

آفلاین
user-avatar
مهدی ( 13645 تجربه )
10 ماه پیش
تخصص : برنامه نویس وب/اندروید

متوجه شدم که اشکال از فارسی کردن آدرس تصویر هست. یعنی وقتی داخل ادیتور میخواد تصویری که قبلا آپلود کردم رو نمایش بده اگه عدد توی آدرس باشه به صورت فارسی عدد رو توی قسمت src درج می کنه که باعث میشه تصویر توی ادیتور درست نمایش داده نشه.
برای اینکه این اتفاق نیفته چه راهی وجود داره؟

برای ارسال پاسخ باید وارد سایت شوید