圖像無法加載在外部web瀏覽器（Firefox）

我已經創建了動態webproject，我使用下面的代碼來上傳圖像並從相同的位置檢索。當我試圖在外部瀏覽器中運行該應用程序時，它顯示矩形框而不是image.getting在外部Web瀏覽器中加載出錯。圖像無法加載在外部web瀏覽器（Firefox）

import javax.servlet.*; 
import javax.servlet.http.*; 
import java.io.*; 
import java.util.Iterator; 
import java.util.List; 
import java.util.Random; 
import java.util.regex.Matcher; 
import java.util.regex.Pattern; 
import java.sql.*; 
import org.apache.commons.fileupload.servlet.ServletFileUpload; 
import org.apache.commons.fileupload.disk.*; 
import org.apache.commons.fileupload.*; 

public class UploadImage extends HttpServlet { 
private static final long serialVersionUID = 1L; 
public void doPost(HttpServletRequest request, HttpServletResponse response) 
      throws ServletException, IOException { 
     PrintWriter out = response.getWriter(); 
     boolean isMultipart = ServletFileUpload.isMultipartContent(request); 
     System.out.println("request: " + request); 
     if (!isMultipart) { 
      System.out.println("File Not Uploaded"); 
     } else { 
      FileItemFactory factory = new DiskFileItemFactory(); 
      ServletFileUpload upload = new ServletFileUpload(factory); 
      List items = null; 

    try 
    { 
      items = upload.parseRequest(request); 
      System.out.println("items: " + items); 
    } 
    catch (FileUploadException e) 
    { 
    e.printStackTrace(); 
    } 
     Iterator itr = items.iterator(); 
     while (itr.hasNext()) { 
     FileItem item = (FileItem) itr.next(); 
     if (item.isFormField()) 
      { 
       String name = item.getFieldName(); 
       System.out.println("name: " + name); 
       String value = item.getString(); 
       System.out.println("value: " + value); 
     } 
      else 
      { 
      try 
       { 
      String itemName = item.getName(); 
      Random generator = new Random(); 
      int r = Math.abs(generator.nextInt()); 
       String reg = "[.*]"; 
      String replacingtext = ""; 
      System.out.println("Text before replacing is:-"+ itemName); 
      Pattern pattern = Pattern.compile(reg); 
      Matcher matcher = pattern.matcher(itemName); 
      StringBuffer buffer = new StringBuffer(); 
       while (matcher.find()) 
       { 
      matcher.appendReplacement(buffer, replacingtext); 
      } 
      int IndexOf = itemName.indexOf("."); 
      String domainName = itemName.substring(IndexOf); 
      System.out.println("domainName: " + domainName); 
       String finalimage = buffer.toString() + "_" + r+ domainName; 
      System.out.println("Final Image===" + finalimage); 
     File savedFile = new File("D:\\test1\\" + "images\\"+ finalimage); 
      item.write(savedFile); 
     out.println("<html>"); 
     out.println("<body>"); 
      out.println("<table><tr><td>"); 
      out.println("<img src=D:\\test1\\images\\" + finalimage+ ">"); 
     out.println("</td></tr></table>"); 
      Connection conn = null; 
      String url = "jdbc:oracle:thin:@//localhost:1521/erp"; 
      String username = "system"; 
      String userPassword = "manager"; 
     String strQuery = null; 
     try 
      { 
     System.out.println("itemName::::: " + itemName); 
     Class.forName("oracle.jdbc.driver.OracleDriver"); 
     conn = DriverManager.getConnection(url, username,userPassword); 
     Statement st = conn.createStatement(); 
     strQuery = "insert into testimage values('"+ finalimage + "')"; 
      int rs = st.executeUpdate(strQuery); 
     System.out.println("Query Executed Successfully++++++++++++++"); 
      out.println("image inserted successfully"); 
     out.println("</body>"); 
      out.println("</html>"); 
     } 
      catch (Exception e) 
      { 
     System.out.println(e.getMessage()); 
     } 
      finally 
      { 
     conn.close(); 
     } 
     } 
      catch (Exception e) 
      { 
     e.printStackTrace(); 
      } 
       } 
      } 
     } 
    } 
}

