While implementing some “preconnect” links on a site the other day, I needed to determine whether or not the domains that I wanted to preconnect to needed the crossorigin attribute.

And I was shocked to find that Google was not very helpful…

Searches for things like “how to tell if a resource needs crossorigin” or “devtools resource check crossorigin” returned result-after-result of something like “here’s how to implement crossorigin” or endless articles explaining what CORS is, but all in such engineering-speak that I could make neither heads nor tails of how to check a resource…

What I was looking for was something like:

1. Open a page in my browser,
2. Click a resource in DevTools,
3. Somehow know whether it needs crossorigin or not…

I finally found my answer, thanks to Andy Davies:

Requests with sec-fetch-mode: cors is normally a pretty good hint that a preconnect needs the crossorigin / crossorigin="anonymous” attribute

Which should look something like this:

And being a very thoughtful and thorough individual, Andy even made sure to clarify that “(empty attribute is the same as anon)”. :-)

So, for anyone else out there that is looking for this answer (including future-me), there it is…

Happy crossorigining,
Atg

Top⇪