0

私のウェブサイトに画像アップローダーを追加しようとしています。jcrop を使用した JavaScript があります (このスクリプトは私のものではありません。インターネットで見つけたものを使用しました)。このスクリプトは、コンピューターから画像ファイルを取得してトリミングし、php に渡します。フォーム出力を javascrip ファイルに変換するところから始まります。

var oFile = $('#image_file')[0].files[0];

これはスクリプトの重要な行であり、他のすべては oFile から派生します。ユーザーがWebリンクを追加して写真をアップロードできるようにしたい（リンクを投稿することで、ローカルホストに画像ファイルを保存できるようにしました）。javascript を使用してローカルホストから画像を開き、上記の行の oFile 変数と同じ形式にして、スクリプトが機能するようにするにはどうすればよいですか?

4

1 に答える 1

0

最新のブラウザでバイナリ Ajaxを使用して、リソースをファイルとして取得できます。

var oReq = new XMLHttpRequest();
oReq.open("GET", fileURLGivenByUser, true);
oReq.responseType = "blob";

oReq.onload = function(oEvent) {
  var oFile = oReq.response;
  processTheFileSomehow(oFile);
};

oReq.send();

これは、次のいずれかである限り機能します。

  • fileURLGivenByUserスクリプトを実行しているページと同じドメインにある (たとえば、クロッピング スクリプトが実行されfoo.comていて、画像リンクもオンになっているfoo.com)、または

  • ターゲット画像リソースは、Access-Control-Allow-Origin: *CORS 応答ヘッダーと共に提供されます (たとえば、クロッピング スクリプトは で実行されfoo.com、画像リンクは で実行されbar.com、bar.com許容可能な CORS ヘッダーを含むファイルが提供されます)。

したがって、ユーザーがlocalhostリンクを使用するには、ユーザーがローカル Web サーバーを実行している必要があり、その Web サーバーはAccess-Control-Allow-Origin: *or Access-Control-Allow-Origin: whateverdomainyouuse.com(つまり、クロッピング スクリプトが実行されるドメイン) で画像を提供する必要があります。

CORS の制限が厳しすぎる場合 (そうである可能性が高い)、ホストでサーバー側のプロキシを使用できます。たとえば、あなたが要求するとき

http://mydomain.com/proxy/http://targetdomain.com/image.png

サーバーは、の内容でリクエストとレスポンスを行います

http://targetdomain.com/image.png
于 2013-07-09T13:31:10.273 に答える