精品伊人久久大香线蕉,开心久久婷婷综合中文字幕,杏田冲梨,人妻无码aⅴ不卡中文字幕

打開APP
userphoto
未登錄

開通VIP,暢享免費(fèi)電子書等14項(xiàng)超值服

開通VIP
CKEditor實(shí)現(xiàn)圖片上傳
本人用的CKEditor版本為4.3 CKEditor配置和部署參考CKEditor4.x部署和配置
CKEditor編輯器的工具欄中初始的時候應(yīng)該是這樣子的,沒有圖片上傳按鈕


并且預(yù)覽中有一堆火星文,可以修改相應(yīng)配置刪除它。
第一種方法打開ckeditor/plugins/image/dialogs/image.js文件,搜索“b.config.image_previewText”,(b.config.image_previewText||'')單引號中的內(nèi)容全刪了,注意別刪多了。(由于ckeditor的很多js文件都是壓縮過的,格式很難看,很容易刪錯,所以不推薦此種方法)
第二種方法:打開config.js文件,加入下面一句話
config.image_previewText=' '; //預(yù)覽區(qū)域顯示內(nèi)容

下面研究圖片上傳
要想出現(xiàn)上傳按鈕,兩種方法
第一種:還是剛才那個image.js
搜索“upload”可以找到這一段 id:'Upload',hidden:true,而我使用的4.3的是
id:"Upload",hidden:!0,反正改為false就行了,(遺憾的是此種方法對我這個版本不起作用)
第二種:打開config.js文件,加入下面一句話
config.filebrowserImageUploadUrl= "admin/UserArticleFileUpload.do"; //待會要上傳的action或servlet

OK現(xiàn)在基本上是下面這個樣子的了




上面的只是一個上傳頁面。也就相當(dāng)于一個HTML的form表單,
要配置點(diǎn)擊"上傳到服務(wù)器上"按鈕后請求的Action。已在ckeditor/config.js中配置。
就是上面的 config.filebrowserImageUploadUrl = "admin/UserArticleFileUpload.do";
可使用chrome審查元素查看代碼



