Java讀取本地檔案，並顯示在JSP檔案中

餘二五發表於2017-11-15
JavaJS

   當我們初學IMG標籤時，我們知道通過設定img標籤的src屬性，能夠在頁面中顯示想要展示的圖片。其中src的值，可以是磁碟目錄上的絕對，也可以是專案下的相對路徑，還可以是網路上的圖片路徑。在存取少量圖片的情況下，採用相對路徑儲存圖片的情況下最方便，也最實用。但是當圖片數量過多時，這種方式就顯的有些掣肘了。


   當系統的圖片數量過多時，如果仍把這些圖片當做專案的一部分去釋出，勢必會大大延長專案的釋出時間及更新時間。對於某些對於時限性要求特別高的系統來說，採用相對路徑儲存圖片就是不可取的。特別是系統釋出補丁時，只能採用增量的方式去更新系統。如果採用覆蓋的方式釋出系統，就可能會造成系統圖片檔案的丟失。


   基於以上種種原因，很多系統會把大量的圖片存在伺服器的固定目錄下，這樣搭建叢集環境時，就能訪問公共的資源，避免對硬碟空間的浪費，但是問題也就在這裡出現了。我們釋出好的系統訪問磁碟上的固定目錄下的圖片時，出現了沒有許可權訪問的提示。系統為了保證本地安全，不允許直接訪問圖片。


   咋一看，上面的問題有的不可思議。但仔細想想，系統這麼做，也確實有道理的。在伺服器上，部署了很多個系統應用。不可能有一個系統的訪問許可權，就可以隨隨便便的訪問磁碟上的檔案。事實上，伺服器上的系統是有許可權讀取其它磁碟路徑下的檔案，只是沒有辦法讓它顯示而已。


   要解決上面的問題，我們可以使用流的方式把圖片讀取出來，然後再輸出顯示到HTML頁面中。f廢話了半天，下面關鍵的實現程式碼：


   JSP頁面的展示程式碼：


1
2
3
4
5
6
7
8
9
10
11
12
13
14
<img name="person.personImg" id="personImg" alt="頭像照片" src="${person.personImg}" style="width:160px;height:160px;border:1px solid" />
<button id="btnImg" class="btn btn-primary" type="button" title="上傳圖片"     $(function() {
        //讀取頭像照片
        if($("#oid").val()!=="")
        {
            $("#personImg").attr("src","favccxx/person/loadUserPhoto?externalPerson.oid="+$("#oid").val()+"&Time="+(new Date().getTime()));
            $("#personImg").css("display","");
            $("#btnImg").css("display","");
        }else{
            $("#personImg").css("display","none");
            $("#btnImg").css("display","none");       
        }
    }
</script>

   

   採用Struts2框架的java程式碼：

   

1
2
3
4
5
6
7
8
9
10
11
12
13
14
@Action(value = "loadUserPhoto", results = { @Result(name = "success", type = "stream", params = {
            "contentType", "image/jpeg", "inputName", "imageStream" }) })
    public String getImage() {
        if (person.getOid() != null) {
            // 設定圖片
            try {
                Person person = personService.findOne("oid", externalPerson.getOid());
                FileInputStream is = new FileInputStream(person.getPersonImg());
                imageStream = new BufferedInputStream(new FileInputStream(person.getPersonImg()));
            } catch (Exception e) {
            }
        }
        return SUCCESS;
    }
本文轉自 genuinecx 51CTO部落格，原文連結：http://blog.51cto.com/favccxx/1282451，如需轉載請自行聯絡原作者


相關文章