Bravo Studio Help Center
Search
⌃K
🖇

Deep Links

Create a shareable link that will open your app to a specific screen.
​Upgrade your free account to the Olé plan to use this feature.
A deep link is a type of link that will send the user to a specific page of a mobile app. Usually, deep links are used in QR codes or in websites. When these links are opened on a phone (browser, QR code or other method), the user will be redirected to the part of the app we specified.
Once you have imported a design file into Bravo and created an app project, you can generate a deep link targeting any of the app pages. To do that, go to Integrations > Deep Links.
To generate a deep link, you'll need to specify the following values:
  • Deep Link Name: the name for the deep link you'll generate. You can use any name you prefer. Later on, the latest generated deep links will appear in the panel, identified with the name you set here.
  • URL copied from Bravo Vision: here, you'll specify the app page you want to target with the deep link. To get this URL, you need to open the app in Bravo Vision, go to the desired page, long press, and select Copy page URL, as indicated here.
  • URL to open from desktop: in case the deep link is opened from a desktop device instead of a mobile phone, the URL specified here will be opened. You can set it to whatever webpage you wish. Remember to provide the complete webpage URL (including https://).
You'll see the Create live app link button disabled, as you'll need to set up a Firebase project and provide some assets to be able to generate this link. This will be covered later in this guide.
While your app is not published, you'll be able to create a deep link targeting an app in Bravo Vision. To create the link, click on Create Bravo Vision link inside the Deep Links section, in the app settings.
Once the link is created, it will appear under Generated deep links (last 10).
Now, you'll be able to get the QR code for that deep link, by clicking on the eye icon. Alternatively, you can copy the link in text format, by clicking on the icon in the left.
To test it, make sure the app is opened on Bravo Vision, in the mobile device where you're going to test the deep link. Otherwise, the link won't work.
To open the link in your mobile device, simply send it in text format via your preferred method (email, messaging, notes...) or scan the QR code.
In case you're about to publish your app to the stores, or test it with Testflight / debug APK, you can generate a deep link targeting it.
Make sure you set this up before generating the app bundles (IPA / AAB) and making your app public. Otherwise you will need to upload an update to the stores, requiring all your users to update the app on their phones.
To have Deep links running on your published app we need a Firebase project plus the following:
Now let's create the project on Firebase.
  1. 1.
    Go to Firebase, create a new project inside your account (You need a Google account first). If you already have a Firebase project for the app, skip this step.
  2. 2.
    Inside the project, go to Engage > Dynamic Links.
  1. 1.
    Click on Get Started.
  2. 2.
    On the Add a URL prefix click on the Domain input.
  3. 3.
    Click on the option (autogenerated) below Google provided domains.
  4. 4.
    Click Continue and Finish.
On the Dynamic Links page, click on the tree dots icon (at the right of the New Dynamic Link button) and select Allowlist URL pattern.
You might also see a warning on setting your allowed domains for Dynamic Links, which has the same purpose. In this page, enter your domain as: apps-service.bravostudio.app and press Save. This will automatically generate your Regex URL.
After saving your first allowed domains, you will need to fill it with the Regex URL, if you need to add more domains. For instance, on Regex URL pattern, you will have to enter: ^https{0,1}:\/\/apps-service.bravostudio\.app([\/#\?].*){0,1}$ and press Add.
You will need to add any domain you are going to use as fallbacks on your deep links, like your website domain. Remember to use the same regex syntax.
Now, you need to complete the following steps to obtain some assets that we'll provide later inside the Bravo Studio settings:
  1. 1.
    In your Firebase project, go to Build > Authentication. Here, add a sign-in method. You can use, for instance, email / password. Although we don't need to set up any authentication in our app to use deep links, this configuration will generate a web API key that we will use later.
  2. 2.
    Click on the wheel icon at the top left, then click on Project settings.
  3. 3.
    On the General tab, scroll down to Your apps.
If you don't have any app created here, follow the next steps. Otherwise add the missing params we mention:
  1. 1.
    Click on the iOS+ icon.
  2. 2.
    Enter your Apple bundle ID and App Store ID. Remember you need to complete step 2 of the publishing process to have these parameters ready.
  3. 3.
    Click on Register app and continue until step 5. Click Continue to console.
  4. 4.
    Back in the same Deep Links section, enter the Team ID on the Apple app you have just created. You can find this on the Apple developer portal, under the Identifier of your app, as App ID Prefix. Then Save.
  5. 5.
    Now click on Add app and select the Android icon.
  6. 6.
    Enter your Android Package name. Remember you need to have completed steps 1 and 4 of the Android publishing process to have these parameters ready.
  7. 7.
    In Debug signing certificate SHA-1 add the SHA 256 code (not the SHA-1) corresponding to your Android app. Find this code from the build history of your app on Bravo Studio:
Now go back to Bravo -> [Your app] -> Integrations -> Deep Links -> Firebase Settings and provide the following data:
  • Web API key: copy this from your Firebase project settings. If you see the message "No web API key for this project", indicate an Authentication method as described before.
  • URL prefix: this is the URL prefix indicated in Firebase before. In case it's a Google domain, it will end in .page.link. Copy it from Firebase and paste it here.
  • Android Package Name: the package name for the Android app, specified in Firebase.
  • iOS GoogleService plist file: the iOS configuration file you can download from a Firebase iOS App in Firebase console.
  • iOS Package Name: the bundle ID for the iOS app, specified in Firebase.
  • iOS App Store ID: in case you have published the app for iOS, copy this value from the App Store Connect portal, under App Information. The app doesn't need to be published, only created in App Store Connect.
    Once you've set these values, click Save. Finally, go to the Generate links section, fill in the Deep Link Name and URLs, and click on Create live app link. You'll obtain a deep link that you can test on a mobile device with the target app installed. You can test it via QR code, or copying the link URL in the Notes app, and opening it from the mobile device, won't work using the browser address bar.
In case the Create live app link button is disabled, go through the Firebase configuration steps and make sure you provided the right values inside the Firebase settings section.
Once you've indicated these settings, you can go ahead and request your app bundle.
If you already have a published app bundle, and you change these settings afterwards, you'll need to generate a new bundle and publish an update to the stores.
  • You can get extra information on issues adding &d=1 on the deep link.
  • Double check that you have filled all the fields in the Bravo Deep links settings, and uploaded all the files.

iOS troubleshooting

  • Be sure to fill the Team ID in Firebase project settings, without it the deep links won't work at all.
  • You can double check that the configuration file that Firebase generates exists opening in the browser the URL: https://<your-firebase-deeplink-domain>.page.link/.well-known/apple-app-site-association, a file should be there and should have the correct bundle id.
  • For testing iOS deep links we recommend using the Notes app, pasting the link there and tapping on it, should trigger the deep link and open the app instead of the browser. If still doesn't work, on the browser check if scrolling a banner appears on top, asking to choose to open the app instead, iOS remembers the last preference and if the first time due to an error the link was opened in the browser, it will open the browser.
​
Data binding - Previous
Conditional Actions
Next - Integrations
Push Notifications with OneSignal
Last modified 2mo ago