HTTP 403 on images loaded from googleusercontent.com

Question

First off, I don't think my problem is related to these questions: question 1, or question 2.
Because I'm not using authentication anywhere, or any library either (I don't need to).

I'm simply loading some publicly-available album art images in my web application:

// urlList is an array than contains URLs like the examples given below
<img *ngFor="let url of urlList" src="url">

Example URLs: Glass Mansion, Summertime, Side Effects

99% of the time, it works. But sometimes I get 403 errors on the console for those exact same URLs.
I know they're not related to authentication, because, well. These URLs are publicly accessible.

Debugging this has been difficult, because a few page refreshes later, it magically works again. There's nothing out of the ordinary in logs either (except the GET 403 errors).

What in the world is happening?

I'm using Angular v7.2.15. Browser: Google Chrome

score 49 · Accepted Answer · answered Jun 01 '22 at 14:36

49

Add referrerpolicy="no-referrer" attribute

<img src="your-google-link-here" referrerpolicy="no-referrer"/>

answered Jun 01 '22 at 14:36

Matheus Jacob

506
4
3

2

Awesome, thanks. Anyone can explain why this works ? – ingham Aug 20 '22 at 16:13
4

Yeah, this really worked. Thanks. For those using react, you can make it `referrerPolicy="no-referrer"` – Fabrice Hafashimana Aug 29 '22 at 19:52
Answer should really be swapped IMHO – Jackie Sep 18 '22 at 02:41
Thanks so much, It took so long to find this information :'( – Ryan Mckenna Mar 09 '23 at 01:00
This makes it work more often for me but not always. Without the referrer attribute my image almost never loads but with the attribute it loads like 70% of the time. I wonder why that is. – dazzaondmic Apr 07 '23 at 17:46

score 7 · Answer 2 · answered May 21 '19 at 17:17

Within several Google API's (like the gmail API for example), Google uses HTTP403 and/or HTTP429 in order to ratelimit certain requests over certain time periods. I do not know what method you are using, if you are using some sort of API etc, nor do I know how busy or large your webapp is. But rate limiting or fair use compliance could be coming into play.

Gmail API Rate Limit Info Source - https://developers.google.com/gmail/api/v1/reference/quota

Lonare · Answer 3 · 2023-03-05T19:36:33.687

1

You just need to add

referrerPolicy="no-referrer"

to your image tag.

So basically it will look like this:

<img src="https://lh3.googleusercontent.com/a/AGNmyxZnC7Q38BPapCa0S0m6CLNOhGb1bgAvZClsS4Q1ZQ=s96-c" referrerpolicy="no-referrer"/>

edited Mar 05 '23 at 19:36

answered Mar 05 '23 at 19:28

Lonare

3,581
1
41
45

HTTP 403 on images loaded from googleusercontent.com

3 Answers3