3

ドラッグ アンド ドロップ API を使用してさまざまな Web サイトからリソースを収集する Web アプリを開発しています。

この API を使用して、ドラッグされたリソースの HTML を解析して、リンクの URL と、リンク内のテキストと画像を取得するつもりです。

Firefox 19 (Windows と Mac の両方) で問題なく動作します。Chrome 25 では動作していましたが、最新のアップデート以降、Windows では動作するものの、Chrome for Mac 26 では動作しなくなりました。

私が使用しているコードのスニペットを次に示します。jsfiddle で試すことができます: http://jsfiddle.net/rYcyP/

document.getElementById("destination").addEventListener("dragover", function(_event) {
    _event.stopPropagation();
    _event.preventDefault();
}, false);
document.getElementById("destination").addEventListener("drop", function(_event) {
    _event.stopPropagation();
    _event.preventDefault();
    console.log(Array.prototype.slice.call(_event.dataTransfer.types));
}, false);

たとえば、ニュース Web サイト (または上記のスタック オーバーフローの広告、または私の gravatar) から画像を埋め込んだリンクをドラッグすると、Firefox でコンソールに次のように表示されます。

["text/x-moz-url", "text/x-moz-url-data", "text/x-moz-url-desc", "text/uri-list", "text/_moz_htmlcontext", "text/_moz_htmlinfo", "text/html", "text/plain", "application/x-moz-nativeimage", "application/x-moz-file-promise", "application/x-moz-file-promise-url", "application/x-moz-file-promise-dest-filename", "Files"]

これは私が実際に必要とするよりもはるかに多くのデータですが、text/html はここにあります。

Chrome 26.0.1410.43 Windows の場合:

["text/plain", "text/uri-list", "text/html", "Files"]

それでも私にとっては良いことです。

MacOS X で Chrome 26.0.1410.43 を使用すると、次のようになります。

["text/uri-list"]

これには、Web アプリに必要な「text/html」が含まれていません。

よろしくお願いいたします。

4

2 に答える 2