bjkim
June 28, 2023, 5:54am
1
This topic was originally posted by bjkim on 6/28/2023.
We had a routing problem in our project, so we tested it on the demo app to see if the same thing happened.Redirect .
At this time, if I move the router through the Link component and go back again, routing does not work.
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:
I faced the same problem in my environment.
The following issue describes the problem and the workaround.
<a href="https://github.com/Web3Auth/web3auth-web/issues/1502" target="_blank" rel="noopener nofollow ugc">github.com/Web3Auth/web3auth-web</a>
<div class="github-info">
<div class="date">
opened <span class="discourse-local-date" data-format="ll" data-date="2023-06-20" data-time="22:53:31" data-timezone="UTC">10:53PM - 20 Jun 23 UTC</span>
</div>
<div class="user">
<a href="https://github.com/snaka" target="_blank" rel="noopener nofollow ugc">
<img alt="snaka" src="https://community.web3auth.io/community/community/uploads/default/original/2X/1/1e7ed40c3ae55d4e4001a067d91daee2a5afafaa.jpeg" class="onebox-avatar-inline" width="20" height="20" data-dominant-color="B3AFAE">
snaka
</a>
</div>
</div>
<div class="labels">
</div>
### **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: GitHub - 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:
Run the sample application using yarn dev
Open http://localhost:3000 in your browser
Click the Go to Foo button
This will navigate to http://localhost:3000/foo
Use the browser’s back button to return to the original page
Click the Login button and sign in with your Google account
Complete the login process to Web3Auth and return to http://localhost:3000 via redirect
Click the Go to Foo button
This will navigate to http://localhost:3000/foo
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 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.
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)
}
})
```</span></p>
</div>
</article>
<div class="onebox-metadata">
</div>
<div style="clear: both"></div>
</aside>
<p>We had been seeing this problem for at least 4 months or so.<br>
After investigation, we found that web3auth was closely related to this issue, so we have filed an Issue.</p>
Hi @bjkim , I have raised the issue to the product team. We will get back to you in a while.@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.
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.
<a href="https://github.com/snaka/nextjs-web3auth-example" target="_blank" rel="noopener nofollow ugc">GitHub</a>
Contribute to snaka/nextjs-web3auth-example development by creating an account on GitHub.
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.
@s-nakamatsu @bjkim Please update to the latest SDK since the nextJS routing issue was fixed with v6.1.6
I confirmed that the issue was fixed with v6.1.6
Thank you for your response!
bjkim
August 1, 2023, 12:11am
9
After I also updated, it works fine.
Archived Content from Web3Auth Community
