I’m building a React Native app that includes a button to redirect the user to a React-based web app. The goal is to pass the userToken from the mobile app to the web app so the user can remain authenticated. My initial idea was to include the token as a query parameter in the URL, like this:

const handleStatisticsClick = async () => {
   WebBrowser.openBrowserAsync(
     https://www.MY-URL.COM/user-profile/creator-hub?accessToken=${userToken.replace(/./g,'-')}
  ); };

How can I securely and reliably pass a very long userToken from my React Native app to my React web app? Are there better alternatives to using a query parameter for this purpose?
However, the token is quite large (several thousand characters), and I’m concerned about potential issues with URL length limits or other limitations when passing such a large token in the query string. For example, when testing this implementation, the browser occasionally fails to open the URL properly, and some services seem to truncate the query parameters. Additionally, I am not sure how the receiving server handles URLs with very large query strings. If relevant, the server is configured to accept standard-length query strings but may require adjustments for such edge cases.

Furthermore, I’m worried about the security of passing such sensitive information through the URL.

Debugging Attempts

Using URL Parameters: I initially attempted to pass the token in the URL query string, but encountered issues with length limits and concerns about sensitive data exposure.

Alternative Shortened Token: I considered generating a short-lived unique identifier in the mobile app that the web app could exchange for the actual token via an API call, but this adds complexity and might introduce latency.

Using Cookies: I explored the possibility of setting cookies, but I am unsure how to share cookies securely between a mobile app and a web app.

Question

Has anyone encountered this issue before? What solutions have worked for you? I’m looking for best practices to ensure reliability and security.

I tried passing the userToken directly as a query parameter in the URL using the WebBrowser.openBrowserAsync function in React Native. I expected the token to be transferred seamlessly to the web app and allow the user to stay authenticated.

However, I encountered concerns about potential URL length limits and security issues with including such a long token (several thousand characters) in the query string. Additionally, I’m worried about how this might affect different browsers or platforms.

I’m looking for a reliable and secure alternative to pass this token without running into these issues.