主頁(yè) > 知識(shí)庫(kù) > 為ckeditor編輯器加上傳圖片的功能

為ckeditor編輯器加上傳圖片的功能

熱門(mén)標(biāo)簽:企業(yè)電話(huà)機(jī)器人辦理 長(zhǎng)春銷(xiāo)售外呼系統(tǒng)業(yè)務(wù) 四平電話(huà)機(jī)器人哪家好 天津電銷(xiāo)卡外呼系統(tǒng)線(xiàn)路 智能電銷(xiāo)機(jī)器人真的好嗎 株洲外呼營(yíng)銷(xiāo)系統(tǒng)有哪些 興化400電話(huà)辦理多少錢(qián) 靈聲智能電話(huà)機(jī)器人招聘 長(zhǎng)春防封卡電銷(xiāo)卡套餐
CKEditor官方演示是有上傳圖片和瀏覽服務(wù)器文件功能的,但是我們自己下載回來(lái)的卻沒(méi)有這兩個(gè)功能…… 其實(shí)還需要下載另外一個(gè)組件:CKFinder,用它配合CKEditor來(lái)實(shí)現(xiàn)上傳功能。 官方提供了PHP,Asp.Net和Asp三個(gè)語(yǔ)言版本的CKFinder,下載地址:http://ckfinder.com/download
將CKFinder解壓縮到網(wǎng)站目錄。調(diào)用方法如下(假設(shè)CKFinder在網(wǎng)站根目錄,可以使用相對(duì)路徑): CKEDITOR.replace( 'editor1', { filebrowserBrowseUrl : '/ckfinder/ckfinder.html', filebrowserImageBrowseUrl : '/ckfinder/ckfinder.html?Type=Images', filebrowserFlashBrowseUrl : '/ckfinder/ckfinder.html?Type=Flash', filebrowserUploadUrl : '/ckfinder/core/connector/php/connector.php?command=QuickUploadtype=Files', filebrowserImageUploadUrl : '/ckfinder/core/connector/php/connector.php?command=QuickUploadtype=Images', filebrowserFlashUploadUrl : '/ckfinder/core/connector/php/connector.php?command=QuickUploadtype=Flash' });

同時(shí)默認(rèn)情況下是禁止上傳的,還需要打開(kāi)CKFinder目錄下的config.php,將第32行的return false;修改為return true; 這里就是上傳權(quán)限的認(rèn)證了,你可以注意到上面有一大段英文注釋?zhuān)馑际遣灰?jiǎn)單的將它修改為return true,而是加上例如session驗(yàn)證等等,否則會(huì)很危險(xiǎn)……

下面是官方文檔,關(guān)于如何增加文件上傳功能,給英文好的同學(xué)參考,上面說(shuō)的方法其實(shí)就是下文中的Example 5:

