Web Stories Compatibility - Media Failing to Load
Hello, I am encountering an issue when enabling Web Stories for WordPress plugin and Cloudinary. It appears the images do not render as expected in the Story player when previewing the story. cts the image preview in the Web Stories story player. The below is the console error message.
error-reporting.js:205 Failed to load: https://res.cloudinary.com/dvo1qnusu/images/f_auto,q_auto/v1634577339/cropped-pexels-zachary-debottis-2568539-scaled-1_1415d828d/cropped-pexels-zachary-debottis-2568539-scaled-1_1415d828d.jpg?_i=AA
Ae @ error-reporting.js:205
Promise.catch (async)
c @ resources-impl.js:1332
setState @ finite-state-machine.js:53
doPass @ resources-impl.js:642
(anonymous) @ resources-impl.js:119
sc @ pass.js:93
Vf.dg @ pass.js:39
(anonymous) @ timer-impl.js:70
setTimeout (async)
delay @ timer-impl.js:76
schedule @ pass.js:78
schedulePass @ resources-impl.js:507
xa @ resources-impl.js:1608
scheduleLayoutOrPreload @ resources-impl.js:1547
c @ resources-impl.js:1200
setState @ finite-state-machine.js:53
doPass @ resources-impl.js:642
(anonymous) @ resources-impl.js:119
sc @ pass.js:93
Vf.dg @ pass.js:39
(anonymous) @ timer-impl.js:63
Promise.then (async)
delay @ timer-impl.js:58
schedule @ pass.js:78
schedulePass @ resources-impl.js:507
(anonymous) @ resources-impl.js:441
Promise.then (async)
Vi @ resources-impl.js:440
Oi @ resources-impl.js:368
upgraded @ resources-impl.js:485
ed @ custom-element.js:414
Qf @ custom-element.js:1322
Nc @ custom-element.js:1245
upgrade @ custom-element.js:374
Hf @ custom-element-registry.js:96
Ff @ custom-element-registry.js:39
Fl @ extensions-impl.js:389
(anonymous) @ extensions-impl.js:371
Wd @ style-installer.js:58
El @ extensions-impl.js:367
(anonymous) @ extensions-impl.js:339
addDocFactory @ extensions-impl.js:444
addElement @ extensions-impl.js:338
f @ amp-story.js:2503
registerExtension @ extensions-impl.js:161
(anonymous) @ runtime.js:175
Promise.then (async)
(anonymous) @ runtime.js:171
af @ chunk.js:189
Ze @ chunk.js:408
(anonymous) @ chunk.js:464
Promise.then (async)
ff @ chunk.js:463
xa @ chunk.js:482
runForStartup @ chunk.js:367
Ze @ chunk.js:58
Ll @ runtime.js:285
b @ runtime.js:186
c.AMP.push @ runtime.js:218
(anonymous) @ amp-story-1.0.mjs:1
cropped-pexels-abdullahi-abdulquadri-9876711-scaled-1-225x300.jpg:1 GET https://testsite.cmsdevrel.com/c_scale/v1634577336/cropped-pexels-abdullahi-abdulquadri-9876711-scaled-1_14196013b/cropped-pexels-abdullahi-abdulquadri-9876711-scaled-1-225x300.jpg?_i=AA 404
----------------------
[BACKGROUND-BLUR] Failed to load the amp-img or amp-video.
pb @ log.js:284
error @ base.js:206
(anonymous) @ background-blur.js:189
Promise.catch (async)
(anonymous) @ background-blur.js:188
zh @ background-blur.js:182
yh @ background-blur.js:97
update @ background-blur.js:81
ha @ amp-story.js:1380
(anonymous) @ amp-story.js:957
Promise.then (async)
ak @ amp-story.js:954
layoutCallback @ amp-story.js:920
(anonymous) @ custom-element.js:1627
(anonymous) @ index.js:187
fa @ index.js:186
layoutCallback @ custom-element.js:1627
(anonymous) @ resource.js:883
Tk @ vsync-impl.js:455
lh @ vsync-impl.js:412
requestAnimationFrame (async)
Qk @ vsync-impl.js:379
xa @ vsync-impl.js:373
run @ vsync-impl.js:172
runPromise @ vsync-impl.js:187
ei @ mutator-impl.js:194
measureMutateElement @ mutator-impl.js:151
measureMutateElement @ base-element.js:958
mutateElement @ base-element.js:938
wk @ amp-story.js:1602
onResize @ amp-story.js:1588
buildCallback @ amp-story.js:475
(anonymous) @ custom-element.js:544
Promise.then (async)
buildInternal @ custom-element.js:543
build @ resource.js:327
Vi @ resources-impl.js:433
Oi @ resources-impl.js:368
upgraded @ resources-impl.js:485
ed @ custom-element.js:414
Qf @ custom-element.js:1322
Nc @ custom-element.js:1245
upgrade @ custom-element.js:374
Hf @ custom-element-registry.js:96
Ff @ custom-element-registry.js:39
Fl @ extensions-impl.js:389
(anonymous) @ extensions-impl.js:371
Wd @ style-installer.js:58
El @ extensions-impl.js:367
(anonymous) @ extensions-impl.js:339
addDocFactory @ extensions-impl.js:444
addElement @ extensions-impl.js:338
f @ amp-story.js:2503
registerExtension @ extensions-impl.js:161
(anonymous) @ runtime.js:175
Promise.then (async)
(anonymous) @ runtime.js:171
af @ chunk.js:189
Ze @ chunk.js:408
(anonymous) @ chunk.js:464
Promise.then (async)
ff @ chunk.js:463
xa @ chunk.js:482
runForStartup @ chunk.js:367
Ze @ chunk.js:58
Ll @ runtime.js:285
b @ runtime.js:186
c.AMP.push @ runtime.js:218
(anonymous) @ amp-story-1.0.mjs:1
----------
Uncaught (in promise) Error: Failed to load: https://res.cloudinary.com/dvo1qnusu/images/f_auto,q_auto/v1634577336/cropped-pexels-abdullahi-abdulquadri-9876711-scaled-1_14196013b/cropped-pexels-abdullahi-abdulquadri-9876711-scaled-1_14196013b.jpg?_i=AA
at ia (custom-elements.js:56)
at tb.createError (log.js:573)
at event-helper.js:237
-
Hi there,
The URL https://res.cloudinary.com/dvo1qnusu/images/f_auto,q_auto/v1634577336/cropped-pexels-abdullahi-abdulquadri-9876711-scaled-1_14196013b/cropped-pexels-abdullahi-abdulquadri-9876711-scaled-1_14196013b.jpg?_i=AA seems to work properly.
In order to be able to further investigate the issue you're experiencing, may I kindly ask you to create a ticket to support@cloudinary.com and provide me with the following details:
- WordPress version.
- Cloudinary Plugin's version.
- The theme that you use and its version.
- A full list of all other plugins that you have installed on your environment.
- Page builders that you actively use.
- A screenshot of your Media Library in list mode.
- A screenshot of your
Site Health
under theTools
Section. - Hosting providers & Plan (AWS, WP-Engine, etc..)
- Multisite environment (subdomain/subdirectory)
- Do you have access to the WP-CLI?
Note that since version
2.7.0
, you can use the new system report feature in order to generate all the information above except the screenshots. If you can also add some assets to your report as explained here that could be helpful as well.Thanks in advance.
Loic
Please sign in to leave a comment.
Comments
1 comment