bjkim
June 28, 2023, 5:54am
1
We had a routing problem in our project, so we tested it on the demo app to see if the same thing happened.
Based on the code implemented by web3auth, only uxMode was set to Redirect .
At this time, if I move the router through the Link component and go back again, routing does not work.
Codes added in the demo app
Create Dashboard Page(sample page)
Insert Link Component(go to dashboard)
<Link href="/dashboard">
Go To Dashboard
</Link>
Uxmode is set to redirect
const openloginAdapter = new OpenloginAdapter({
privateKeyProvider,
adapterSettings:{
uxMode:'redirect'
}
});
Here’s a video on that issue. ==> *Issue Video
Please provide the following details too when asking for help in this category:
SDK Version: v6.1.1 (@web3auth /no-modal)
Platform: Web Chrome / Safari
Please provide the Web3Auth initialization and login code snippet below:
1 Like
I faced the same problem in my environment.
(My environment has a slightly older SDK version than the one you reported…)
The following issue describes the problem and the workaround.
opened 10:53PM - 20 Jun 23 UTC
### **Describe the bug**
In Next.js applications, `window.history.state` beco… mes `null` right after logging into Web3Auth, which causes the browser's back button to stop functioning properly.
Sample Application: https://github.com/snaka/nextjs-web3auth-example
### **To Reproduce**
The sample application for reproducing the steps combines Firebase (Google) authentication and Web3Auth. It's necessary to set up Firebase and Web3Auth in advance and prepare `.env.local` based on `.env.sample`.
Steps to reproduce the behavior:
1. Run the sample application using `yarn dev`
2. Open http://localhost:3000 in your browser
3. Click the `Go to Foo` button
4. This will navigate to http://localhost:3000/foo
5. Use the browser's back button to return to the original page
6. Click the `Login` button and sign in with your Google account
7. Complete the login process to Web3Auth and return to http://localhost:3000 via redirect
8. Click the `Go to Foo` button
9. This will navigate to http://localhost:3000/foo
10. At this point, if you try to return to the original page by clicking the browser's back button, you won't be able to go back
### **Expected behavior**
Even right after logging in, it should be possible to navigate to the previous page using the back button after moving to the Foo page.
### **Screenshots**
https://github.com/Web3Auth/web3auth-web/assets/19329/4d2396e8-5558-42be-bd34-6f46d1edff6b
### **Device Info (please complete the following information):**
- Device: MacBookPro (M2 Pro)
- OS: macOS Ventura 13.3.1 (a)(22E772610a)
- Browser: Edge
- Version: 113.0.1774.57 (arm64)
- Web3Auth Version: 5.2.0
### **Additional context**
Upon inspecting the behavior, I noticed that the contents of `window.history.state` are overwritten with `null` immediately after logging into Web3Auth and being redirected back to the application. This seems to be causing the Next.js navigation to stop functioning.

### **Temporary Workaround for This Issue**
To circumvent this problem, subscribe to post-login events as follows. If `window.history.state` is `null`, use `router.replace()` to explicitly set the current path to the state as a workaround.
```typescript
const router = useRouter()
web3auth.on(ADAPTER_EVENTS.CONNECTED, async (data: unknown) => {
/*
* Some kind of process after login
*/
if (window.history.state == null) {
router.replace(router.pathname)
}
})
```
We had been seeing this problem for at least 4 months or so.
After investigation, we found that web3auth was closely related to this issue, so we have filed an Issue.
Hi @bjkim , I have raised the issue to the product team. We will get back to you in a while.
Thank you for your input, @s-nakamatsu . I’ll make sure to point them to the issue raised.
Hey @s-nakamatsu , please try the same example out with the latest version of the SDK. let me know if the issue persists for you.
1 Like
I have updated Web3Auth to v6.1.1 and the situation appears to have worsened.
At the time I run web3auth.init()
, window.history.state
is now null
and I get the back button issue even when not logged in.
Of course, the back button problem remains after login as well.
Here is a sample application that I checked.
Hey @s-nakamatsu
Thanks for raising this. We are looking into this issue internally and will try to get back to you with a solution asap.
1 Like
@s-nakamatsu @bjkim Please update to the latest SDK since the nextJS routing issue was fixed with v6.1.6
3 Likes
I confirmed that the issue was fixed with v6.1.6
Thank you for your response!
2 Likes
bjkim
August 1, 2023, 12:11am
9
After I also updated, it works fine.
1 Like