Insecure XMLHttpRequest for /api/health when using https in orion api url

john-jam commented 2 years ago

First check

[X] I added a descriptive title to this issue.
[X] I used the GitHub search to find a similar issue and didn't find it.
[X] I refreshed the page and this issue still occurred.
[X] I checked if this issue was specific to the browser I was using by testing with a different browser.

Bug summary

When configuring orion ui to reach an orion api with https, an error on the ui and on the console occurs. It seems like the ui tries to reach the orion api endpoint /api/health in an insecure way. For other xhr endpoints (e.g. api/flows/filter, api/flow_runs/history), the ui can access the api properly.

Reproduction

Deploy prefect orion with the environment variable PREFECT_ORION_UI_API_URL="https://my-orion-server/api"
Configure the DNS endpoint my-orion-server with https support
Access the ui through the https endpoint https://my-orion-server

Error

On the ui:

Can't connect to Orion API at https://my-orion-server/api. Check that it's accessible from your machine.

In the console:

Mixed Content: The page at 'https://my-orion-server/runs' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://my-orion-server/api/health'. This request has been blocked; the content must be served over HTTPS.
{
    "message": "Network Error",
    "name": "AxiosError",
    "config": {
        "transitional": {
            "silentJSONParsing": true,
            "forcedJSONParsing": true,
            "clarifyTimeoutError": false
        },
        "transformRequest": [
            null
        ],
        "transformResponse": [
            null
        ],
        "timeout": 0,
        "xsrfCookieName": "XSRF-TOKEN",
        "xsrfHeaderName": "X-XSRF-TOKEN",
        "maxContentLength": -1,
        "maxBodyLength": -1,
        "env": {
            "FormData": null
        },
        "headers": {
            "Accept": "application/json, text/plain, */*"
        },
        "baseURL": "https://my-orion-server/api",
        "method": "get",
        "url": "/health/"
    },
    "code": "ERR_NETWORK",
    "status": null
}

Browers

[X] Chrome
[X] Firefox
[ ] Safari
[ ] Edge

Prefect version

Version:             2.3.2
API version:         0.8.0
Python version:      3.8.13
Git commit:          6e931ee9
Built:               Tue, Sep 6, 2022 12:36 PM
OS/Arch:             linux/x86_64
Profile:             default
Server type:         hosted

Additional context

The weird thing is when I try to run the orion ui locally from source (on the same commit 6e931ee9) or from a built package installed, I don't have this error :upside_down_face: It is maybe because there isn't an origin request header for the xhr request health/ when I try to reach my deployed server and there is one when I use my local server (this happens only for that endpoint).

jeffcarrico commented 2 years ago

I hit this as well, it seems to have come in during 2.3.1 or 2.3.2. For some reason the health check is going to /health/ (trailing slash) which causes FastAPI (and friends) to do a 307 redirect, but that re-direct (for some reason which is a mystery to me) uses http protocol instead of https causing the mixed content error if the UI page was loaded over https. I tried to find where the health check path is defined, but it seems to be in here import { HealthApi } from '@prefecthq/orion-design' and I don't know where that repo is (maybe private?).

As you noted every other API call I've seen the UI make does not have a trailing slash.

I worked around this by re-writing the path at the load balancer of my deployed UI to drop the trailing slash.

bunchesofdonald commented 2 years ago

Thanks for the report @john-jam and the extra research @jeffcarrico! It looks like you're right and we were requesting /health/ with a trailing slash. We've merged a commit to fix this issue and it should be part of the next release.

john-jam commented 2 years ago

Thanks for your responses!

I can't find the fix you talked about @bunchesofdonald (maybe merged on a release branch?). When I run locally orion ui from main, I still have the health/ redirect with the trailing slash. This first request has a location in its response that points to an http url and the next request succeeds or fails regarding where I launched my orion ui. The error seems to only occurs somehow when I use the built orion ui from the 2.3.2-python3.9 docker image.

Thanks for the tip @jeffcarrico, I'll apply that in the meantime!

bunchesofdonald commented 2 years ago

The fix is in the private orion-design repo, but it hasn't been released yet. We generally do releases on Tuesdays, so you should be good to go early next week.

jeffcarrico commented 2 years ago

This looks good now (2.4), thank you! 🎉

PrefectHQ / prefect