#button-20_react-native-identity

1 messages ยท Page 1 of 1 (latest)

hearty iglooBOT
#

๐Ÿ‘‹ Welcome to your new thread!

โฒ๏ธ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.

โฑ๏ธ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.

๐Ÿ”— This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1440047569391718572

๐Ÿ“ Have more to share? Add more details, code, screenshots, videos, etc. below.

Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.

hexed pumice
#

Hi ๐Ÿ‘‹

Can you clarify what exact step you are on? This code doesn't look like anything in the doc you linked

keen obsidian
#

Add an event handler to the Verify button

hexed pumice
#

And what is throwing the error?

#

const response = await fetchVerificationSessionParams(); This isn't a function in our docs so that is what I'm curious about

#

Do you mean this functionality?

// Call your backend to create the VerificationSession.
const response = await fetch('/create-verification-session', { method: 'POST' });
const session = await response.json();

// Show the verification modal.
const { error } = await stripe.verifyIdentity(session.client_secret)
keen obsidian
hexed pumice
#

That is the doc I'm looking at

keen obsidian
#

Currently implementing for React Native

hexed pumice
#

What step are you referring to?

#

Ah

#

That is important information

keen obsidian
#

Yes exactly

hexed pumice
#

See how that URL is different? It has the params to let me know what integration framework you are using. I know it's a small detail but it helps.

keen obsidian
#

Yeah my bad

hexed pumice
#

Okay so the function fetchVerificationSessionParams() is defined above as

const fetchVerificationSessionParams = async () => {
    try {
      const data = await fetch(`${YOUR_SERVER_BASE_URL}/create-verification-session`, {
        method: 'POST',
        headers: {
          'Content-Type': 'application/json',
        },
      });
      const json = await data.json();
      return json;
    } catch (e) {
      return {};
    }
  };

Do you know if this request is hitting your server? Is the error coming from the server or your RN client code?

keen obsidian
#

It's coming from the RN client code. So apparently, it's not locating the logo. I tried using a remote logo URL as well but still didn't work out

hexed pumice
#

Can you log the logo value before you pass it in to Image.resolveAssetSource(logo)?

keen obsidian
#

Yeah

hexed pumice
#

And you're just using this, right?

// A square logo for your brand
import logo from './assets/{{YOUR_BRAND_LOGO}}.png';

Okay so I'd love to double check by logging that here:

const fetchOptions = async () => {
    const response = await fetchVerificationSessionParams();
    console.log("Logo URL: ", logo);  // <- add this
    return {
      sessionId: response.id,
      ephemeralKeySecret: response.ephemeral_key_secret,
      brandLogo: Image.resolveAssetSource(logo),
    };
  };
keen obsidian
#

This is code and the log

 LOG  Brand Logo:  {"__packager_asset": true, "height": 667, "scale": 1, "uri": "http://localhost:8081/assets/?unstable_path=.%2Fassets/icon.png?platform=android&hash=d30242c4f54ca166136b41b17877aac6", "width": 667}```
hexed pumice
#

And you still get errors in the Image.resolveAssetSource()?

keen obsidian
#

Yes this is the full log

 LOG  Brand Logo:  {"__packager_asset": true, "height": 667, "scale": 1, "uri": "http://localhost:8081/assets/?unstable_path=.%2Fassets/icon.png?platform=android&hash=d30242c4f54ca166136b41b17877aac6", "width": 667}
Error: Could not extract asset path from URL
    at Server._processSingleAssetRequest (C:\Mobile Development\PeerPays\PeerPays\node_modules\metro\src\Server.js:326:13)
    at Server._processRequest (C:\Mobile Development\PeerPays\PeerPays\node_modules\metro\src\Server.js:417:18)
    at processRequest (C:\Mobile Development\PeerPays\PeerPays\node_modules\metro\src\Server.js:357:10)
    at call (C:\Mobile Development\PeerPays\PeerPays\node_modules\connect\index.js:239:7)
    at next (C:\Mobile Development\PeerPays\PeerPays\node_modules\connect\index.js:183:5)
    at Immediate.next (C:\Mobile Development\PeerPays\PeerPays\node_modules\connect\index.js:161:14)
    at processImmediate (node:internal/timers:493:21)
#

And logo doesn't display on the verification screen

hexed pumice
#

Yeah unfortunately this isn't a Stripe SDK error, it's just React Native. It seems like it cannot find the .png file based on the URL provided

keen obsidian
#

I tried using a logo online but still the same results

#

The logo is precisely at the exact logo within the code just as written within the docs

#

Or could it be the SDK version?

hexed pumice
#

Right, but what I am saying is that this is not a function of the Stripe SDK. So I don't have any special insight into what is going wrong here.

#

If Image.resolveAssetSource(logo) is that is throwing the error

#

What happens if you omit the brandLogo param?

keen obsidian
#

The stripe SDK throws an error and crashed the app

hexed pumice
#

What line of code throws the error?

keen obsidian
#

const { present } = useStripeIdentity(fetchOptions);

hexed pumice
#

What happens if you omit the brandLogo parameter?

keen obsidian
#

It crashes the app

#

I could send you a video demonstration now if you prefer that

hexed pumice
#

What version of the Stripe Identity SDK are you using?

keen obsidian
hexed pumice
#

The current version of Stripe Identity is v0.4.0. It looks like there have been some bug fixes since then.

keen obsidian
#

Oh okay but I keep getting compatibility errors with the 2

#

Could it be the expo version?

hexed pumice
#

I keep getting compatibility errors with the 2

What does that mean? "With the 2"?

#

Do you mean stripe-react-native and stripe-identity-react-native?

keen obsidian
#

Yes

hexed pumice
#

What do you mean by dependecy issues? can you be more specific?

keen obsidian
#

You mean "compatibility"? I tried different versions of the stripe-identity-react-native but the build kept crashing because the 2 weren't matching

#

It threw a "StripeCore" error incompatibility for both Android and IOS

#

Should I give the latest SDKs a try again?

hexed pumice
#

Well the latest stripe-react-native version is 0.57.0 as well. I imagine that the latest of each would use the same dependencies.

keen obsidian
#

I'll give it a try again

hearty iglooBOT
#

button-20_react-native-identity

crude crag
#

@keen obsidian let me know if you have questions or got that working