I am looking for a "best practises" approach for creating SPAs protected using OIDC + PKCE.
Most of our applications are hosted on two independent web servers with a load balancer routing requests to them in a round-robin configuration. Our SPAs are almost always accompanied by an API which is also protected using OIDC. That API is also hosted on the same two independent web servers with a load balancer routing request to them in a round-robin configuration. OIDC is using PKCE, and our IDaaS supports refresh token rotation.
I've come across the react-oidc-context SDK (click here) and noticed that it stores the access_token and refresh_token together in the browser session storage. I've read elsewhere on the web that the best practice is to store the access_token in a closure variable or service worker and the refresh_token in the localStorage.
Question #1: Are there any security concerns with keeping the access_token together with the refresh_token in the session storage?
Question #2: I've read and am familiar with recommendations to keep the access_token in an HTTP-only cookie on the server. Does it matter that the API is hosted on two independent web servers? Meaning that if the HTTP-only cookie is issued by Web Server #1, will Web Server #2 have access to the access_token inside of the HTTP-only cookie?
