phantom/deep-link-demo-app

Deep linking API demo application

This repo contains a demo application written with React Native that showcases Phantom's deep linking API.

API Documentation

Getting started

# install dependencies
$ yarn 
# start metro bundler
$ yarn start

deep-link-demo-app's Issues

Redirect doesn't work in web

DeepLinkDemoBug.mp4

When I run yarn web : expo start --web , it doesn't work properly.
Is there any workaround for this problem?

Deep link doesn't work

I have already downloaded the phantom app, but it doesn't open in the deep link.
It opens to the AppStore. Please tell me the cause.

ios.MP4

Spl token transfer

I want to transfer Spl-tokens. Does anybody share a sample of transferring spl token via react-native or Expo ?

Deeplink requires Phantom App installed, won't pass Apple Review

Is it possible for deeplinks to allow for login through the mobile browser? Or are users only able to login via the Phantom app, because I'm currently blocked on submitting my iOS app for the following guideline.

Guideline 4.2.3 - Design - Minimum Functionality


We were required to install the Phantom app before we could log in via Phantom. Users should be able to log in with Phantom and access their accounts without having to install any additional apps.

Next Steps

If you would like to offer authentication through Phantom, please use a mechanism that allows users to log in with Phantom from within your app without first having to install an additional app.

Sometimes the phantom wallet prompt doesn't come out.

