摘要:今天在網上看了下有關圖片上傳的教程,歷經挫折才調試好,現在把相關代碼及其說明貼出來,以供初次使用的朋友們參考。
今天在網上看了下有關圖片上傳的教程,歷經挫折才調試好,現在把相關代碼及其說明貼出來,以供初次使用的朋友們參考。
資源下載yii2.0-ueditor下載路徑:
https://link.jianshu.com?t=https://github.com/org-yii-china/yii2-ueditor/archive/master.zip效果演示: 安裝方法:
1.下載yii2-ueditor
2.將下載的yii2-ueditor-master 修改 ueditor (注意:修改成其他文件名請修改插件內對應的命名空間)
3.將文件方在 根目錄/common/widgets 下即可
在backend/controllers中新建一個控制器Demo加入以下代碼
public function actions(){ return [ "ueditor"=>[ "class" => "commonwidgetsueditorUeditorAction", "config"=>[ //上傳圖片配置 "imageUrlPrefix" => "", /* 圖片訪問路徑前綴 */ "imagePathFormat" => "/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上傳保存路徑,可以自定義保存路徑和文件名格式 */ ] ] ]; }第一種調用方式:
在對應的渲染頁面,即views下的頁面中
=commonwidgetsueditorUeditor::widget(["options"=>["initialFrameWidth" => 850,]])?>
options 填寫配置編輯器的參數(參考ueditor官網)
第二種調用方式:= $form->field($model, "title")->textInput(["maxlength" => true]) ?> = $form->field($model, "content")->widget("commonwidgetsueditorUeditor",[ "options"=>[ "initialFrameWidth" => 850, ] ]) ?> ...
yii2框架整合了百度編輯器,因為文件上傳采用的是yii2自帶的UploadedFile,這就難免umeditor上傳不成功問題,解決問題的只需要兩個操作步驟,我們來看看具體實現
創建一個 common/models/Upload.php: 代碼為:需要在剛剛創建的那個控制器Demo里添加actionUploadImage方法處理“富文本框的圖片上傳”內容use yiiwebUploadedFile; use commonmodelsUpload; /** * 富文本框的圖片上傳 * @return array */ public function actionUploadImage() { $model = new Upload(); if (Yii::$app->request->isPost) { $model->file = UploadedFile::getInstance($model, "file"); $dir = "/uploads/ueditor/";//文件保存目錄 if (!is_dir($dir)) mkdir($dir); if ($model->validate()) { $fileName = $model->file->baseName . "." . $model->file->extension; $dir = $dir."/". $fileName; $model->file->saveAs($dir); $info = [ "originalName" => $model->file->baseName, "name" => $model->file->baseName, "url" => $dir, "size" => $model->file->size, "type" => $model->file->type, "state" => "SUCCESS", ]; exit(json_encode($info)); } } }特別提醒:上述返回的$info信息中state狀態只能是SUCCESS,區分大小寫
視圖文件= $form->field($model, "content")->widget("commonwidgetsueditorUeditor",[ "options"=>[ "initialFrameWidth" => 1050,//寬度 "initialFrameHeight" => 550,//高度 ] ]) ?>= Html::submitButton("保存", ["class" => "btn btn-success"]) ?>其中content是字段名稱
關于圖片上傳的可以看下:
https://www.yiichina.com/tutorial/862在YII2框架中使用UEditor編輯器發布文章的地址:
https://www.cnblogs.com/felixji/p/6698436.html
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/29601.html
原文地址: http://52sox.com/write-a-flask-plugin-for-ueditor/ 近期項目開發中,隔壁那個搞python的哥們竟然笑著對我說,希望我能給他寫1個百度編輯器的demo,方便他直接調用。 當時真的受寵若驚,這哥們實力不在我之下,只能答應它了。上網搜索下,有1篇文章Flask項目集成富文本編輯器UEditor實現圖片上傳功能已經有1個現成的例子了。 這...
原文地址: http://52sox.com/write-a-flask-plugin-for-ueditor/ 近期項目開發中,隔壁那個搞python的哥們竟然笑著對我說,希望我能給他寫1個百度編輯器的demo,方便他直接調用。 當時真的受寵若驚,這哥們實力不在我之下,只能答應它了。上網搜索下,有1篇文章Flask項目集成富文本編輯器UEditor實現圖片上傳功能已經有1個現成的例子了。 這...
摘要:搜索,在上面增加一行修改后如下圖,點擊保存編輯搜索沒有權限,把圖上這兩行注釋掉沒有權限如果不注釋的話,如果用戶沒有登錄,會提示沒有權限。當然,如果你的需求,都是登陸后進行的操作的話。可以上傳圖片支持一個頁面多個編輯器完畢參照文檔 1:下載yii框架的ueditor 插件,yii 版本 1.1 ,ueditor 對應版本 1.4.3 下載地址:https://github.com/moj...
摘要:一前言在使用百度地圖開發的過程中,查閱百度地圖官網基本上就能滿足開發的需求,但是有時候需要設置一些東西,很難在官網上查閱到相關的方法技巧。希望百度地圖能夠越來越強大,這樣開發者就可以愉快的開發了 一 前言 在使用百度地圖開發的過程中,查閱百度地圖官網demo基本上就能滿足開發的需求,但是有時候需要設置一些東西,很難在官網上查閱到相關的方法技巧。筆者特意把開發過程中遇到的一些疑難雜癥和解...
閱讀 1599·2021-11-02 14:48
閱讀 3651·2019-08-30 15:56
閱讀 2767·2019-08-30 15:53
閱讀 3208·2019-08-30 14:09
閱讀 3094·2019-08-30 12:59
閱讀 2853·2019-08-29 18:38
閱讀 2693·2019-08-26 11:41
閱讀 2209·2019-08-23 16:45