3

I'm developing a web app using Angular5. I have a database that has some "posts" and each post contains an image URL that I take from 4chan API. The URL is legit (If I check it manually it works) but I get 403 forbidden in my console when I debug in the web browser. another weird thing, if I go to the URL manually and then refresh my app, the image is suddenly shown.

example URL : "http://i.4cdn.org/lgbt/1521711096067.jpg"

KLTR
  • 1,263
  • 2
  • 14
  • 37
  • 1
    can you post and example of image url from the API? It seems like a cookie problem. When you go on the URL manually, it must set some infos in the cookie for the 4chan domain, then when you application does the XHR the cookie is "re sent" automatically allowing access to the ressource – Pierre Mallet Mar 22 '18 at 16:22
  • can I solve this in any way? without downloading the image to my storage – KLTR Mar 22 '18 at 16:45
  • i reproduce this behavior with incognito mode in chrome, the 4chan api return a 403 with a CAPTCHA form in the returned html. I just have no idea how to work around that, sorry :( – Pierre Mallet Mar 23 '18 at 09:05
  • alright thanks anyways :) – KLTR Mar 23 '18 at 10:42

1 Answers1

17

Looks like when the HTTP request header referrer is anything other than http://4chan.org, I get this issue. Ive simply added the below to the HTML page and its fixed the problem:

<meta name="referrer" content="no-referrer"/>

Once your Angular app is loaded, you can also use Firefox Developer Console (Network Tab) modify image request (ie 403) and remove referrer header to test.

Remove http referer

Ian Berry
  • 186
  • 1
  • 4
  • worked for me. probably proxy uses referrer to identify domains and blocks them for any reason. by removing referrer form headers block is not working – MKK Nov 30 '18 at 09:18