ページの幅と高さを満たすHTML object（embed）があります。@ digital-planeによる回答は通常のWebページで機能しますが、ユーザーが埋め込みオブジェクトにドロップした場合は機能しません。したがって、別のソリューションが必要でした。
イベントキャプチャフェーズの使用に切り替えると、埋め込みオブジェクトがイベントを受け取る前にイベントを取得できます（trueイベントリスナー呼び出しの最後の値に注意してください）。
// document.body or window
document.body.addEventListener("dragover", function(e){
e = e || event;
e.preventDefault();
console.log("over true");
}, true);
document.body.addEventListener("drop", function(e){
e = e || event;
e.preventDefault();
console.log("drop true");
}, true);
次のコード（@ digital-planeの回答に基づく）を使用すると、ページがドラッグターゲットになり、オブジェクトの埋め込みがイベントをキャプチャして画像を読み込まないようにします。
document.body.addEventListener("dragover", function(e){
e = e || event;
e.preventDefault();
console.log("over true");
}, true);
document.body.addEventListener("drop",function(e){
e = e || event;
e.preventDefault();
console.log("Drop true");
// begin loading image data to pass to our embed
var droppedFiles = e.dataTransfer.files;
var fileReaders = {};
var files = {};
var reader;
for (var i = 0; i < droppedFiles.length; i++) {
files[i] = droppedFiles[i]; // bc file is ref is overwritten
console.log("File: " + files[i].name + " " + files[i].size);
reader = new FileReader();
reader.file = files[i]; // bc loadend event has no file ref
reader.addEventListener("loadend", function (ev, loadedFile) {
var fileObject = {};
var currentReader = ev.target;
loadedFile = currentReader.file;
console.log("File loaded:" + loadedFile.name);
fileObject.dataURI = currentReader.result;
fileObject.name = loadedFile.name;
fileObject.type = loadedFile.type;
// call function on embed and pass file object
});
reader.readAsDataURL(files[i]);
}
}, true);
Mac上のFirefoxでテスト済み。