When I use deep link in js window.open ( mobile browser -> mobile Phantom wallet )
first try make nvigation to Wallet. ( I can't get the prompt even if I wait. )
second try, A prompt is generated.

How can I get a prompt on my first try?

devnet support?

After changed App.tsx#L20 and #178 to devnet the sample stop working.

example send any transaction to phantom wallet NOT transfer

Hello, can someone give an example to send a transaction other than transfer to Phantom

` const createTransferTransaction = async () => {
if (!phantomWalletPublicKey) throw new Error("missing public key from user");
var programId = new PublicKey("5Zcag1obaSA1CXLT6qusdbeiApeG4PVANtzsFmJZUMYj")
let instruction = new TransactionInstruction({
keys: [{ pubkey: phantomWalletPublicKey, isSigner: false, isWritable: true }],
programId,
data: Buffer.alloc(0),
});
let transaction = new Transaction().add( instruction );

transaction.feePayer = phantomWalletPublicKey;

const anyTransaction: any = transaction;

anyTransaction.recentBlockhash = (await connection.getLatestBlockhash()).blockhash;
return transaction;
 };
 const signAndSendTransaction = async () => {
const transaction = await createTransferTransaction();
const serializedTransaction = transaction.serialize({
  requireAllSignatures: false,
  });

const payload = {
  session,
  transaction: bs58.encode(serializedTransaction),
};
const [nonce, encryptedPayload] = encryptPayload(payload, sharedSecret);

const params = new URLSearchParams({
  dapp_encryption_public_key: bs58.encode(dappKeyPair.publicKey),
  nonce: bs58.encode(nonce),
  redirect_link: onSignAndSendTransactionRedirectLink,
  payload: bs58.encode(encryptedPayload),
});
addLog("Sending transaction...");
const url = buildUrl("signAndSendTransaction", params);
Linking.openURL(url);
  };`

I try to send transaction to phantom wallet ,but I got errorMessage "Somthing went wrong" with errorCode:"-32603"

Unsupported SDK version 44.0.0 in latest Expo Go app for iOS

Hi everyone.

If I try to run the app on the iPhone with the latest Expo Go app, I get the error saying that the version is not supported.
Downgrading the app on the iPhone is impossible. Running on Simulator goes well but doesn't really make sense since there's no Phantom app on simulator.

Is it possible to upgrade the project to newer expo sdk?

Are there any http json apis that interact with chrome-extension of phantom?

Are there any http json apis that interact with chrome-extension of phantom? In my project ,I can not use js sdk interact with chrome-extension,I need use http apis .
Deeplink only can use in mobile app(android and ios) or it also can use in windows chrome-extension?I use it in windows chrome-extension can not success,Is there any problem with my use?

Unable to decrypt data

I keep having the error Unable to decrypt data

It gets thrown here:

if (!decryptedData) {
    throw new Error('Unable to decrypt data')
  }

Sometimes I got it and sometimes I don't.

I understand why the error gets thrown but don't understand it's happening since I didn't change anything to the code.

Thank you! Any help is really appreciated 🙏

Phantom just opens without asking to connect to the app.

Hi I have cloned this repo and tested. When I run it open Safari and then the App Store and then the Phantom wallet. After I scanned my fingerprint nothing happened, Phantom didn't ask me if I want to connect to that demo app or not? I went back to the other demo app still nothing happened, Phantom still not connected. Is there any way to fix this?

Phantom does not send back response after select connect

code snipet 👍
useEffect(() => {
const initializeDeeplinks = async () => {
const initialUrl = await Linking.getInitialURL();
if (initialUrl) {
setDeepLink(initialUrl);
}
};
initializeDeeplinks();
const listener = Linking.addEventListener('url', handleDeepLink);
return () => {
listener.remove();
};
}, []);

const handleDeepLink = ({url}: Linking.EventType) => setDeepLink(url);

// Handle in-bound links
useEffect(() => {
if (!deepLink) {
return;
}

const url = new URL(deepLink);
const params = url.searchParams;

// Handle an error response from Phantom
if (params.get('errorCode')) {
  const error = Object.fromEntries([...params]);
  const message =
    error?.errorMessage ??
    JSON.stringify(Object.fromEntries([...params]), null, 2);
  console.log('error: ', message);
  return;
}

// Handle a `connect` response from Phantom
if (/onConnect/.test(url.pathname)) {
  const sharedSecretDapp = nacl.box.before(
    bs58.decode(params.get('phantom_encryption_public_key')!),
    dappKeyPair.secretKey,
  );
  const connectData = decryptPayload(
    params.get('data')!,
    params.get('nonce')!,
    sharedSecretDapp,
  );
  setSharedSecret(sharedSecretDapp);
  setSession(connectData.session);
  setPhantomWalletPublicKey(new PublicKey(connectData.public_key));
  console.log(`connected to ${connectData.public_key.toString()}`);
}

Failed to get recent blockhash

Hi I have tried several times and encounter this issue:

Signing transaction...
Getting recent blockhash

failed to get recent blockhash: TypeError: Network request failed
at node_modules\@solana\web3.js\lib\index.browser.esm.js:null in Connection#getLatestBlockhash
at node_modules\@babel\runtime\helpers\asyncToGenerator.js:null in asyncGeneratorStep
at node_modules\@babel\runtime\helpers\asyncToGenerator.js:null in _throw
at node_modules\promise\setimmediate\core.js:null in tryCallOne
at node_modules\promise\setimmediate\core.js:null in setImmediate$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _allocateCallback$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _callTimer
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _callReactNativeMicrotasksPass
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in callReactNativeMicrotasks
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __callReactNativeMicrotasks
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __guard$argument_0
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __guard
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in flushedQueue

[Unhandled promise rejection: TypeError: undefined is not an object (evaluating '(yield connection.getLatestBlockhash().catch(function (err) {]
at App.tsx:null in Promise$argument_0
at node_modules\@babel\runtime\helpers\asyncToGenerator.js:null in asyncGeneratorStep
at node_modules\@babel\runtime\helpers\asyncToGenerator.js:null in _next
at node_modules\promise\setimmediate\core.js:null in tryCallOne
at node_modules\promise\setimmediate\core.js:null in setImmediate$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _allocateCallback$argument_0
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _callTimer
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in _callReactNativeMicrotasksPass
at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:null in callReactNativeMicrotasks
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __callReactNativeMicrotasks
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __guard$argument_0
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in __guard
at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:null in flushedQueue

When call `signTransaction` method, mobile web browser and mobile phantom app turn on alternately.

When calling signTransaction method of deeplink in a mobile web browser,
Alternatively, the app install page in the mobile web browser or Phantom app turns on

Can't i fix the Phantom app so that it only turns on ??

• code

function build_url(path: string, params: URLSearchParams) {
        return `https://phantom.app/ul/v1/${path}?${params.toString()}`;
    }


const params = new URLSearchParams({
            dapp_encryption_public_key,
            cluster: "devnet",
            app_url: "https://phantom.app",
            redirect_link, // redirect to my server
        });

const uri = build_url("signTransaction", params);
window.open(uri);

• screenshot

Device info

• Galaxy21 5G SM-G991N G991NKSS3CVI3 / G991NOKR3CVI3 / G991NKOU3CVH1
• Android version : 12
• Phantom App version : 22.09.06
• Chrome version : 105.0.5195.136

Unable to decrypt data

Hi everyone, I tried to use deep links using this guide: https://phantom.app/learn/blog/the-complete-guide-to-phantom-deeplinks

I am stranded with a decryption error. Any idea what's wrong?

redirect link http://my-web-app-link?phantom_encryption_public_key=GizcmtSP17ZjJZjeYQfQtdSTKuD67sX6EgMcYNMMoB1q&nonce=KbYv3xJg8BtvMk3sWkpsTzi6n5L6WrcTC&data=2xDQVQEn11jZJwkKgmVwv1YTVx5g8rPPUV9c7pwbsAW9ViuoA9PibZZu687523RoPKtsn5PTwpD4G976nnERe7AHXz4U7fMxM3ruJRY5fDqmNssCWfbC3TQhw4guN79vzbYRk67tfW88dmTvakDqjKeU7MC9aMcGAnwSzpcMzoxNpceBHbqDasXhBGGck7RCW7JaASi7U5wZ4eww4EM37YTJaWnkv2va172w6Nr6hbZ3ajjKD79ToJd4ccHhvNdBc5ZP9bLF4ipp21JH6qMGV7QHysiaSDysY8N8x3qZUedMc1LNmfVmdDUDQkuCraXeWKxtNk5k7UNJiMjrwStsTdCySNnSMzq9a3oNsfRFiQ5K1dhYEoBnQqJgNk1TSioMaTG5w5rxDzZe1r7RYof4iSx59SjC5NoEH5ghRsJLFPAZWz3

Error: Unable to decrypt data

 private decryptPayload(data: Uint8Array, nonce: Uint8Array, sharedSecret?: Uint8Array): any {
    if (!sharedSecret) {
      throw new Error('Missing shared secret');
    }

    const decryptedData = nacl.box.open.after(
      data,
      nonce,
      sharedSecret,
    );

    console.log(decryptedData);

    if (!decryptedData) {
      throw new Error('Unable to decrypt data');
    }

    return JSON.parse(Buffer.from(decryptedData).toString('utf8'));
  }

public connect(): void {
    // Modify the parameters accordingly
    const params = new URLSearchParams({
      dapp_encryption_public_key: bs58.encode(this.dappKeyPair.publicKey),
      cluster: 'devnet',
      app_url: window.location.origin,
      redirect_link: window.location.origin + window.location.pathname
    });

    const url = this.buildUrl('connect', params);
    window.location.href = url;
  }

  private buildUrl(path: string, params: URLSearchParams): string {
    return `https://phantom.app/ul/v1/${path}?${params.toString()}`;
  }

  public handleDeepLink(deepLink: string): void {
    const url = new URL(deepLink);
    const params = url.searchParams;

    if (params.get('errorCode')) {
      return;
    }

    if (params.get('phantom_encryption_public_key')) {
      const sharedSecretDapp = nacl.box.before(
        bs58.decode(params.get('phantom_encryption_public_key')!),
        this.dappKeyPair.secretKey
      );

      console.log('pb',bs58.decode(params.get('phantom_encryption_public_key')!).toString());
      console.log( 'sk',this.dappKeyPair.secretKey.toString());

      const connectData = this.decryptPayload(
        bs58.decode(params.get("data")!),
        bs58.decode(params.get("nonce")!),
        sharedSecretDapp,
      );

      this.sharedSecret = sharedSecretDapp;
      this.addressSubject.next(connectData);
    }
  }

Android Expo link not working.

I ran cloned the repo.
I cd'ed into the directory.
I executed yarn start.
I got the QR code.
I downloaded and installed the Expo Go app.
I scanned the QR code
I get the following message:

I have tried stopping it and yarn starting again but that also didn't work.
I have also restarted the Expo Go app.
There are no error messages in the terminal when 'something went wrong'.
This is the error message on my phone:

I'm running on an M1 chip: Apple M1 Max
Monterey 12.2.1 (21D62)

My Android phone is Pixel 6

Both devices are on the same Wifi network.

I would appreciate any help getting this running. :D