方式一：

直接給src屬性一個伺服器端資源的地址，img控制元件會自動獲取並解析資源。

方式二：

當訪問的資源不在工程路徑下時，想到的辦法是通過返回給img控制元件位元組流，讓img控制元件解析，開始直接將ajax非同步獲取的位元組流設給了img的src屬性，發現無法顯示圖片，通過http://blog.csdn.net/doulinxu/article/details/59636710的指點，完成通過給src屬性賦予位元組資料來顯示資料，大致為：位元組流先在伺服器端進行Base64編碼，在輸出前需要將MIME的字串位元組輸出，程式碼如下：

@RequestMapping(value="viewDirect")
	public void viewDirect(@RequestParam String url,HttpServletResponse response) throws Exception {
		String filePath = baseDir + "/" + url;
		File file = new File(filePath);
		if (file.exists()&&file.isFile()) {
			String suffix = url.substring(url.lastIndexOf("."), url.length());
			if (suffix==null) {
				return;
			}
			String metaType = "";
			if (suffix.equalsIgnoreCase("jpg")||suffix.equalsIgnoreCase("jpeg")||suffix.equalsIgnoreCase("jpe")) {
				metaType = "data:image/jpeg;base64,";
			}else if (suffix.equalsIgnoreCase("gif")) {
				metaType = "data:image/gif;base64,";
			}else if (suffix.equalsIgnoreCase("bmp")) {
				metaType = "data:image/bmp;base64,";
			}else {
				metaType = "data:image/jpeg;base64,";//預設解碼方式，不合適
			}
			
			InputStream inputStream = new FileInputStream(file);
			ServletOutputStream outputStream = response.getOutputStream();
			
//			outputStream.write(metaType.getBytes());
//			int length = -1;
//			byte[] buffer = new byte[1024];
//			while ((length=inputStream.read(buffer, 0, 1024))!=-1) {
//				byte[] buf;
//				if (length<1024) {
//					byte[] remain = new byte[length];
//					System.arraycopy(buffer, 0, remain, 0, length);
//					buf = Base64Utils.encode(remain);
//				}else {
//					buf = Base64Utils.encode(buffer);
//				}
//				outputStream.write(buf);
//			}
			
			
			byte[] bytes = new byte[(int) file.length()];
			inputStream.read(bytes);
			outputStream.write(metaType.getBytes());//這一行程式碼直接影響是否將接下來的位元組解析為圖片
			outputStream.write(Base64Utils.encode(bytes));
			
			inputStream.close();
			outputStream.flush();
			outputStream.close();
		}
	}
 

html程式碼為：

$.get('${pageContext.request.contextPath }/image/viewDirect',{url:imgs[index]},function(data){
		        	$("#img").attr("src",data);
		        }) 

方式三：

最直接的方法，第二種方法相當於繞了個彎路，其實直接將連結給src屬性，即使不是伺服器工程下的資源，只要img控制元件通過這個src指定的連結能夠獲取到正確的位元組流，就可以正確解析圖片了。程式碼如下：

html程式碼：

$("#img").attr("src",'${pageContext.request.contextPath }/image/viewDirect?url='+imgs[index]);
 

	@RequestMapping(value="viewDirect")
	public void viewDirect(@RequestParam String url,HttpServletResponse response) throws Exception {
		String filePath = baseDir + "/" + url;
		File file = new File(filePath);
		if (file.exists()&&file.isFile()) {
			InputStream inputStream = new FileInputStream(file);
			ServletOutputStream outputStream = response.getOutputStream();
			//方式一
			int length = -1;
			byte[] buffer = new byte[1024];
			while ((length=inputStream.read(buffer, 0, 1024))!=-1) {
				outputStream.write(buffer,0,length);
			}
			//方式二
//			BufferedImage image = ImageIO.read(file);
//			ImageIO.write(image,"JPEG",response.getOutputStream());
			
			//方式三
//			byte[] bytes = new byte[(int) file.length()];
//			inputStream.read(bytes);
//		//	outputStream.write(metaType.getBytes());//這一行程式碼直接影響是否將接下來的位元組解析為圖片
////			outputStream.write(Base64Utils.encode(bytes));
//			outputStream.write(bytes);
			
			inputStream.close();
			outputStream.flush();
			outputStream.close();
		}
	}