I am new to Kong and have a setup with the key-auth plugin enabled. So when I go to https://localhost:32443 I get {"message":"No API key found in request"}. If I specify an apikey I get the homepage of the application but it is blank. The first request succeeds with a 200 response - https://localhost:32443/?apikey=EMCmOc4oE3KjE3CtCoqqDZ9cBM8mEJWjDcOuPJLXPZCmOJbb- because it includes 'apikey'. All subsequent requests that the page makes to download minified JS and CSS fail with 401 because they don't include the 'apikey'. I have tried to configure the application to use the'session' plugin but not sure if this is the right thing to do or I just haven't configured it correctly.
Request URL: https://localhost:32443/favicon.ico
Request Method: GET
Status Code: 401
Remote Address: 127.0.0.1:32443
Referrer Policy: no-referrer-when-downgrade
content-length: 41
content-type: application/json; charset=utf-8
date: Sun, 06 Sep 2020 07:32:32 GMT
server: kong/2.0.4
status: 401
www-authenticate: Key realm="kong"
x-kong-response-latency: 1
:authority: localhost:32443
:method: GET
:path: /favicon.ico
:scheme: https
accept: image/avif,image/webp,image/apng,image/*,*/*;q=0.8
accept-encoding: gzip, deflate, br
accept-language: en-US,en;q=0.9
cookie: session_2=dhhdjdjdjjd...
referer: https://localhost:32443/?apikey=EMCmOc4oE3KjE3CtCoqqDZ9cBM8mEJWjDcOuPJLXPZCmOJbb
sec-fetch-dest: image
sec-fetch-mode: no-cors
sec-fetch-site: same-origin
user-agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko)
Chrome/85.0.4183.83 Safari/537.36
If I manually add the 'apikey' to the favicon request in a new tab then it loads fine. I'm not sure if there is configuration that I am missing that will automatically do this for all requests?
Many thanks
Maybe it is a bit late now but i try to answer the question
In general it is not a good idea to use your homepage UI with a API-key.
Passing query to subsequent calls
As far as i know there is no simple possibility to append your API-key to all subsequent requests your html will start. As i can remember service-workers have the ability to intercept and modify requests. They could append your query to all requests. Downside is they are only working on https and old browser don't support them
API-key for UI
If you ask me you should use a API-key for api calls and not for UI.
Alternative
In my opinion basic-auth would be a better/the nearest choice because your browser will safe these settings and include these credentials (header) to all subsequent requests so your UI can load the other stuff. If you decide to change your basic-auth credentials you can easily change/remove them and the permission is gone.
But what if i still want to use a API-key for UI ?
In the case you want to use your api-key as a login you could use a session. This session will create a cookie sent to your browser.
BUT
All other subsequent requests wont need a api-key from now. Even if you remove your api-key the session (cookie) is still alive until it's expired as far you wont implement custom logic to handle these scenario (bind key and session internal)