Sharing access token from .NET MVC app to embedded react app

Questions OAuth/OIDC
1

Hi,

We have the following applications
a) We have ASP.NET MVC 4 application. We have the .NET MVC app integrated with Okta and login works with it. We get access token and id token for .NET MVC app.
b) We have react application embedded inside ASP.NET MVC page (in the razor view)
c) We have .NET Core API application that has bunch of services secured using Okta. We have the API’s secured and calling API with bearer token is working.

Now we needed the embedded react app to get the access token. Here are options:

  1. have .NET MVC app create access token in cookie for react app to pick up and use.
  2. have react app call a service GetAccessToken on .NET MVC app to get access token and use it as bearer token for calling APIs.
  3. have all the react .NET Core API calls proxied through ASP.NET MVC app (no need to share access token to react app, but increases load on .NET MVC app)
  4. have react integrate with Okta, .NET MVC app integrate with Okta separately and both get their own access tokens and use them to call protected APIs (there would be issues with double redirections once for .NET MVC login, and second for react app login and handling of redirecting to target page post login)

Can you please share your thoughts and which approach do you see as good and least vulnerable from security standpoint and why the other options not suitable?