3

jcropを使用して画像をトリミングできるスクリプトがあります。これを実現するには、 を使用してコンピューターから画像をアップロードする必要がありinput type fileます。アプリケーションの機能を拡張して、ユーザーが Facebook のアルバムから写真を選択できるようにしたいのですが、このコードは機能していますが、画像の URL が返されます。URLから、このような画像オブジェクトを作成します

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私の URL はどこですか。

私の質問は次のとおりです。javascript/ajaxを使用してURLをファイルタイプに変換する方法は? これは送信されるフォームであるため、そのタイプもファイル入力に入れる必要があります。前もって感謝します。

4

1 に答える 1

1

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サンプル ajax 投稿を使用します。

$.post('server.php', {image_url:photo.source}, function(data){
  //do stuff on server response
});
于 2013-05-20T14:24:19.237 に答える