Не вдалося виконати "createObjectURL" на "URL":


132

Відображення нижче помилки в Safari.

Не вдалося виконати "createObjectURL" на "URL": не знайдено жодної функції, яка б відповідала наданій підпису.

Мій код:

function createObjectURL(object) {
    return (window.URL) ? window.URL.createObjectURL(object) : window.webkitURL.createObjectURL(object);
}

Це мій код для зображення:

function myUploadOnChangeFunction() { 
    if (this.files.length) { 
       for (var i in this.files) { 
           if (this.files.hasOwnProperty(i)) { 
              var src = createObjectURL(this.files[i]); 
              var image = new Image(); 
              image.src = src; 
              imagSRC = src; 
              $('#img').attr('src', src); 
            }
       }           
   } 
} 

6
Привіт Хардіку, що ти передаєш своїй createObjectURL(...)функції, коли отримуєш цю помилку?
Артур Веборг

2
Об'єкт повинен бути файловим об'єктом або об'єктом Blob, щоб створити URL-адресу об'єкта for.see devdocs.io/dom/window.url.createobjecturl
yxf

1
Це мій код для зображення: функція myUploadOnChangeFunction () {if (this.files.length) {for (var i in this.files) {if (this.files.hasOwnProperty (i)) {var src = createObjectURL (це. файли [i]); var image = нове зображення (); image.src = src; imagSRC = src; $ ('# img'). attr ('src', src); }}}}
Хардік Манданкаа

@HardikMansaraa Вперед та відредагуйте це у своєму питанні.
soktinpk

window.URL.createObjectURL('broken')кидає помилку:Uncaught TypeError: Failed to execute 'createObjectURL' on 'URL': No function was found that matched the signature provided.
Хуан Мендес

Відповіді:


150

ОНОВЛЕННЯ

Подумайте про те, щоб уникнути createObjectURL()способу, поки браузери відключають підтримку. Просто приєднайте MediaStreamоб'єкт безпосередньо до srcObjectвластивості, HTMLMediaElementнаприклад, <video>елемента.

const mediaStream = new MediaStream();
const video = document.getElementById('video-player');
video.srcObject = mediaStream;

Однак якщо вам потрібно працювати MediaSource, Blobабо Fileвам потрібно створити URL-адресу URL.createObjectURL()і призначити її HTMLMediaElement.src.

Детальніше читайте тут: https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/srcObject


Старша відповідь

Я зазнав таку ж помилку, коли перейшов до createObjectURLвихідних даних:

window.URL.createObjectURL(data)

Вона повинна бути Blob, Fileабо MediaSourceоб'єкт, сам не дані. Це працювало для мене:

var binaryData = [];
binaryData.push(data);
window.URL.createObjectURL(new Blob(binaryData, {type: "application/zip"}))

Перевірте також MDN для отримання додаткової інформації: https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL


2
Привіт .. Що робити, якщо я маю справу з "application / pdf"? Я отримую таку ж помилку на консолі, коли я маю справу з файлом PDF
N Sharma

@mimo Я використовую той самий код для завантаження файлу. Але два файли завантажуються. Один правильний файл, а один додатковий файл з тим самим іменем, але невдалий статус завантажується. Чи маєте ви уявлення, чому це відбувається?
Шардул

Мене плутає цей коментар, в MDN це відмовляє від використання засобів URL.createObjectURL()масової інформації. Однак він не вказує НЕ використовувати його для введення файлів, як зазначено в початковому запитанні.
alextrastero

140

Ця помилка викликана тим, що функція createObjectURLзастаріла для Google Chrome

Я змінив це:

video.src=vendorUrl.createObjectURL(stream);
video.play();

до цього:

video.srcObject=stream;
video.play();

Це працювало для мене.


+1 Див. Приклад з резервним розробником.mozilla.org
en-US/docs/Web/API/HTMLMediaElement/…

createObjectURL не застаріло, як показано тут, але більше не приймає об’єкт потоку медіа
goodies4uall

Це має бути відповіддю.
ДомінгоР

існує ще одна проблема: video.play () видається обмеженою: DOMException: play () може бути ініційована лише жестом користувача.
користувач889030

@ user889030 це означає, що ви не можете відкрити веб-сторінку і очікувати запуску потоку веб-камери. Ви повинні дозволити користувачу явно запустити потік. Просто
натисніть

26

Мій код був порушений, оскільки я використовував застарілу техніку. Раніше це було:

video.src = window.URL.createObjectURL(localMediaStream);
video.play();

Потім я замінив це на це:

video.srcObject = localMediaStream;
video.play();

Це прекрасно працювало.

РЕДАКТУВАННЯ: Останнім часом localMediaStreamзастаріле та замінено на MediaStream. Останній код виглядає приблизно так:

video.srcObject = MediaStream;

Список літератури:

  1. Застаріла техніка: https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL
  2. Сучасна застаріла техніка: https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/srcObject
  3. Сучасна техніка: https://developer.mozilla.org/en-US/docs/Web/API/MediaStream

9

У мене була така ж помилка і для MediaStream. Рішення встановлюється потоком до srcObject.

З документів :

Важливо: Якщо у вас все ще є код, який спирається на createObjectURL () для приєднання потоків до медіа-елементів, вам потрібно оновити свій код, щоб просто встановити srcObject безпосередньо на MediaStream.



3

Проблема полягає в тому, що надані в циклі ключі не посилаються на індекс файлу.

for (var i in this.files) {
    console.log(i);
}

Вихід з вищевказаного коду:

0
length
item

Але очікувалося:

0
1
2
etc...

Тоді помилка виникає, коли браузер намагається виконати, наприклад:

window.URL.createObjectURL(this.files["length"])

Я пропоную реалізацію на основі наступного коду:

var files = this.files;
for (var i = 0; i < files.length; i++) {
    var file = files[i],
        src = (window.URL || window.webkitURL).createObjectURL(file);
    ...
}

Я сподіваюся, що це може комусь допомогти.

Привітання!


1

Якщо ви використовуєте ajax, можна додати параметри xhrFields: { responseType: 'blob' }:

$.ajax({
  url: 'yourURL',
  type: 'POST',
  data: yourData,
  xhrFields: { responseType: 'blob' },
  success: function (data, textStatus, jqXHR) {
    let src = window.URL.createObjectURL(data);
  }
});

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.