Servlet實現動態圖文結合輸出

內容： 先看看我們要解決的問題 Html如何顯示一張圖片 通過Servlet實現圖文結合輸出 實際應用 繼續完善 附錄 參考資料 關於作者 相關內容： TCP/IP 介紹 TCP/IP 介紹 !== End TOC -->

　　黃林榕([email protected])
　　深圳穎源科技
　　2001 年 11 月

構建動態網站，靈活性與美觀經常會成為一個矛盾。網頁設計師從視覺角度考慮，在許多地方采用了圖片，有時甚至在動態輸出的內容上使用了圖片，比如網站的欄目、各類標題等。而這些內容往往要經常變換，需要WEB頁面的腳本程序根據數據庫中的內容實時輸出。傳統使用圖片的形式顯然無法勝任需要經常變換內容的位置，通常是采用折衷的辦法，或降低對視覺效果的要求，讓設計師改用文字設計，或要求維護人員不時根據實際內容重新制作並更換圖片，等等。對此，本文將提供一種更為靈活的解決方案。

　　假如你是一個WEB開發者，或多或少會碰到這樣一種情況：網頁設計師在設計網頁時，在需要動態輸出內容的地方采用圖片，如：
　　

　　而"熱點聚焦"這個名稱，也許過一兩天就要求改成"焦點訪談"等其它字樣，到時不得不重新制作一張圖片替代。而采用文字加背景，有時不易達到好的效果。采用表格背景圖方式，需要精心調整表格的尺寸，而且其它的改動也會有意無意影響到它，需要小心調試。

　　本人在多個項目開發中碰到網頁中需要動態圖文結合輸出情況，程序員和美工往往最終都是選擇了回避和妥協，盡管通常影響不大，但究竟與盡善盡美的追求有所差距。於是終於產生了本文的解決方法。

　　先看看我們要解決的問題
　　我們的問題可以簡單總結為：有一張圖片，如：
　　

　　現在我們要動態地將文字比如"熱點聚焦"輸出到上面，並在網頁上得到類似如下的顯示：
　　

　　HTML如何顯示一張圖片
　　在HMTL中顯示一張圖片很簡單：<img src="http://www.QQread.com/Java/bg.jpg" weight="153" height="25">。

　　另外我們還知道src屬性中的文件類型並沒有做限定，也就是說<img src="image.jsp">的寫法也是合法的，同樣引用Servlet：<img src="/imageServlet">的寫法也是合法的，浏覽器解析到該語句時，將向目標服務器發送一個HTTP請求。通過了解HTTP協議，可以知道，假如這時imageServlet做出Content-Type為image/jpeg的正確響應(可以通過設置contentType="images/jpeg"來實現)，那麼也將正確顯示一張圖片。這個原理也是實現將數據庫中的圖像數據顯示到網頁上所用的原理。

　　進一步利用這個原理，當向imageServlet請求圖像時，imageServlet不是簡單的發送原圖像數據，而是先對原圖像數據進行一定的處理，比如在原圖片上面的指定位置加上文字，甚至對再做一些處理比如陰影、立體等，然後再將處理後的圖像數據流發送出去，那麼不就可以得到圖文結合後的圖像了嗎？

　　根據以上分析，我們得到這樣的實現方法：在<img>的src屬性中調用實現上述功能的Servlet並傳遞相關的參數，如背景圖片路徑、輸出文字、文字輸出的位置、字體、大小等，由該Servlet進行圖文處理，並返回處理後的圖像數據，從而在網頁上顯示出加上文字的圖像。

　　通過Servlet實現圖文結合輸出