來源

2013-04-20 user2169941

您正在設置引用本地文件的'src'屬性：'D：\\ ...'。當然，一個「外部」客戶對此一無所知。 – ubik 2013-04-20 10:16:17

那麼如何給D盤提供一個路徑，讓瀏覽器能夠加載圖片？ – user2169941 2013-04-20 10:24:24

這就是問題所在。你應該**不要**使用本地路徑。您應該將圖像保存在服務器的某個位置，並在其中提供GET端點，以便在請求時返回圖像。 'src'屬性應該是該端點的URL。 – ubik 2013-04-20 10:26:20

的過程大致如下：

終端用戶對某個URL請求的網頁。
Webbrowser將HTTP請求發送到給定URL上的網絡服務器。
Web服務器檢索HTTP請求並將所需的網頁作爲HTTP響應返回。
Webbrowser以HTML代碼的風格檢索HTTP響應。
Webbrowser會解析HTML代碼以呈現它並遇到<img>元素。
Webbrowser嘗試按照其src屬性中指定的位置下載圖像。

而且有失敗的地方。您指定了固定的本地磁盤文件系統路徑，該路徑僅在Web瀏覽器與網絡服務器在物理上相同的機器（如在開發環境中，但絕對不在生產環境中）運行時纔有效。您不能也不應該期望最終用戶在其本地磁盤文件系統的指定位置上具有所需的映像。更重要的是，你不能也不應該期望最終用戶擁有一個D:磁盤，更不用說終端用戶也在運行Windows。

您應該在圖像的src屬性中指定一個完整的URL。確切地說，您可以在網頁瀏覽器的地址欄中輸入以查看圖像，從http://或https://方案開始。

有幾種方法來實現這一目標，這兩個最流行的方式是：

揭露上傳文件夾作爲虛擬主機。這是在服務器配置中完成的。你沒有告訴你用哪一個，但我們認爲它的Tomcat像許多初學者會使用：打開/conf/server.xml文件和下面的元素添加到<Host>元素：
```
<Context docBase="D:\test1\images" path="/images" /> 
```
的docBase指定根所有文件所在的文件夾以及path指定您將在URL中的域部分之後看到的上下文路徑。這樣可以通過http://example.com/images/...訪問圖像。
```
out.println("<img src=\"/images/" + finalimage+ "\">"); 
```

創建一個簡單的servlet從磁盤中讀取圖像並且具有設置所需的響應報頭告訴有關該文件的內容的類型，長度和處置，使得瀏覽器的瀏覽器之後將其寫入到響應知道如何處理它：

@WebServlet("/images/*") 
public class ImageServlet extends HttpServlet { 

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 
     String filename = URLDecoder.decode(request.getPathInfo(), "UTF-8"); 
     File file = new File("D:\\test1\\images", filename); 
     response.setHeader("Content-Type", getServletContext().getMimeType(file.getName())); 
     response.setHeader("Content-Length", String.valueOf(file.length())); 
     response.setHeader("Content-Disposition", "inline; filename=\"" + file.getName() + "\""); 
     Files.copy(file.toPath(), response.getOutputStream()); 
    } 

}

也這樣的圖像將通過http://example.com/images/...訪問。

out.println("<img src=\"/images/" + finalimage+ "\">");

無關到具體的問題，在一個servlet發光HTML是一個非常貧窮的做法。你應該爲此使用JSP。另請參閱編碼風格和建議部分our servlets wiki page。

您是否還想過上傳的圖片碰巧與現有上傳的圖片具有相同的文件名？

來源

2013-04-20 12:21:01 BalusC

+1提醒最基本的是在服務器內部生成Response對象，因此ergo資源將被相應地搜索和找到。 – 2013-04-20 23:30:02

圖像無法加載在外部web瀏覽器（Firefox）

回答

相關問題