Live View

Live View provides real-time remote access to Android devices, allowing you to directly control and interact with cloud-based Android devices through your browser.

Get Started

1. Get an API Key

   1. Go to GBOX AI
   2. Copy your API Key
   3. Paste your GBOX API Key into your env file

   .env

   GBOX_API_KEY=gbox-******
   
2. Install GBOX SDK and dependencies

   Install gbox-sdk and other required dependencies by running the following command in your terminal.

   Typescript

   npm install gbox-sdk dotenv typescript tsx @types/node open
   

   # Set up a virtual environment
   python3 -m venv venv
   source venv/bin/activate
   
   pip install gbox-sdk python-dotenv
   
3. Create a Live View box

   Create a Live View box by creating the following code file.

   Typescript

   import GboxSDK, { AndroidBoxOperator } from "gbox-sdk";
   import * as dotenv from "dotenv";
   import open from "open";
   
   dotenv.config();
   
   const gboxSDK = new GboxSDK({
     apiKey: process.env["GBOX_API_KEY"], // This is the default and can be omitted
   });
   
   let currentBox: AndroidBoxOperator | null = null;
   
   async function gracefulShutdown() {
     if (currentBox) {
       console.log("Shutting down program, deleting Android box...");
       try {
         await currentBox.terminate();
         console.log("Box successfully terminated");
       } catch (error) {
         console.log(`Error terminating box: ${error}`);
       }
     }
     process.exit(0);
   }
   
   // Listen for SIGINT signal (Ctrl+C)
   process.on("SIGINT", gracefulShutdown);
   process.on("SIGTERM", gracefulShutdown);
   
   async function main() {
     try {
       console.log("\nAndroid Box Manager Started\n");
   
       console.log("Creating Android box...");
       const box = await gboxSDK.create({ type: "android" });
       currentBox = box;
   
       console.log("Android box created successfully!");
       console.log(`Box ID: ${box.data.id}`);
   
       console.log("Getting live view...");
       const liveView = await box.liveView();
   
       console.log("Live view is ready!");
       console.log(`View URL: ${liveView.url}`);
   
       console.log("Opening browser...");
       console.log(
         `You can try operate the android box in the browser, and then press Ctrl+C to stop and terminate box\n`
       );
       await open(liveView.url, {
         wait: true,
       });
   
       // Keep the program running, waiting for SIGINT signal
       await new Promise(() => {});
     } catch (error) {
       console.log(`An error occurred: ${error}`);
       if (currentBox) {
         await gracefulShutdown();
       }
       process.exit(1);
     }
   }
   
   main();
   

   import os
   import signal
   import sys
   import webbrowser
   from dotenv import load_dotenv
   from gbox_sdk import GboxSDK
   
   # Load environment variables from .env file
   load_dotenv()
   
   current_box = None
   
   def graceful_shutdown(signum, frame):
       global current_box
       if current_box:
           print("Shutting down program, deleting Android box...")
           try:
               current_box.terminate()
               print("Box successfully terminated")
           except Exception as error:
               print(f"Error terminating box: {error}")
       sys.exit(0)
   
   # Listen for SIGINT signal (Ctrl+C)
   signal.signal(signal.SIGINT, graceful_shutdown)
   signal.signal(signal.SIGTERM, graceful_shutdown)
   
   def main():
       global current_box
       try:
           print("\nAndroid Box Manager Started\n")
   
           api_key = os.getenv("GBOX_API_KEY")
           gbox = GboxSDK(api_key=api_key)
   
           print("Creating Android box...")
           box = gbox.create(type="android")
           current_box = box
   
           print("Android box created successfully!")
           print(f"Box ID: {box.data.id}")
   
           print("Getting live view...")
           live_view = box.live_view()
   
           print("Live view is ready!")
           print(f"View URL: {live_view.url}")
   
           print("Opening browser...")
           print(
               "You can try operate the android box in the browser, and then press Ctrl+C to stop and terminate box\n"
           )
           webbrowser.open(live_view.url)
   
           # Keep the program running, waiting for SIGINT signal
           while True:
               pass
   
       except Exception as error:
           print(f"An error occurred: {error}")
           if current_box:
               graceful_shutdown(None, None)
           sys.exit(1)
   
   if __name__ == "__main__":
       main()
   

4. Run the box

   Run the Live View box by running the following command in your terminal.

   Typescript

   npx tsx index.ts
   

   python main.py
   

Embed Live View in your website

You can embed Live View in your website by using the following code.

<iframe src="{YourLiveViewLink}" width="100%" height="100%" />