在頁面上顯示圖像而不上傳到服務器

這可能在currunt瀏覽器會話上顯示圖像而不上傳到服務器？在頁面上顯示圖像而不上傳到服務器

我試圖在用戶輸入上傳按鈕時在我的php頁面上顯示圖片，上傳的圖片將在目標網址上出現temprory。

這裏是我的HTML表單

<form action="demo.php"method="post"enctype="multipart/form-data"> 
<input type="file"name="uf"> 
<input type="submit"value="upload"> 
</form>

而且目標文件：

<?php 
$pic=$_FILES["uf"]["name"]; 
echo "<img src='$pic'>";

它不顯示圖像。那麼這是否有可能按照我的方式顯示圖像？

任何幫助都非常appriciated！

謝謝！

來源

2016-01-02 starkeen

關於SO的以下回答可能會有所幫助：http://stackoverflow.com/questions/3996004/load-local-image-into-browser-using-javascript –

如果你不想上傳圖片到服務器，那麼你的問題中的[tag：php]標籤和PHP代碼不合適。 – axiac

您可以將圖像轉換爲base64，請參閱http://www.motobit.com/util/base64/css-images-to-base64.asp。

它會生成一個<img />這樣的：<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAA// lot more characters" />

這是在我的腦海裏，一個不好的做法，因爲你的瀏覽器緩存，以便在圖像避免發送大量請求，因爲他已經有一個圖像。

在PHP中：

$path = 'myfolder/myimage.png'; 
$type = pathinfo($path, PATHINFO_EXTENSION); 
$data = file_get_contents($path); 
$base64 = 'data:image/' . $type . ';base64,' . base64_encode($data);

（摘自）How to convert an image to base64 encoding?

來源

2016-01-02 17:03:55

爲什麼不好的做法？ – Ajey

@Ajey：因爲如果你不想在瀏覽器中加載圖片，你仍然會加載base64圖片的內容。在我的網絡刮板中，我禁用了圖像加載，以便儘量減少對服務器的請求，並強制您下載圖像數據。對於谷歌機器人等，如果他們不需要加載圖像等，它將是相同的。 –

@Ajey：第二個原因：緩存瀏覽器。瀏覽器存儲您在網站上下載的圖像，以避免對服務器提出太多請求。使用base64，您強制加載圖片，例如，如果客戶端處於活動狀態，您應該每個客戶端每小時避免500次請求。 –

在這裏你去：http://jsfiddle.net/LvsYc/

HTML：

<form method="post" enctype="multipart/form-data"> 
    <input type="file" id="imgInp" /> 
    <img id="blah" src="#" alt="your image" /> 
</form>

JS（需要的jQuery）：

function readURL(input) { 
    if (input.files && input.files[0]) { 
     var reader = new FileReader(); 

     reader.onload = function (e) { 
      $('#blah').attr('src', e.target.result); 
     } 

     reader.readAsDataURL(input.files[0]); 
    } 
} 

$("#imgInp").change(function(){ 
    readURL(this); 
});

來源

2016-01-02 17:07:11

在頁面上顯示圖像而不上傳到服務器

回答

相關問題