Drag 'n' Drop-Dateien in eine Chrome-Paket-App?

Question

Hat jemand erfolgreich Drag & Drop mit Dateien vom Desktop auf die App implementiert?

Ich habe versucht gerade dabei this drag 'n' drop example in die Indexdatei, aber ich erhalte nur diese Fehlermeldung:

Can't open same-window link to "file:///C:/Users....whatever"; try target="_blank". 

Sie bitte Ihre Geschichten teilen, was Sie versucht haben, und wenn Sie Erfolg haben :)

Answer 1

Ich habe das vor einer Weile getan und es hat funktioniert.

Das Problem, das Sie haben, ist, dass Sie eine Datei-URL erstellen und dann versuchen, zu der URL zu navigieren. Die Navigation schlägt fehl, nicht das Lesen. Aufgrund von Sicherheitseinschränkungen, die wir auf zulässige CSPs gesetzt haben, ist es wahrscheinlich, dass Sie aufgrund eines CSP nicht mit einem anderen CSP überschreiben können.

Aber Sie sollten in der Lage sein, nur die Datei zu lesen und den Inhalt zu verwenden. Sie müssen diesen Beispielcode ändern, um ReadAsText oder ReadAsArrayBuffer anstelle von ReadAsDataURL zu verwenden. Schauen Sie sich here für weitere Details an.

Bitte lassen Sie uns wissen, wie Sie vorankommen!

Answer 2

Einige Ressourcen, Ihnen zu helfen:

New Chrome Packaged Apps CodeLab, dass wir auf Abdeckungen per Drag-and-Drop in den beiden AngularJS und reinen JavaScript gearbeitet haben.

AngularJS per Drag-and-Drop: https://github.com/GoogleChrome/chrome-app-codelab/tree/master/lab5_data/angularjs/2_drop_files

JavaScript Drag-and-Drop: https://github.com/GoogleChrome/chrome-app-codelab/tree/master/lab5_data/javascript/2_drop_files

eine frühe Version von docs Es gibt auch für AngularJS Drag-and-Drop für Chrome an developer.chrome.com /trunk/apps/app_codelab5_data.html#handle_drag_and_dropped_files_and_url

Wir arbeiten an der Dokumentation, um beide Beispiele zu behandeln.

Answer 3

Nur hören für drop wird nicht funktionieren. Sie müssen die Standardfunktionalität dragover verhindern.

document.body.addEventListener('dragover', function(e) { 
    e.preventDefault(); 
} 

document.body.addEventListener('drop', function(e) { 
    alert('it works!') 
}