History API CORS issue

[resoai]

I've just moved my tileboard to a different server and noticed that all API calls to history are failing.

Access to XMLHttpRequest at 'http://192.168.1.2:8123/api/history/period/2020-07-01T11:22:05.828Z?end_time=2020-07-02T11:22:05.828Z&filter_entity_id=person.marina' from origin 'http://192.168.1.30' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

@akloeckner did you expirience anything similar?

[rchl]

https://www.home-assistant.io/integrations/http/#cors_allowed_origins

[resoai]

Totally forgot about it, however it doesn't look like it is working for API.

[rchl]

Yes, I also can't seem to make it work...

I've tried with a "postman" kind of app and it worked that way (with token taken from TileBoard).

It seems to fail from Tileboard because the browser triggers OPTIONS request that HA doesn't seem to be handling properly (405 Method Not Allowed).

The OPTIONS request is made because request is "non-simple" due to having Authorization header.

[resoai]

2018!

home-assistant/core#13400

[akloeckner]

I haven't seen such an error. But my Tileboard is served by HA's www folder. So, this issue wouldn't appear...

[akloeckner]

To be more solution-oriented: it seems the issue linked above also has an easy fix. Maybe it's best to open a PR to HA's core with it?

To be pessimistic again: my recent experience with a PR of mine leads me to think it will take some substantial amount of time until we get this merged...

[resoai]

Keeping all files in www directory, especially if you hardcode the token is a big security risk. I've even added a warning to our readme file today. I rarely use charts anyway but it is something which would be nice to get fixed. I've tried creating a PR in the past and gave up :)

[akloeckner]

My Tileboard is only available on my local network and the token is not hardcoded. So, I figured it should be ok to have everything in www. However, as it's not recommended, we should try to get a fix into HA...

[akloeckner]

If I read this right, OPTIONS should be allowed as part of methods=*. What do you think?

https://github.com/home-assistant/core/blob/4679e670f194931a083b693891fc802cd8857920/homeassistant/components/http/cors.py#L32

[resoai]

Yes, does look like it. Comes from aiohttp.hdrs.

[DeviousPenguin]

I'm getting this error when using a different server to host tileboard

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://xxxxxxxx.duckdns.org/api/history/period/2020-07-06T01:24:42.620Z?end_time=2020-07-07T01:24:42.620Z&filter_entity_id=sensor.cudnciun. (Reason: CORS request did not succeed)

Is this releated to this issue at all? I'll try hosting tileboard on the same machine as HA in order to test.

[akloeckner]

I tested this and I don't get the error:

• Set up an SSH port forward.
• Access TileBoard at localhost
• Set serverUrl to actual HA instance
• History would not load with an error
• Add cors_allowed_origins for https://localhost:8123
• Restart HA, reload TileBoard
• History loads fine.

I might miss something by not setting up a real second server...

[rchl]

I've just spent some hours debugging this and came to the conclusion that the history component just don't allow CORS requests. There is a cors_allowed flag that can be enabled on https://github.com/home-assistant/core/blob/b4bac0f7a0a881ece3b3bd06dbe8531a67f8c923/homeassistant/components/history/__init__.py#L443 that would make it work.

Not sure if that would be a bug or a feature request. I'll probably file the issue eventually.

[rchl]

home-assistant/core#39727

[DeviousPenguin]

Thanks for making HA issue 39727 - I do remember that the History graphs used to work without any CORS errors on an older version of Home Assistant Core

I think it was pre 0.107.x, as with 0.107.0 they removed the base_url from the YAML configs, and instead made it a GUI only config option, and it was around this time that my history graphs stopped working in Tileboard. I can't say 100% certainty that it worked in 0.106.x and am unable to roll back to an older version.

If I get a spare machine / VM at some point I should be able to test if pre 0.107.x, and if it works I'll see if I can add my results into HA issue 39727 :)

[akloeckner]

It works for me in Home Assistant 0.108.3. Not the very latest. But still after 107...

[rchl]

I tested this and I don't get the error:

• Set up an SSH port forward.
• Access TileBoard at localhost
• Set serverUrl to actual HA instance
• History would not load with an error
• Add cors_allowed_origins for https://localhost:8123
• Restart HA, reload TileBoard
• History loads fine.

I might miss something by not setting up a real second server...

I'm curious if there are OPTIONS requests triggered in your case:

I suppose they are if it only worked after setting cors_allowed_origins...

Not sure why it wouldn't work here even with proper origin set. Is it because http is just straight rejected, even if cors_allowed_origins is set?

[akloeckner]

There is no OPTIONS request, if I interpret this right:

EDIT: And it works with the npm dev server, too, which is on http. Maybe it's because my HA server is on https?

[rchl]