接下來就是action中的上傳方法:

  1. import java.io.File;  
  2. import java.io.FileInputStream;  
  3. import java.io.FileOutputStream;  
  4. import java.io.IOException;  
  5. import java.io.InputStream;  
  6. import java.io.OutputStream;  
  7. import java.io.PrintWriter;  
  8.   
  9. import javax.servlet.http.HttpServletRequest;  
  10. import javax.servlet.http.HttpServletResponse;  
  11.   
  12. import org.apache.struts2.ServletActionContext;  
  13.   
  14. public class ImgUploadAction {  
  15.     private File upload; // 文件  
  16.     private String uploadContentType; // 文件類型  
  17.     private String uploadFileName; // 文件名  
  18.   
  19.     /** 
  20.      * 圖片上傳 
  21.      *  
  22.      * @return 
  23.      * @throws IOException 
  24.      */  
  25.     public String imgUpload() throws IOException {  
  26.   
  27.         // 獲得response,request  
  28.         HttpServletResponse response = ServletActionContext.getResponse();  
  29.         HttpServletRequest request = ServletActionContext.getRequest();  
  30.   
  31.         response.setCharacterEncoding("utf-8");  
  32.         PrintWriter out = response.getWriter();  
  33.         // CKEditor提交的很重要的一個參數(shù)  
  34.         String callback = request.getParameter("CKEditorFuncNum");  
  35.         String expandedName = ""// 文件擴(kuò)展名  
  36.         if (uploadContentType.equals("image/pjpeg")  
  37.                 || uploadContentType.equals("image/jpeg")) {  
  38.             // IE6上傳jpg圖片的headimageContentType是image/pjpeg,而IE9以及火狐上傳的jpg圖片是image/jpeg  
  39.             expandedName = ".jpg";  
  40.         } else if (uploadContentType.equals("image/png")  
  41.                 || uploadContentType.equals("image/x-png")) {  
  42.             // IE6上傳的png圖片的headimageContentType是"image/x-png"  
  43.             expandedName = ".png";  
  44.         } else if (uploadContentType.equals("image/gif")) {  
  45.             expandedName = ".gif";  
  46.         } else if (uploadContentType.equals("image/bmp")) {  
  47.             expandedName = ".bmp";  
  48.         } else {  
  49.             out.println("<script type=\"text/javascript\">");  
  50.             out.println("window.parent.CKEDITOR.tools.callFunction(" + callback  
  51.                     + ",''," + "'文件格式不正確(必須為.jpg/.gif/.bmp/.png文件)');");  
  52.             out.println("</script>");  
  53.             return null;  
  54.         }  
  55.         if (upload.length() > 600 * 1024) {  
  56.             out.println("<script type=\"text/javascript\">");  
  57.             out.println("window.parent.CKEDITOR.tools.callFunction(" + callback  
  58.                     + ",''," + "'文件大小不得大于600k');");  
  59.             out.println("</script>");  
  60.             return null;  
  61.         }  
  62.   
  63.         InputStream is = new FileInputStream(upload);  
  64.         //圖片上傳路徑  
  65.         String uploadPath = ServletActionContext.getServletContext().getRealPath("/img/uploadImg");  
  66.         String fileName = java.util.UUID.randomUUID().toString(); // 采用時間+UUID的方式隨即命名  
  67.         fileName += expandedName;  
  68.         File file = new File(uploadPath);  
  69.         if (!file.exists()) { // 如果路徑不存在,創(chuàng)建  
  70.             file.mkdirs();  
  71.         }  
  72.         File toFile = new File(uploadPath, fileName);  
  73.         OutputStream os = new FileOutputStream(toFile);  
  74.         byte[] buffer = new byte[1024];  
  75.         int length = 0;  
  76.         while ((length = is.read(buffer)) > 0) {  
  77.             os.write(buffer, 0, length);  
  78.         }  
  79.         is.close();  
  80.         os.close();  
  81.   
  82.         // 返回"圖像"選項(xiàng)卡并顯示圖片  request.getContextPath()為web項(xiàng)目名   
  83.         out.println("<script type=\"text/javascript\">");  
  84.         out.println("window.parent.CKEDITOR.tools.callFunction(" + callback  
  85.                 + ",'" + request.getContextPath() + "/img/uploadImg/" + fileName + "','')");  
  86.         out.println("</script>");  
  87.         return null;  
  88.     }  
  89.   
  90.     public File getUpload() {  
  91.         return upload;  
  92.     }  
  93.   
  94.     public void setUpload(File upload) {  
  95.         this.upload = upload;  
  96.     }  
  97.   
  98.     public String getUploadContentType() {  
  99.         return uploadContentType;  
  100.     }  
  101.   
  102.     public void setUploadContentType(String uploadContentType) {  
  103.         this.uploadContentType = uploadContentType;  
  104.     }  
  105.   
  106.     public String getUploadFileName() {  
  107.         return uploadFileName;  
  108.     }  
  109.   
  110.     public void setUploadFileName(String uploadFileName) {  
  111.         this.uploadFileName = uploadFileName;  
  112.     }  
  113. }  

config.js
  1. CKEDITOR.editorConfig = function( config ) {  
  2.      config.image_previewText=' '; //預(yù)覽區(qū)域顯示內(nèi)容  
  3.      config.filebrowserImageUploadUrl"ImgUpload.action"; //要上傳的action或servlet   
  4. };  

最后上傳圖片成功

本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點(diǎn)擊舉報
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
CKEditor圖片上傳實(shí)現(xiàn)詳細(xì)步驟(使用Struts 2)
讓CKEDITOR支持JSP上傳
CKEDITOR CKFINDER的圖片上傳配置(C#/asp.net/php)
CKEditor上傳圖片配置PHP語言
thinkphp下ckeditor+ckfinder的圖片上傳配置 - 美拓blog
ckeditor3.6.5+ckfinder2.0.2+jsp編輯器配置 支持服務(wù)器瀏覽/上傳圖片、Flash
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點(diǎn)擊這里聯(lián)系客服!

聯(lián)系客服

主站蜘蛛池模板: 竹山县| 镇江市| 贵德县| 柞水县| 本溪市| 常熟市| 宣武区| 家居| 洪江市| 图们市| 探索| 梁山县| 鄯善县| 安达市| 云浮市| 时尚| 长海县| 永平县| 浑源县| 霞浦县| 九龙坡区| 侯马市| 临颍县| 贵阳市| 阿克苏市| 通州市| 梨树县| 龙岩市| 肃宁县| 邵武市| 洛宁县| 六盘水市| 大同市| 武川县| 栾川县| 灵宝市| 汶上县| 山东省| 焦作市| 嘉禾县| 桑植县|