Basic Configuration The filebrowserBrowseUrl setting is the location of an external file browser, that should be launched when "Browse Server" button(1) is pressed. The filebrowserUploadUrl setting is the location of a script that handles file uploads. If set, the "Upload" tab(2) will appear in dialog boxes (only where such functionality is available, i.e. in "Link", "Image" and "Flash" dialog windows). Example 1 CKEDITOR.replace( 'editor1', { filebrowserBrowseUrl : '/browser/browse.php', filebrowserUploadUrl : '/uploader/upload.php', }); It is also possible to set a separate url for a selected dialog box, using the dialog name in file browser settings: filebrowser[dialogName]BrowseUrl and filebrowser[dialogName]UploadUrl. For example to set a special upload url for the image dialog, set the filebrowserImageUploadUrl property: Example 2 CKEDITOR.replace( 'editor1', { filebrowserBrowseUrl : '/browser/browse.php', filebrowserImageBrowseUrl : '/browser/browse.php?type=Images' filebrowserUploadUrl : '/uploader/upload.php', filebrowserImageUploadUrl : '/uploader/upload.php?type=Images' }); In the example above, filebrowserBrowseUrl and filebrowserUploadUrl settings will be used by default, however in the Image dialog box, CKEditor will use filebrowserImageBrowseUrl and filebrowserImageUploadUrl configuration settings instead. File Browser Window Size The default width of file browser window in CKEditor is set to 80% of screen width, the default hight is set to 70% of screen height. If for some reasons, the default values are not suitable for you, you can change it to any other value. Use filebrowserWindowWidth to change width and filebrowserWindowHeight to change height of the window. To set the size of the window in pixels, just set the number value (e.g. "800"). If you prefer to set height and width of the window in percentage of the screen, remember to add percent sign at the end (e.g. "60%"). Example 3 CKEDITOR.replace( 'editor1', { filebrowserBrowseUrl : '/browser/browse.php', filebrowserUploadUrl : '/uploader/upload.php', filebrowserWindowWidth : '640', filebrowserWindowHeight : '480', }); To set the window size of file browser inside of a specific dialog box, use filebrowser[dialogName]WindowWidth and filebrowser[dialogName]WindowHeight settings. For example, to change the file browser window size only in "Image" dialog box, change set the filebrowserImageWindowWidth and filebrowserImageWindowHeight settings. Example 4 CKEDITOR.replace( 'editor1', { filebrowserBrowseUrl : '/browser/browse.php', filebrowserUploadUrl : '/uploader/upload.php', filebrowserImageWindowWidth : '640', filebrowserImageWindowHeight : '480', }); Using CKFinder CKFinder may be easily integrated with CKEditor (see live demo). The integration may be done in two ways: by setting CKEditor configuration options (example below) or using the CKFinder.SetupCKEditor() method available in CKFinder API. Example 5 CKEDITOR.replace( 'editor1', { filebrowserBrowseUrl : '/ckfinder/ckfinder.html', filebrowserImageBrowseUrl : '/ckfinder/ckfinder.html?Type=Images', filebrowserFlashBrowseUrl : '/ckfinder/ckfinder.html?Type=Flash', filebrowserUploadUrl : '/ckfinder/core/connector/php/connector.php?command=QuickUploadtype=Files', filebrowserImageUploadUrl : '/ckfinder/core/connector/php/connector.php?command=QuickUploadtype=Images', filebrowserFlashUploadUrl : '/ckfinder/core/connector/php/connector.php?command=QuickUploadtype=Flash' }); The example above is valid for PHP environment. /ckfinder/ is a base path to the CKFinder installation directory. If your using CKFinder for ASP, ASP.NET or ColdFusion remember to change "php" to the right extension: asp - CKFinder for ASP aspx - CKFinder for ASP.NET cfm - CKFinder for ColdFusion php - CKFinder for PHP Example 6 CKEditor + CKFinder integration with the use of CKFinder.SetupCKEditor() function: var editor = CKEDITOR.replace( 'editor1' ); CKFinder.SetupCKEditor( editor, '/ckfinder/' ); The second parameter of the SetupCKEditor() method is the path to the CKFinder installation. Please check the _samples/js/ckeditor.html sample distributed with CKFinder to see the full working example of this integration method.
您可能感興趣的文章:
  • asp.net+FCKeditor上傳圖片顯示叉叉圖片無(wú)法顯示的問(wèn)題的解決方法
  • 修改fckeditor的文件上傳功能步驟
  • 整合ckeditor+ckfinder,解決上傳文件路徑問(wèn)題
  • 通過(guò)Fckeditor把圖片上傳到獨(dú)立圖片服務(wù)器的方法
  • ASp.net下fckeditor配置圖片上傳最簡(jiǎn)單的方法
  • FCKeditor編輯器添加圖片上傳功能及圖片路徑問(wèn)題解決方法
  • Asp.net FCKEditor 2.6.3 上傳文件沒(méi)有權(quán)限解決方法
  • FCKeditor ASP.NET 上傳附件研究
  • asp fckeditor自定義上傳文件的文件名
  • CKEditor與dotnetcore實(shí)現(xiàn)圖片上傳功能

標(biāo)簽:貴港 青海 石嘴山 運(yùn)城 巴彥淖爾 漯河 黑龍江 新疆

巨人網(wǎng)絡(luò)通訊聲明:本文標(biāo)題《為ckeditor編輯器加上傳圖片的功能》,本文關(guān)鍵詞  為,ckeditor,編輯器,加,上傳,;如發(fā)現(xiàn)本文內(nèi)容存在版權(quán)問(wèn)題,煩請(qǐng)?zhí)峁┫嚓P(guān)信息告之我們,我們將及時(shí)溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡(luò),涉及言論、版權(quán)與本站無(wú)關(guān)。
  • 相關(guān)文章
  • 下面列出與本文章《為ckeditor編輯器加上傳圖片的功能》相關(guān)的同類(lèi)信息!
  • 本頁(yè)收集關(guān)于為ckeditor編輯器加上傳圖片的功能的相關(guān)信息資訊供網(wǎng)民參考!
  • 推薦文章