如何使用javascript/ajax將圖像URL轉換爲DOM文件對象？

我有一個腳本，允許我使用jcrop裁剪圖像。要實現這一點，我必須使用input type file從我的電腦上傳圖像。我想擴展我的應用程序的功能，允許用戶從他們的facebook albuns中選擇照片，此代碼正在工作，但它會返回圖像的URL。從URL我創建這樣如何使用javascript/ajax將圖像URL轉換爲DOM文件對象？

var oImage = document.getElementById('preview');

圖像對象但這是一個圖像對象，而不是一個文件對象，它不會讓我得到一些文件禮儀像oImage.size和oImage.type。原代碼是這樣的

<input type="file" name="image_file" id="image_file" onchange="fileSelectHandler()" />

和JavaScript代碼

function fileSelectHandler() { 
    var oFile = $('#image_file')[0].files[0]; 
    ... 
}

現在我有一個函數，回調是一個Facebook的圖片URL，我想它的工作就像如果我上傳來自我的計算機的圖像，因爲此輸入類型文件被引用到服務器。

var oImage = document.getElementById('preview'); 
oImage.src = photo.source;

其中photo.source是我的網址。

所以我的問題是：如何使用javascript/ajax將URL轉換爲文件類型？我需要將該類型放入一個文件輸入中，因爲這是一個將被submited的形式。提前致謝。

來源

2013-05-20 steps

？ –

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_area_shape – 2013-05-20 14:10:20

滾刀，這不是我想要的 – steps

您應該將URL發佈到您的服務器上，然後您可以使用PHP下載遠程圖像並對其進行操作。

提示代碼：

if(isset($_POST['image_url'])){ 
    //Make sure to validate $_POST['image_url'] before using it 
    $image = file_get_contents($_POST['image_url']); 
} else { 
    $image = file_get_contents($_FILES["file"]["tmp_name"]); 
}

我通常使用JQuery， JQuery樣品阿賈克斯後：

$.post('server.php', {image_url:photo.source}, function(data){ 
    //do stuff on server response 
});

要使用JavaScript創建某人的遠程計算機上的本地文件

來源

2013-05-20 14:24:19 skafandri

如何從一個文件發佈到服務器從一個網址是什麼？這有可能做到這一點使用AJAX？（我真的不希望頁面重新加載） – steps

是的，檢查編輯 – skafandri

如何使用javascript/ajax將圖像URL轉換爲DOM文件對象？

回答

相關問題