Yii combined with CKEditor to implement image upload function _ php instance

This article mainly introduces Yii and CKEditor for image upload. Yii is a well-known PHP development framework, and CKEditor is a well-known WYSIWYG editor, for more information, see the image upload feature in the WYSIWYG editor in a project created in the next few days. I chose it because I prefer the CKEditor interface. Although CKFinder works well with CKEditor, the functions of this stuff are too complicated. after reading the CKEdtior document, we find that this function can be implemented by ourselves instead of CKFinder.

The following code is based on the Yii Framework, but the idea of using other frameworks or languages is exactly the same. For more information about shoes you need, see.

To enable CkEditor to upload images, you must configure the filebrowserImageUploadUrl attribute of the editor:

The code is as follows:

CKEDITOR. replace ('editor1 ',
{
FilebrowserUploadUrl: '/uploader/upload. php ',
FilebrowserImageUploadUrl: '/uploader/upload. php? Type = Images'
});

Then, the image upload function is implemented on the corresponding URL and the HTML code in a specific format is returned to CKEditor. then CKEditor can preview and insert the image normally.
The following is only part of the Controller code. the Controller is implemented in this way:

The code is as follows:

/**
* Save the uploaded image
*
* @ Return string javascript code
* @ Author lfyzjck
**/
Public function actionImg ($ type, $ CKEditor, $ CKEditorFuncNum, $ langCode = 'zh-cn ')
{
If (empty ($ CKEditorFuncNum) | $ type! = 'Images '){
$ This-> mkhtml ($ CKEditorFuncNum, '', 'invalid function call ');
}
If (isset ($ _ FILES ['upload']) {
// Obtain the image upload configuration
$ Options = Options: model ()-> findByPk (1 );
$ Form = new UploadForm ('image', $ options );
$ Form-> upload = CUploadedFile: getInstanceByName ('upload ');
If ($ form-> validate ()){
// File name: Time + source file name
$ Target_filename = date ('ymd-hm ', time (). $ form-> upload-> getName ();
$ Path = Yii: app ()-> basePath. '/../uploads/'. $ target_filename; // save the image path
$ Form-> upload-> saveAs ($ path );
$ This-> mkhtml ($ CKEditorFuncNum, Yii: app ()-> baseUrl. '/uploads/'. $ target_filename, "uploaded successfully ");
}
Else {
$ This-> mkhtml ($ CKEditorFuncNum, '', $ form-> getError ('upload '));
}
}
}
/**
* Return the prompt message of CKEditor.
*
* @ Return void
* @ Author lfyzjck
**/
Private function mkhtml ($ fn, $ fileurl, $ message)
{
$ Str = '';
Exit ($ str );
}

The mkhtml function that requires special instructions will call the CKEditor function to generate prompt information. When the upload is successful, the image link is returned. CKEditor generates an image preview based on the URL.

Next is the UploadForm code. here we will verify that the image format and size meet the requirements.

The code is as follows:

Class UploadForm extends CFormModel
{
Public $ upload;

Private $ options;
Private $ type;

Public function _ construct ($ type, $ options ){
$ This-> options = $ options;
$ This-> type = $ type;
}
/**
* Declares the validation rules.
* The rules state that username and password are required,
* And password needs to be authenticated.
*/
Public function rules ()
{
Return array (
Array ('upload', 'file ',
'Types' => $ this-> options-> getAttribute ("allow _". $ this-> type. "_ type "),
'Maxsize' => 1024 * (int) $ this-> options-> getAttribute ("allow _". $ this-> type. "_ maxSize "),
'Toolarge' => 'File size exceeds the limited ',
),
);
}
}