ASp.net下fckeditor配置圖片上傳最簡單的方法

來源:互聯網
上載者:User

1. 原先的配置
把 fckeditor/filemanager/connectors 目錄刪除;
有同學可能會問了,都刪除了怎麼上傳檔案?
呵呵。。。

2. 不要引用 FredCK.FCKeditorV2.dll;
因為我都是採用js寫的,不採用控制項的方式;
其實網上有很多人在嘗試往 fckeditor/filemanager/connectors目錄下注入,
確實也有人不小心直接把FCK編輯器沒有任何配置的情況下傳到網上導致中招了;

3. 現在講正題吧,一般來說我們用FCK的時候並不多,在一個系統裡面可能也就幾個地方
現在假如我有一個簡單的系統,裡面有“新聞”發布和,類似“公司簡介”單頁發布兩個地方要用的FCK
我要把所有文章的圖片放到 /Article/yyyyMMdd/guid.jpg
把所有單頁的圖片放到 /Page/yyyyMMdd/guid.jpg
或者說我要把圖片按使用者存到不同的地方。。。

4.實現
怎麼很簡單的事情要說清楚需要做這麼多鋪墊,太麻煩了。。。。!!!

web頁面:
代碼 複製代碼 代碼如下:<form id="form1" runat="server">
<div>
<div>
<asp:TextBox ID="TextBox1" TextMode="MultiLine" runat="server"> </asp:TextBox>
</div>
<br />
<asp:Button ID="Button1" runat="server" Text="Button" onclick="Button1_Click" />
</div>
</form>

JS:

代碼 複製代碼 代碼如下:<script src="fckeditor/fckeditor.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload = function() {
var oFCKeditor = new FCKeditor('<%= TextBox1.ClientID %>');
oFCKeditor.BasePath = 'fckeditor/'
oFCKeditor.Config.ImageUploadURL = "/admin/auploader.aspx";
oFCKeditor.ReplaceTextarea();
}
</script>

這樣就搞定了!
不要不相信啊,下面把上傳頁面的代碼簡單的寫一個吧,對這個也比較重要;

代碼 複製代碼 代碼如下:protected void Page_Load(object sender, EventArgs e)
{
if (Request.Files.Count > 0)
{
HttpPostedFile file = Request.Files[0];
string path = "/Article/" + System.DateTime.Now.ToString("yyyyMMdd") + "/";
string serverPath = Server.MapPath(path);
string fileName = Guid.NewGuid() + file.FileName.Substring(file.FileName.LastIndexOf("."));
if (!System.IO.Directory.Exists(serverPath))
System.IO.Directory.CreateDirectory(serverPath);
file.SaveAs(serverPath + fileName);
SendFileUploadResponse(0, path + fileName, fileName, "上傳成功!");
}
else
{
SendFileUploadResponse(1, "", "", "上傳失敗!");
}
}

public void SendFileUploadResponse(int isSucceed, string fileUrl, string fileName, string customMsg)
{
System.Web.HttpContext.Current.Response.Clear();
System.Web.HttpContext.Current.Response.Write("<script type='text/javascript'>");
System.Web.HttpContext.Current.Response.Write(@"(function(){var d=document.domain;while (true){try{var A=window.top.opener.document.domain;break;}catch(e) {};d=d.replace(/.*?(?:\.|$)/,'');if (d.length==0) break;try{document.domain=d;}catch (e){break;}}})();");
System.Web.HttpContext.Current.Response.Write("window.parent.OnUploadCompleted(" + isSucceed.ToString().ToLower() + ", '" + fileUrl + "', '" + fileName + "', '" + customMsg + "');");
System.Web.HttpContext.Current.Response.Write("</script>");
System.Web.HttpContext.Current.Response.End();
}

好了搞定了!
這個上傳代碼沒有做嚴格的尾碼限制,大小限制;因為這個頁面路徑是我們自己配置的嘛,想怎麼寫就怎麼寫了;
甚至你可以根據不同的使用者存到不同的地方;
這裡需要說明一下 SendFileUploadResponse 方法,其實就是為FCk傳回訊息;
這裡:
System.Web.HttpContext.Current.Response.Write("window.parent.OnUploadCompleted(" + isSucceed.ToString().ToLower() + ", '" + fileUrl + "', '" + fileName + "', '" + customMsg + "');");

對應的是
fckeditor/dialog/fck_image/fck_image.js

代碼 複製代碼 代碼如下:function OnUploadCompleted( errorNumber, fileUrl, fileName, customMsg )
{
// Remove animation
window.parent.Throbber.Hide() ;
GetE( 'divUpload' ).style.display = '' ;
switch ( errorNumber )
{
case 0 : // No errors
alert( 'Your file has been successfully uploaded' ) ;
break ;
case 1 : // Custom error
alert( customMsg ) ;
return ;
case 101 : // Custom warning
alert( customMsg ) ;
break ;
case 201 :
alert( 'A file with the same name is already available. The uploaded file has been renamed to "' + fileName + '"' ) ;
break ;
case 202 :
alert( 'Invalid file type' ) ;
return ;
case 203 :
alert( "Security error. You probably don't have enough permissions to upload. Please check your server." ) ;
return ;
case 500 :
alert( 'The connector is disabled' ) ;
break ;
default :
alert( 'Error on file upload. Error number: ' + errorNumber ) ;
return ;
}
sActualBrowser = '' ;
SetUrl( fileUrl ) ;
GetE('frmUpload').reset() ;
}

注意到 0 ,是成功,1 是失敗,其他的自己看吧。。。。
對了說明一下這裡用的是 2.65 版本測試的,如果有其他版本不一樣的靈活變通下哈;

總結一下:
1. 在不同的頁面配置不同的圖片處理路徑,如:
oFCKeditor.Config.ImageUploadURL = "/admin/aupload.aspx";
oFCKeditor.Config.ImageUploadURL = "/admin/bupload.aspx";
。。。。

2. FCk 會把圖片post到指定的路徑,
然後你自己操作圖片,按目錄存啊還是按目前使用者session存隨便來;
當然別忘記驗證使用者的身份在先,沒有許可權的不要對他客氣,直接返回錯誤,
驗證身份範例程式碼裡面沒寫,自己根據項目自己加吧

3. 一定要傳回值告訴FCK你的操作結果,否則會一直死在那裡的。。。

PS:
看來我不是個喜歡寫東西的人,覺得很麻煩。。。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在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.