2015-05-20 20 views
5

Merhaba ben böyle yüklenir kullanıcının profil resmini gösterecek bir sayfa vardır:zaten yüklenmiş?

$ Şimdi göndermeniz gerekmektedir

("# imgProfile") özn ('src', 'http://myserver/user.png'). Bu görüntü, HTML 5 Dosya API'sini kullanarak, ancak bunu yapmak için önce görüntümü Dosya API'sine dönüştürmem gerekiyor. Ben input type = "dosya" ile birlikte internet iş yerinde gördük, ama ben zaten bu görüntüyü sahip Tüm numuneler, yerel bilgisayardaki görüntüyü seçerek değilim. input type = "file" eleman dan bu bir https://developer.mozilla.org/en-US/docs/Using_files_from_web_applications kullanımı Dosya API gibi

Tüm örnekler

+1

bahsediyor önizleme büyük olasılıkla yükleyerek ÖNCE bir önizlemesi. Sunucunuzda bulunuyorsa, normal bir görüntü gibi yükleyin. Html veya java komut dosyasında img etiketleri oluşturma. – inquam

cevap

0

görüntü zaten sunucuda bulunuyorsa, hepsi senden soldan Dosya API ile karıştırılmamalıdır etmeyin

<img src="serverAddress\yourImage.png" alt="Image Something" /> 
+0

Ama önizleme gibi görünmüyor istediği şeydir. Zaten sunucuya yüklenen dosyaya sahip ve sadece onu görüntülemek istiyor. Bu yüzden, örneğini yapmak istediği şeyle karıştırdı. – inquam

+0

Sizin sadece doğru ... Ben cevabımı değişti –

0

dosya sunucuda zaten: do görüntü URL'ye referanslı bir <img> etiketi ilan etmek ve onu göstermektir. Yair Nevet 'ın cevabı diyor gibi, bunu kullanabilirsiniz. Eğer gerçekten bunu bir File nesneyi olmak için

, belki (eğer çalışırsa ben bilmiyorum) bunu kullanabilir.

var getFilelikeBlobFromImageElement = (function closure() { 
     var canvasElement = document.createElement("canvas"); 

     return function(imageElement) { 
       canvasElement.width = imageElement.width; 
       canvasElement.height = imageElement.height; 
       var canvasContext = canvasElement.getContext("2d"); 
       canvasContext.drawImage(imageElement, 0, 0); 

       var imageData = canvasContext.getImageData(0, 0, imageElement.width, imageElement.height).data; 
       var buffer = new Uint8Array(imageData.length); 
       for(var index = 0; index < imageData.length; index++) 
        buffer[index] = imageData[index]; 

       var imageBlob = new Blob(buffer); 
       imageBlob.lastModifiedDate = new Date(); 
       imageBlob.name = /\/([^\/]+)$/.exec(imageElement.src)[1]; 

       return imageBlob; // A `File`-like `Blob` object. 
      }; 
    })(); 

Kullanımı:

getFilelikeBlobFromImageElement(document.getElementById("imgProfile")); 

To get the Blob from a <canvas>

To make a BlobFile-like

İlgili konular