前言

最近工作中遇到一個(gè)需求，是要實(shí)現(xiàn)asp.net百度ueditor圖片上傳添加水印的功能，通過(guò)查找相關(guān)的資料終于實(shí)現(xiàn)了，下面來(lái)給大家分享下實(shí)現(xiàn)的效果，文末給出了實(shí)例代碼，大家可以參考學(xué)習(xí)，下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。

效果圖

首先來(lái)看下我們想要的功能界面，如果發(fā)覺(jué)這種效果不是你想要的，后面的內(nèi)容就不用看了。

準(zhǔn)備 

從官網(wǎng)下載的Ueditor壓縮包，我下載的是ueditor1_4_3-utf8-net 這個(gè)版本，下面的介紹是對(duì)這個(gè)版本而言的。

修改界面

先找到我們要添加"加水印[checkbox]"的地方

由此可以知道，我們應(yīng)該到image.html 這個(gè)文件去修改我們的html代碼，在 image.html文件的第36行開(kāi)始添加幾行html代碼，如下圖：

刷新界面，單擊多圖上傳>本地上傳，界面就變成這樣了：

尋找可行的辦法

打開(kāi)FireBug，選中控制臺(tái)，我們上傳一張圖片，看一下請(qǐng)求信息：

這里可以看到，圖片的上傳是由controller.ashx 來(lái)處理的，而且有請(qǐng)求的參數(shù)：action 和 encode 。那我們?cè)賮?lái)看一下controller.ashx 具體是怎么處理的：

前臺(tái)傳過(guò)來(lái)的參數(shù)action 參數(shù)值為uploadimage ，類(lèi)action 由派生類(lèi) UploadHandler進(jìn)行實(shí)例化，UploadHandler 又通過(guò)構(gòu)造函數(shù)注入 UploadConfig類(lèi)的實(shí)例，最后由action.Process()調(diào)用：

其中File.WriteAllBytes 即為保存圖片的方法。

上面就是圖片上傳中"本地上傳"的主要處理代碼。現(xiàn)在思考一下，我們要給圖片加水印，應(yīng)該怎么去做呢？

有人很快就反應(yīng)過(guò)來(lái)了：我們可以從前臺(tái)請(qǐng)求controller.ashx 時(shí)將帶有是否要加水印的"字符串"一并傳遞到后臺(tái)，后臺(tái)通過(guò)判斷就可以做出相應(yīng)的處理了！

實(shí)現(xiàn)

1. 先找到請(qǐng)求controller.ashx 時(shí)，參數(shù)是從哪里添加上去的，js基礎(chǔ)比較好的同學(xué)應(yīng)該不難找到：

我們給他添加參數(shù)：“是否加水印”

2. 后臺(tái)獲取參數(shù)并進(jìn)行判斷是否要加水印

好了，這樣就大功告成了~

上傳一張圖片看看：

其他

水印圖片的處理，圖片處理類(lèi)可以通過(guò)這篇文章查看詳細(xì)：http://chabaoo.cn/article/108473.htm

示例下載：點(diǎn)擊這里

總結(jié)

好了，以上就是關(guān)于ASP.NET Ueditor上傳圖片添加水印的全部?jī)?nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來(lái)一定的幫助，如果有疑問(wèn)大家可以留言交流，謝謝大家對(duì)腳本之家的支持。

最新評(píng)論