Asp.net中使用WEB編輯控制項FCKEditor

來源:互聯網
上載者:User

先要下載兩個檔案:
FCKEditor(JS檔案),FCKEdito.net(COM+組件 DLL檔案)
官方網站:http://sourceforge.net
FCKEdiotr的安裝與配置:
把FCKEdiotr檔案包直接解壓到項目的根目錄中,這樣根目錄下就得到了一個FCKEditor檔案夾,裡面富含所有FCKeditor的核心檔案.
然後把FCKEditor.Net檔案夾內的DLL檔案添加到VS工具箱內,這樣項目的根目錄下就多出一個Bin檔案夾,裡面就會有所添加的FredCK.FCKeditorV2.dll檔案.
這樣,安裝就完畢了,下面還要配置一些屬性才可以讓該控制項正常使用:
FCKeditor在ASP.NET2.0 Web項目中的配置:
把FCKeditor控制項從工具箱上拖動下來,在Default頁上你就可以看到這個FCKeditor了,不過這時只能看到一個FCKeditor的站位框,不會看到運行時的效果,在屬性(Property)面板上可以設定這個FCKeditor對象的一些基本屬性。比較重要的是BasePath屬性,如果先前FCKeditor就定在了根目錄的FCKeditor下,就設定成~/FCKeditor/,如果是別的目錄名就換成相應的值(注意:控制項預設值是/FCKeditor/,因為我們使用的是伺服器控制項設定了runat="server"屬性所以要顯式的聲明BasePath="~/FCKeditor/")。把Default.aspx切換到原始碼模式(Source),我們可以看到IDE自動產生的程式碼:
<%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %>
<FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server"></FCKeditorV2:FCKeditor>
針對這個樣本我配置的代碼如下:
<FCKeditorV2:FCKeditor
    ID="FCKeditor1"
    runat="server"
    AutoDetectLanguage="false"
    DefaultLanguage="zh-cn"
    BasePath="~/FCKeditor/">
</FCKeditorV2:FCKeditor>
到了這裡,FCKeditor的配置並沒有真正的完成,因為它裡面的一個強大功能我們還沒正確配置:檔案上傳。
在Default.aspx的運行模式下,點FCKeditor的“插入/編輯映像”(又或者是Flash)功能,在彈出框點“瀏覽伺服器”,又彈出一個對話方塊,此時隨即出現的是一個錯誤提示框XML request error: Forbidden(403).
得到這樣的錯誤有Web開發經驗的都知道403應該是讀寫權限的問題。可是為什麼呢?原因在於沒有配置UserFiles路徑。
我們在FCKPro根目錄下,建立一個空目錄Files。連同BasePath的設定通常的做法是這樣的:
開啟工程的Web. Config檔案,修改appSettings元素,配置如下:
<appSettings>
<add key="FCKeditor:BasePath" value="~/FCKeditor/"/>
<add key="FCKeditor:UserFilesPath" value="/專案檔夾名/Files" />
</appSettings>
設定了FCKeditor:BasePath後就不用再每次使用FCKeditor執行個體時指定BasePath屬性了,FCKeditor:UserFilesPath則是制定我們所有上傳的檔案的所在目錄。一定要設定成/FCKPro/Files而不是~/Files,因為FCKeditor使用這個值來返回你上傳後的檔案的相對路徑到用戶端,~/Files的形式是ASP.NET在服務可以編譯解釋的,但是在用戶端的靜態就不懂這是什麼了。如果使用~/Files後,那麼所有上傳檔案的返迴路徑都是~/Files形式的,你就會得到這樣的連結http://~/Files/Image/logo.gif這樣的連結解果就是路徑為找到。所以才要我們上述那樣設定,這是在開發階段,如果在工程完成後發布時請記住把/FCKPro/Files改成/Files,因為開發階段VS2005在運行項目時的URL是http://localhost/項目名稱/的形式,發布後在Server上建立網站,跟路徑就是http://www.abc.com/的形式了,所以發布後一定要改過來。這些地方是在使用FCKeditor2.2+ASP.NET2.0時經常發錯誤而又莫名其所云的地方。
至此上傳功能還差最關鍵的一步。在FCKeditor所在根目錄下(專案檔件名/FCKeditor/)找到fckconfig.js檔案,用文字編輯器開啟,在大概132行(大概是因為之前您也許參考其它資料更改過這個檔案了)的地方找到:

var _FileBrowserLanguage    = 'asp' ;      // asp | aspx | cfm | lasso | perl | php | py
var _QuickUploadLanguage = 'asp' ;      // asp | aspx | cfm | lasso | php

把這兩行賦值代碼的值由asp改成aspx,儲存關閉這個檔案。這樣準系統就完成了

對於開發中使用檔案上傳功能遇到 XML request error: Internal Server Error(500) 錯誤的解決辦法。
因為ASP.NET2.0新增了Theme功能,所以如果在你的工程中你對Web.config使用到了styleSheetTheme或theme的話那就要再多修改一下。
還是到FCKeditor所在的目錄,分別開啟\editor\filemanager\upload\aspx\upload.aspx和\editor\filemanager\browser\default\connectors\aspx\connector.aspx兩個aspx檔案,在page標籤中添加Theme=""或StyleSheetTheme=""看你在工程使用的是什麼就修改什麼。修改後如下:
<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.Uploader" AutoEventWireup="false" Theme="" %>

<%@ Page language="c#" Inherits="FredCK.FCKeditorV2.Uploader" AutoEventWireup="false" StylesheetTheme="" %>
這樣就解決了500的內部錯誤.

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.