diff --git a/src/components/media-loader.js b/src/components/media-loader.js index eec6a12fd764bbecb2f471167c6a776758f34990..2301d1563fb5d5c6a99916759d28c943a67b147c 100644 --- a/src/components/media-loader.js +++ b/src/components/media-loader.js @@ -5,6 +5,7 @@ AFRAME.registerComponent("media-loader", { schema: { src: { type: "string" }, token: { type: "string" }, + index: { type: "number" }, resize: { default: false } }, @@ -59,7 +60,7 @@ AFRAME.registerComponent("media-loader", { // TODO: correctly handle case where src changes async update(oldData) { try { - const { src, token } = this.data; + const { src, token, index } = this.data; if (src !== oldData.src && !this.showLoaderTimeout) { this.showLoaderTimeout = setTimeout(this.showLoader, 100); @@ -67,7 +68,7 @@ AFRAME.registerComponent("media-loader", { if (!src) return; - const { raw, images, contentType } = await resolveMedia(src, token); + const { raw, images, contentType } = await resolveMedia(src, token, false, index); if (token) { if (this.blobURL) { diff --git a/src/utils/media-utils.js b/src/utils/media-utils.js index dc7d5773085acee914e3b70d894d0b14adfe221b..5175596beb040edeed3863cebf3e5f08386b1adf 100644 --- a/src/utils/media-utils.js +++ b/src/utils/media-utils.js @@ -17,9 +17,10 @@ const fetchContentType = async (url, token) => { }; const resolveMediaCache = new Map(); -export const resolveMedia = async (url, token, skipContentType) => { +export const resolveMedia = async (url, token, skipContentType, index) => { const parsedUrl = new URL(url); - if (resolveMediaCache.has(url)) return resolveMediaCache.get(url); + const cacheKey = `${url}|${index}`; + if (resolveMediaCache.has(cacheKey)) return resolveMediaCache.get(cacheKey); const isNotHttpOrHttps = parsedUrl.protocol !== "http:" && parsedUrl.protocol !== "https:"; const resolved = @@ -28,7 +29,7 @@ export const resolveMedia = async (url, token, skipContentType) => { : await fetch(mediaAPIEndpoint, { method: "POST", headers: { "Content-Type": "application/json" }, - body: JSON.stringify({ media: { url } }) + body: JSON.stringify({ media: { url, index } }) }).then(r => r.json()); if (!isNotHttpOrHttps && !skipContentType) { @@ -37,7 +38,7 @@ export const resolveMedia = async (url, token, skipContentType) => { resolved.contentType = contentType; } - resolveMediaCache.set(url, resolved); + resolveMediaCache.set(cacheKey, resolved); return resolved; };