I would like to show my pool temperature, PH, etc in a dashboard. I was trying this approach with js fetch in a custom tile:
HOwever, I am receiving the following error:
Access to fetch at 'https://api.iopool.com/v1/pools' from origin 'null' 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. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
I am not set on the custom tile approach but I do not want to set up a separate proxy or build a server side solution. Any suggestion or solution is welcome.
Could you use an HTTP Action within a SharpTools Rule to make your request? Then you could store the result(s) in variable(s) so you could display them on your dashboard…either directly or via Super Tiles.
This does the trick. It shows ORP (desinfection potential), pH and temp.
I wish I was able to make a direct call from the browser to build a custom tile. That would allow me to use gauges or other graphs to show the value within their range. This dashboard is a workaround for that.
The copy tile at the bottom is based on a rule that evaluates the response values and determines whether it is safe to swim in the pool. If it is not safe, icons, styles and copy will change accordingly.