CORS Errors

Resolved cyteshoppe
(@cyteshoppe)

2 years ago
```
When I edit a web story an error message appears:
<blockquote>Unable to load media
We detected a potential misconfiguration that prevents media items from loading correctly. This may be due to media being hosted on an external CDN. Learn how to address this or submit a new support topic for additional help.</blockquote>

When I replace media image thumbnails are not visible in the media panel.
(However, viewing images from Media on WP menu works fine)

What I have tried:

<ol>
    <li>Confirm that this issue is caused by CORS. (CORS errors on images from my domain headroom.com) 
<blockquote>
```
Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/2022/03/Headroam_SiteLogo_HLockup_Tagline.png due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/elementor/screenshots/Elementor-post-screenshot_3064_2022-03-21-14-51-29_19f3a890.png due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/2022/03/ATA-D2-011-Toconoa-metal-panel-wall.jpg due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/2022/03/ATA-D2-036-nice-big-shot-LS-salt-flat.jpg due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/2022/03/ATA-D3-008-STAR-LS-geyser-shot.jpg due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/2022/03/ATA-D3-026-coffee1.jpg due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/2022/03/ATA-D3-037-mission.jpg due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/2022/03/005a-canyon-overlook-with-steve.jpg due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/elementor/screenshots/Elementor-post-screenshot_6991_2022-03-20-05-27-01_17799789.png due to access control checks.
wp-story-editor.js:256:5658Not allowed to request resource
wp-story-editor.js:256:5658Fetch API cannot load http://headroam.com/wp-content/uploads/2022/03/placeholder.png due to access control checks.
Cancelled load to http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpeg because it violates the resource’s Cross-Origin-Resource-Policy response header.
http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpegFailed to load resource: Cancelled load to http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpeg because it violates the resource’s Cross-Origin-Resource-Policy response header.
Origin https://headroam.com is not allowed by Access-Control-Allow-Origin. Status code: 200
Cannot load image http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpeg due to access control checks.
http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpegFailed to load resource: Origin https://headroam.com is not allowed by Access-Control-Allow-Origin. Status code: 200
Cancelled load to http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpeg because it violates the resource’s Cross-Origin-Resource-Policy response header.
http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpegFailed to load resource: Cancelled load to http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpeg because it violates the resource’s Cross-Origin-Resource-Policy response header.
Origin https://headroam.com is not allowed by Access-Control-Allow-Origin. Status code: 200
Cannot load image http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpeg due to access control checks.
http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-96×96.jpegFailed to load resource: Origin https://headroam.com is not allowed by Access-Control-Allow-Origin. Status code: 200
Origin https://headroam.com is not allowed by Access-Control-Allow-Origin. Status code: 200
2Cannot load image http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-scaled-e1627056729552.jpeg due to access control checks.
http://headroam.com/wp-content/uploads/2021/06/149CF9C1-2793-44F8-B894-8FD452B503FA-scaled-e1627056729552.jpegFailed to load resource: Origin https://headroam.com is not allowed by Access-Control-Allow-Origin. Status code: 200
https://headroam.com/wp-content/uploads/2021/06/pexels-toma%CC%81s%CC%8C-mali%CC%81k-1703314-204×300.jpgFailed to load resource: the server responded with a status of 404 ()
https://headroam.com/wp-content/uploads/2021/06/pexels-toma%CC%81s%CC%8C-mali%CC%81k-1703314-697×1024.jpg`</blockquote>

<li>Adding an Access-Control-Allow-Origin header (Followed instructions for my host, Siteground)
<li>Disabled all plugins and re-enabled one by one to isolate an isssue. (no changes with any plugin)
<li>Cannot reproduce the issue on a staging site.
</ol>

Debugging information for the Web Stories plugin.
<ul>
<li>WEBSTORIES_VERSION 1.19.0
<li>WEBSTORIES_DB_VERSION 3.0.14
<li>WEBSTORIES_AMP_VERSION 2.3.0-alpha
<li>WEBSTORIES_CDN_URL https://wp.stories.google/static/15
<li>WEBSTORIES_DEV_MODE Disabled
<li>Theme supports Disabled
<li>Experiments
<li>Story locking: Enabled
<li>CORS check: Enabled
<li>Updated Publish Story Modal: Enabled
<li>Custom Fonts: Enabled
<li>Page Background Audio: Enabled
<li>Floating Menu: Enabled
<li>Deleted Fonts: Enabled
<li>libxml Version 2.9.10
</ol>

<p>I am now reaching out to you for assistance. Please help. Thank you.`

The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

Adam Dunnage
(@adamdunnage)

2 years ago

Hi @cyteshoppe thanks for getting in touch and for passing on the errors you are seeing. If you are experiencing CORS issues please see our guide on this which explains this in more detail.

As stated in the guide you will need to contact your hosting provider or follow one of the provided guides if they include your hosting provider to set up CORS headers to clear these issues.

Once done, if you are still experiencing issues with your stories then please let me know and we can investigate further.

Thread Starter cyteshoppe
(@cyteshoppe)

2 years ago

Hello @adamdunnage,

Thank you for getting back to me. As I explained in the posting, I have already exhausted support options with my hosting provider and carefully followed the provided guides.

I cannot reproduce the issue on a staging copy of the site (on the same provider, etc.). The issue only persists on the live site. Thus why I reached out for assistance,

Adam Dunnage
(@adamdunnage)

2 years ago

@cyteshoppe Could I just confirm that on the affected site that you are still seeing the CORS errors? If this is the case then as explained above you will need to resolve this with your hosting provider as this falls out of the scope of the Web Stories support.

If you could provide some screen recordings or images of this issue you are seeing then this could help us to identify the cause. You can use services such as Loom and Imgur for this.

If you are happy to share your Site Health information privately via this form then I am happy to also check that nothing stands out here that could be causing problems.

Bethany Chobanian Lang
(@mxbclang)

2 years ago

@cyteshoppe Checking in here – are you still having trouble? If so, can you please provide some screenshots or videos of what you are seeing? Thank you!

Adam Dunnage
(@adamdunnage)

2 years ago

As we haven’t received a response we’ll close this topic as resolved but feel free to open a new support topic if you continue to experience any issues. Thank you!

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘CORS Errors’ is closed to new replies.