В File
JavaScript є об’єкт. Я хочу створити його для тестування.
Я спробував new File()
, але я отримую помилку "Незаконний конструктор".
Чи можливо створити File
об’єкт?
Посилання на об’єкт файлу: https://developer.mozilla.org/en/DOM/File
В File
JavaScript є об’єкт. Я хочу створити його для тестування.
Я спробував new File()
, але я отримую помилку "Незаконний конструктор".
Чи можливо створити File
об’єкт?
Посилання на об’єкт файлу: https://developer.mozilla.org/en/DOM/File
Відповіді:
Відповідно до специфікації API файлу W3C, конструктору файлів потрібні 2 (або 3) параметри.
Отже, щоб створити порожній файл:
var f = new File([""], "filename");
Третій аргумент виглядає так:
var f = new File([""], "filename.txt", {type: "text/plain", lastModified: date})
Він працює в FireFox, Chrome і Opera, але не в Safari або IE / Edge.
file = new Blob([blobdata], {type: filetype, lastModified: filelastModified}); file.name = filename
Тепер ти можеш!
var parts = [
new Blob(['you construct a file...'], {type: 'text/plain'}),
' Same way as you do with blob',
new Uint16Array([33])
];
// Construct a file
var file = new File(parts, 'sample.txt', {
lastModified: new Date(0), // optional - default = now
type: "overide/mimetype" // optional - default = ''
});
var fr = new FileReader();
fr.onload = function(evt){
document.body.innerHTML = evt.target.result + "<br><a href="+URL.createObjectURL(file)+" download=" + file.name + ">Download " + file.name + "</a><br>type: "+file.type+"<br>last modified: "+ file.lastModifiedDate
}
fr.readAsText(file);
new File([], '')
Illegal constructor
на Chrome 37 / Ubuntu
Оновлення
BlobBuilder застарів побачити, як ви користуєтесь ним, якщо ви використовуєте його для тестування.
В іншому випадку застосуйте наведене нижче стратегію міграції переходу на Blob , наприклад відповіді на це запитання .
В якості альтернативи є Blob, який ви можете використовувати замість File, оскільки це інтерфейс файлу, що походить за специфікацією W3C :
interface File : Blob {
readonly attribute DOMString name;
readonly attribute Date lastModifiedDate;
};
Інтерфейс файлів заснований на Blob, успадковуючи функціональність блобу та розширюючи його для підтримки файлів у системі користувача.
Використання подібного BlobBuilder на існуючому методі JavaScript, який вимагає завантаження файлу через файл XMLHttpRequest
та надання йому Blob, працює так:
var BlobBuilder = window.MozBlobBuilder || window.WebKitBlobBuilder;
var bb = new BlobBuilder();
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://jsfiddle.net/img/logo.png', true);
xhr.responseType = 'arraybuffer';
bb.append(this.response); // Note: not xhr.responseText
//at this point you have the equivalent of: new File()
var blob = bb.getBlob('image/png');
/* more setup code */
xhr.send(blob);
Інша частина зразка знаходиться на jsFiddle більш повно, але вона не буде успішно завантажена, оскільки я не можу розкрити логіку завантаження в довгостроковій перспективі.
DataTransferItemList.add
File
не вимагає Blob
. Отже, до початкового запитання: Як інстанціювати файл ?
Тепер це можливо та підтримується всіма основними браузерами: https://developer.mozilla.org/en-US/docs/Web/API/File/File
var file = new File(["foo"], "foo.txt", {
type: "text/plain",
});
Ідея ... Створити об’єкт File (api) в javaScript для зображень, вже наявних у DOM:
<img src="../img/Products/fijRKjhudDjiokDhg1524164151.jpg">
var file = new File(['fijRKjhudDjiokDhg1524164151'],
'../img/Products/fijRKjhudDjiokDhg1524164151.jpg',
{type:'image/jpg'});
// created object file
console.log(file);
Не робіть цього! ... (але я це все одно зробив)
-> консоль дає результат, подібний до файлу об'єкта:
File(0) {name: "fijRKjokDhgfsKtG1527053050.jpg", lastModified: 1527053530715, lastModifiedDate: Wed May 23 2018 07:32:10 GMT+0200 (Paris, Madrid (heure d’été)), webkitRelativePath: "", size: 0, …}
lastModified:1527053530715
lastModifiedDate:Wed May 23 2018 07:32:10 GMT+0200 (Paris, Madrid (heure d’été)) {}
name:"fijRKjokDhgfsKtG1527053050.jpg"
size:0
type:"image/jpg"
webkitRelativePath:""__proto__:File
Але розмір об'єкта неправильний ...
Чому мені потрібно це робити?
Наприклад, для повторної передачі вже завантаженої форми зображення під час оновлення продукту, а також додаткових зображень, доданих під час оновлення
Illegal constructor
на Chrome 37 / Ubuntu, так що ні, це не працює