ReactVision Studio Setup

Generate an API key and project ID from ReactVision Studio for cloud and geospatial anchors.

To use the ReactVision provider for Cloud Anchors and Geospatial Anchors, you need an API key and a project ID from ReactVision Studio. This guide walks you through generating both.

📘

When is this required?

You only need a ReactVision API key and project ID if you are using provider="reactvision" (the default since v2.53.0) for cloud or geospatial anchor features. If you are using provider="arcore" or provider="none", you can skip this guide.

---

Step 1: Create a ReactVision Studio Account

1. Go to studio.reactvision.xyz
2. Log in with an existing account or create a new one

---

Step 2: Select a Team

1. Navigate to studio.reactvision.xyz/dashboard/team/list
2. Select the team you would like to use for your app

---

Step 3: Create a Project

1. Once in your team, you will be taken to the Projects section
2. Click Create Project in the top-right corner
3. Enter a name for your project
4. Optionally configure an icon and occlusion settings (these can be updated later)
5. Click Create to finish

---

Step 4: Get Your Project ID

1. Click into the project you just created
2. Click the Edit button in the top-right corner
3. In the edit modal, you will see a Project ID displayed under the project name
4. Click the Copy button to copy your project ID

📋

Keep this handy — you will use this value as rvProjectId in your app configuration.

---

Step 5: Create an API Key

1. Navigate back to your team's Projects page
2. In the top navigation bar, click API Keys
3. Click Create Key in the top-right corner
4. Give your key a descriptive name (e.g. "My AR App - Production")
5. Click Create

⚠️

Important: You will only see the API key once after creation. Copy it immediately and store it securely.

6. Copy the generated API key

📋

Keep this handy — you will use this value as rvApiKey in your app configuration.

---

Using Your Credentials

Expo Projects

Add rvApiKey and rvProjectId to your app.json plugin configuration:

JSON

{
  "plugins": [
    [
      "@reactvision/react-viro",
      {
        "provider": "reactvision",
        "rvApiKey": "YOUR_REACTVISION_API_KEY",
        "rvProjectId": "YOUR_REACTVISION_PROJECT_ID"
      }
    ]
  ]
}

See Integrating ViroReact with Expo for the full plugin configuration reference.

iOS (Non-Expo)

Add the following keys to your Info.plist:

XML

<key>RVApiKey</key>
<string>YOUR_REACTVISION_API_KEY</string>
<key>RVProjectId</key>
<string>YOUR_REACTVISION_PROJECT_ID</string>

Android (Non-Expo)

Add the following <meta-data> entries inside the <application> tag in your AndroidManifest.xml:

XML

<meta-data
    android:name="com.reactvision.RVApiKey"
    android:value="YOUR_REACTVISION_API_KEY" />
<meta-data
    android:name="com.reactvision.RVProjectId"
    android:value="YOUR_REACTVISION_PROJECT_ID" />

---

Next Steps

• Cloud Anchors — Share AR anchors across devices
• Geospatial Anchors — Place AR content at real-world coordinates
• ViroARSceneNavigator — Full prop reference including provider, rvApiKey, and rvProjectId