'HTTP Error 418 (Teapot Error) on Link to FlightRadar24 When Server on Localhost

I am writing a Rails web application that presents OurAirports airport data to the user. One convenience I provide is a link to the FlightRadar24 web site for that airport.

I construct a URL for that airport, e.g. "https://www.flightradar24.com/airport/JFK" and then present a normal hyperlink to it:

<td align="center">
  <%= link_to 'FR 24', airport.flight_radar_24_link, target: '_blank' %>
</td>

This works fine when I click the link on the production server on Heroku, but when I run the web server locally I get an HTTP error:

This page isn’t working
If the problem continues, contact the site owner.
HTTP ERROR 418`

I think this has something to do with CSRF but I can't find anything definitive.

The source code is at https://github.com/keithrbennett/our_airports in case that helps.

Can anyone tell me what is going on and how I can resolve it?



Solution 1:[1]

I am not sure why FlightRadar24 responds with 418 in this case, but it does make it hard to run your app locally.

This is because of the HTTP referer header. When that header is set to localhost you get a teapot; if not, you get a 200.

% curl -I --referer "http://localhost:3000" "https://www.flightradar24.com/airport/JFK"
HTTP/2 418
date: Mon, 03 Sep 2018 23:02:16 GMT
server: cloudflare

But with example.com as the referer:

% curl -I --referer "http://www.example.com" "https://www.flightradar24.com/airport/JFK"
HTTP/2 200
date: Mon, 03 Sep 2018 23:02:29 GMT
content-type: text/html; charset=utf-8
last-modified: Mon, 03 Sep 2018 23:02:29 GMT
x-airport: BQH
server: cloudflare

(some headers removed for readability)


How to work around?

  1. Run a local development server that uses pretty host names like our-airports.test. I use puma-dev for this, and is also handy when running multiple rails apps locally.
  2. Edit /etc/hosts for a pretty hostname like our-airports.test

Edit:

A much better solution found in this answer, which is as simple as adding this meta tag to your HTML:

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

Solution 2:[2]

The easiest solution to the referrer issue that csexton described that does not require any changes to your code or your computer settings is to visit your site locally using lvh.me instead of localhost, as in http://lvh.me:3000. If you remove these lines, and then visit http://lvh.me:3000/airports/212, you will see that you are able to visit https://www.flightradar24.com/airport/JFK without any issues.

This works because a clever developer by the name of Levi Cook registered the domain lvh.me and set it up, as well as all of its subdomains, to point to localhost (127.0.0.1) on your computer.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Keith Bennett
Solution 2 csexton