Description
Your Question
Issue Summary: TonConnect SDK Integration in React Native
- Wallet Fails to Return to App After Connection
Behavior: After initiating a wallet connection using Linking.openURL(), the wallet (e.g., Tonkeeper) opens correctly. However, upon completing the connection, it does not redirect back to the application.
Configuration: The ton-connect-manifest.json includes the following returnUrl:
{
"url": "https://mobile.umy.com",
"name": "Umy",
"iconUrl": "https://mobile.umy.com/logo.png?20250228",
"returnUrl": {
"android": "umy://tonconnect",
"ios": "umy://tonconnect"
}
}
App Setup: The app has registered the umy://tonconnect deep link scheme on both Android and iOS platforms. Additionally, it listens for incoming deep links using React Native's Linking API.
Observation: Manually entering umy://tonconnect?session=... in the browser successfully opens the app, indicating that the deep link configuration is correct.
- Custom eventDispatcher Implementation
Context: In React Native, the default eventDispatcher relying on window.dispatchEvent is not available.
Implementation: A custom eventDispatcher was implemented as follows:
YouTube
typescript
import { TonConnect, type SdkActionEvent } from '@tonconnect/sdk';
import { Linking } from 'react-native';
const connector = new TonConnect({
manifestUrl: 'https://mobile.umy.com/ton-connect-manifest.json',
eventDispatcher: {
dispatchEvent(event: SdkActionEvent) {
if (event.type === 'open-url') {
Linking.openURL(event.url).catch(err => {
console.error('Failed to open wallet URL', err);
});
}
}
}
});
Outcome: While this opens the wallet as expected, the wallet does not redirect back to the app after the connection is completed.
- Potential Wallet Handling of returnUrl
Observation: Despite correct deep link handling within the app, the wallet does not utilize the provided returnUrl to navigate back post-connection.
Question: Is there a known issue or additional configuration required for wallets like Tonkeeper to handle returnUrl correctly in React Native environments?
🔍 Environment Details
Platform: React Native
GitHub
Wallet: Tonkeeper (specific version not provided)
TonConnect SDK Version: @tonconnect/sdk: "^3.1.0"
📌 References
Similar issues have been reported in the community, such as Issue #53 on GitHub, where developers faced challenges with TonConnect in React Native environments.
📝 Request for Assistance
Clarification: Could you confirm if additional steps are required to ensure wallets correctly handle returnUrl in React Native applications?
Guidance: Are there recommended practices or configurations to facilitate proper redirection from wallets back to React Native apps post-connection?
Support: Any insights or documentation addressing this issue would be greatly appreciated.
Thank you for your attention to this matter. We look forward to your guidance on resolving these integration challenges.
Context
No response
What have you tried so far?
No response
Relevant Code or Commands
No response
Documentation Check
- Yes, I have checked the documentation.