My server is also on HTTPS (https://something-something.duckdns.org)

[rchl]

If there are no OPTIONS requests then it means that the browser doesn't consider your localhost and the server as separate origins somehow. That sounds bizarre to me, to be honest.

Can you try any other browser to confirm that it's also working?

[akloeckner]

I set up the port forwarding again: Tileboard is served on https://localhost. I changed both serverUrl and wsUrl options in config.js to point to home-assistant.andreas.kloud, a local DNS name. (Without that setting, API requests also go to localhost.)

On Firefox, that actually gives me the OPTIONS request. Still, history is working.

On Chrome, it also works.

On Edge, I have error while receiving access token. On Internet Explorer, I'm not even redirected to the authentication page.

[rchl]

One more thing, can you show the response headers of the working OPTIONS request?

Here is what I'm getting:

I wonder if the nginx addon that I'm using for HTTPS<->HTTP tunneling is what is causing the issue.

[rchl]

Tried also connecting directly to the HA's python server (on local network) and that is also failing:

This is with HA cors configuration like:

http:
  cors_allowed_origins:
    - http://192.168.2.23:8080
    - http://localhost:8080

Tried both with localhost and actual IP of the host running TB.

[akloeckner]

That's what Firefox logs for the OPTIONS request:

Relevant config.js:

   serverUrl: 'https:' + "//home-assistant.andreas.kloud:8123",
   wsUrl:     'wss:'   + "//home-assistant.andreas.kloud:8123/api/websocket",
   authToken: '...'

Relevant HA configuration.yaml:

homeassistant:
  auth_providers:
  - type: homeassistant
  - type: trusted_networks
    trusted_networks:
    - 127.0.0.1
    - ::1
    - <my-local-network>
http:
  base_url: https://home-assistant.andreas.kloud:8123
  ssl_certificate: ...
  ssl_key: ...
  cors_allowed_origins:
  - https://localhost:8123
  - http://home-assistant.andreas.kloud:8080

[rchl]

I have no idea...

The only difference that seems relevant to me is having HA running on HTTPS itself while I'm trying either on HTTP or HTTPS tunneled through nginx (so basically still HTTP on HA side).

I don't really want to make the effort to use "native" HTTPS and try it out then...

[akloeckner]

That's what I get when switching HA to http:

So, I guess, that's not it...

[DeviousPenguin]

This issue seems to have fixed itself for me, my History graphs are now working again in Tileboard.

I've not changed my tileboard config at all, but I have been keeping my HACore version up to date (Home Assistant 0.116.4)

[rchl]

It still doesn't work for me.

Can you specify the configuration you are using to make it clear what your case is (of course mask the domain with foo.com or something)?

• URL in the browser:
• TileBoard's CONFIG.serverUrl value:
• HA cors_allowed_origins configuration:
• Do you see an OPTIONS request being made in browser devtools?

[rchl]

For example, this is my configuration where it's failing the CORS check.

• URL in the browser: http://localhost:8080
• TileBoard's CONFIG.serverUrl value: https://ha.foo.com
• HA cors_allowed_origins configuration:

homeassistant:
  auth_providers:
  - type: homeassistant
  - type: trusted_networks
    trusted_networks:
    - 127.0.0.1
    - ::1
    - 192.168.2.0/24

http:
  use_x_forwarded_for: true
  cors_allowed_origins:
    - http://localhost:8080
  trusted_proxies:
    - 127.0.0.1
    - 172.30.33.3
    - ::1

• Do you see an OPTIONS request being made in browser devtools? Yes

[DeviousPenguin]

I'm afraid to say that today my history graphs have stopped working again, and the only config changes I have made to HomeAssistantCore is to add a few automation and remove a non working integration. I've left the http and homeassistant parts of my config alone. I did need to restart homeassistantcore for my config changes to take effect.

I'm not entirely sure why it was working yesterday, I even checked the Tileboard with different browsers and devices, and the history graphs appeared both in Safari on a laptop, and in Chrome on 2 different android devices when it was working!

I'll include the details of my setup in case it it helps debugging, but if it doesn't let me know and I'm happy to edit it out.

I'm running Tileboard on a seperate machine on my LAN which is hosted using NGINX, internal IP is 192.168.1.111.

I have 2 different duckdns domains, names have been changed. 'tileboard_machine' forwards to the machine running tileboard, 'homeassistant_machine' forwards to the machine running homeassistantcore.

• URL in the browser: 'https://tileboard_machine.duckdns.org'
• serverUrl: 'https://homeassistant_machine.duckdns.org'
• HA cors_allowed_origins configuration:

homeassistant:
  auth_providers:
    - type: homeassistant

http:
  use_x_forwarded_for: true
  trusted_proxies:
    - 127.0.0.1
    - 192.168.1.111
    - ::1
  cors_allowed_origins:
    - https://tileboard_machine.duckdns.org

Do you see an OPTIONS request being made in browser devtools? NO, it seems to be a 'GET' request that is failing.

I'll have to try changing the 'trusted_networks' portion of the 'trusted_networks' section of the YAML, if this gets it working again I'll post a follow up.

[rchl]

I have made a PR to HA with a fix: home-assistant/core#43679

Knowing how the code works now, I can actually see why would the behavior seem random. Depending on timing the CORS might nor might not get enabled for the history component.

[akloeckner]

@rchl, I stumbled accross the new issue regarding the API failing and browsed through your PR. Since, unfortunately, they turned it down, I checked if I could find a way to fix the bug you found.

Would you mind to have a look at my changes here: akloeckner/home-assistant#1?

Since you already digged into the code somewhat deeper, you could give me a hint whether it should work. Maybe you can even test it then, because I don't know how to do that in my current setup... :-/ I will be happy to shove this into the (yes) lengthy review pipeline of the HA people as a follow-up to your PR.

[rchl]

I've posted my comment in your PR.

[piltous]

@rchl thanks for letting me know about this issue. I commented on the other thread. Rgds

[rchl]

This appears to have been fixed in Home Assistant. It should now work as long as the origin that is making the request is whitelisted in HA configuration.yaml. For example:

http:
  cors_allowed_origins:
    - http://localhost:8080