Skip to content

BUG: "Open in StackBlitz” button broken by CORS #226

Closed

Description

@coder0107git

Describe the bug
When the "Open in StackBlitz" button is requested with CORS (i.e. <img crossorigin="anonymous" ...>), it isn't loaded.

To Reproduce
Steps to reproduce the behavior:

  1. Run the following HTML
<!-- Broken badge -->
<img alt="Open in StackBlitz" 
     crossorigin="anonymous" 
     src="https://developer.stackblitz.com/img/open_in_stackblitz_small.svg">

<!-- Working badge-->
<img alt="Open in StackBlitz"  
     src="https://developer.stackblitz.com/img/open_in_stackblitz_small.svg">
  1. Open the DevTools Console tab
  2. See error

Expected behavior
For the image to load.

Screenshots
An "Open in StackBlitz" image not loading and one loading
Chrome DevTool error message saying "Access to image at 'https://developer.stackblitz.com/img/open_in_stackblitz_small.svg' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource."

Desktop:

  • OS: Windows
  • Browser: Chrome
  • Version: 126

Additional context

Activity

  1. coder0107git commented on Aug 3, 2024

    @coder0107git
    ContributorAuthor

    A potential fix for this would be to add the following to netlify.toml.

    [[headers]]
      for = "/img/*"
      [headers.values]
        Cross-Origin-Resource-Policy = "cross-origin"
    +   Access-Control-Allow-Origin = "*"
  2. coder0107git commented on Aug 23, 2024

    @coder0107git
    ContributorAuthor

    Would submitting a PR with the suggested changes be helpful?

  3. samdenty commented on Aug 26, 2024

    @samdenty
    Contributor
  4. coder0107git commented on Aug 28, 2024

    @coder0107git
    ContributorAuthor

    Filed PR (#229)

  5. coder0107git commented on Sep 4, 2024

    @coder0107git
    ContributorAuthor

    @samdenty or @sulco Any chance #229 will be reviewed soon?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

triagenew issues that need to be assigned

Type

No type

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions