.NET client

Overview

The CloudBrowserAISharp client provides shortcuts for access to our endpoints to perform various tasks.


Getting Started

Requirements

  • .NET Core SDK installed.

  • The CloudBrowserAiSharp and PuppeteerSharp NuGet packages.

  • Your CloudBrowser.AI API token.

Installation

Install the required NuGet packages:

dotnet add package CloudBrowserAiSharp
dotnet add package PuppeteerSharp

Features

Open

The following example demonstrates how to request a browser instance, navigate to a webpage, and close the browser:

        using BrowserService svc = new("YOUR CLOUDBROWSER.AI TOKEN");
        
        //Request Cloud Browser AI to open a browser
        //using default settings
        var rp = await svc.Open().ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else { 
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return;
        }

        var browser = await Puppeteer.ConnectAsync(new ConnectOptions {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);

        Console.WriteLine("Browser connected");

        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];

        await page.GoToAsync("http://www.cloudbrowser.ai").ConfigureAwait(false);
        Console.WriteLine("Web visited");

        await Task.Delay(5000).ConfigureAwait(false);

        //You can close the browser using puppetter or CloudBrowser AI api
        //await svc.Close(rp.Address).ConfigureAwait(false);
        await browser.CloseAsync().ConfigureAwait(false);

        Console.WriteLine("Browser closed");

How It Works

  1. Initialize the Client: Create an instance of BrowserService using your API token.

  2. Request a Browser Instance: Call svc.Open() to request a new browser session from the CloudBrowser.AI service.

  3. Connect with PuppeteerSharp: Use the WebSocket address provided in the response to connect to the browser instance using Puppeteer.ConnectAsync().

  4. Perform Browser Actions: Interact with the browser via PuppeteerSharp, such as navigating to a webpage or automating tasks.

  5. Close the Browser: Either use PuppeteerSharp's browser.CloseAsync() or CloudBrowser.AI's svc.Close() API to terminate the session.

OpenAdvanced

The following example demonstrates how to request a browser instance with advanced configuration, including custom browser settings, proxy, and a timeout for keeping the browser open.

        using BrowserService svc = new("YOUR CLOUDBROWSER.AI TOKEN");

        // Request a Cloud Browser instance with advanced settings
        var rp = await svc.Open(new() {
            Label = "MyCustomBrowser",  // Custom label for the browser instance
            // Chromium is supported but we recommend Chrome for best stealth
            Browser = CloudBrowserAiSharp.Browser.Types.SupportedBrowser.Chromium,
            KeepOpen = 10 * 60,  // This browser will close after 10 minutes without Puppeteer connection
            Proxy = new() {
                Host = "IP.0.0.0.1",
                Port = "3000",
                Password = "password",
                Username = "username",
            }
        }).ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return;
        }

        // Connect to the browser instance using PuppeteerSharp
        var browser = await Puppeteer.ConnectAsync(new ConnectOptions {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);

        Console.WriteLine("Browser connected");

        // Open the first page and navigate to a URL
        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];
        await page.GoToAsync("http://www.cloudbrowser.ai").ConfigureAwait(false);
        Console.WriteLine("Web visited");

        // Wait for a few seconds to simulate interaction
        await Task.Delay(5000).ConfigureAwait(false);

        // Close the browser using CloudBrowser AI API or Puppeteer
        await svc.Close(rp.Address).ConfigureAwait(false);
        //await browser.CloseAsync().ConfigureAwait(false);

        Console.WriteLine("Browser closed");

How It Works

  1. Initialize the Client: Create an instance of BrowserService using your API token.

  2. Request a Browser Instance with Advanced Configuration: Call svc.Open() with advanced options, including:

    • Label: Set a custom label for the browser instance.

    • Browser: Choose the browser type (e.g., Chromium or Chrome).

    • KeepOpen: Set the timeout in seconds for how long the browser should remain open without a Puppeteer connection.

    • Proxy: Configure proxy settings (host, port, username, password).

  3. Connect with PuppeteerSharp: Use the WebSocket address provided in the response to connect to the browser instance with Puppeteer.ConnectAsync().

  4. Perform Browser Actions: Interact with the browser, such as navigating to a URL or automating tasks.

  5. Close the Browser: You can close the browser either using PuppeteerSharp's browser.CloseAsync() or the CloudBrowser.AI svc.Close() API.

OpenAndSave

The following example demonstrates how to open a browser instance, save and restore a session, visit a webpage, perform actions (like login), and close the browser. The session is saved so that the next time the browser is opened, it restores the previous session without requiring you to log in again.

    static async Task Main(string[] args) {
        const string token = "YOUR CLOUDBROWSER.AI TOKEN";
        using BrowserService svc = new(token);

        // FIRST VISIT --------------------------------------------------------------------
        var browser = await OpenAndConnect(svc).ConfigureAwait(false);
        if (browser == null)
            return;

        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];

        await page.GoToAsync("http://app.cloudbrowser.ai").ConfigureAwait(false);
        Console.WriteLine("Web visited");

        await Login(page).ConfigureAwait(false);
        await Task.Delay(5000).ConfigureAwait(false);

        await browser.CloseAsync().ConfigureAwait(false);
        Console.WriteLine("Browser closed");

        // SECOND VISIT -------------------------------------------------------------------
        await Task.Delay(1000).ConfigureAwait(false);

        browser = await OpenAndConnect(svc).ConfigureAwait(false);
        if (browser == null)
            return;

        page = (await browser.PagesAsync().ConfigureAwait(false))[0];

        await page.GoToAsync("http://app.cloudbrowser.ai").ConfigureAwait(false);
        Console.WriteLine("Web visited again");

        // This time, logging in is not necessary.
        await Task.Delay(5000).ConfigureAwait(false);

        await browser.CloseAsync().ConfigureAwait(false);
        Console.WriteLine("Browser closed");

        // CHECK STORED SESSIONS ----------------------------------------------------------
        using SessionService sessions = new(token);
        Console.WriteLine("Label | Created On | Last Update");
        var sessionRp = await sessions.List().ConfigureAwait(false);
        foreach(var s in sessionRp.Sessions) {
            Console.WriteLine("{0} | {1} | {2}",s.Label,s.CreatedOn, s.LastUpdate);
        }

        // REMOVE ONE SESSION
        await sessions.Remove("test").ConfigureAwait(false);
    }

    static async Task<IBrowser?> OpenAndConnect(BrowserService svc) {
        var rp = await svc.Open(new() {
            Label = "SessionSample",      // Label for the session
            SaveSession = true,           // Save session after browser closes
            RecoverSession = true        // Recover saved session on next browser launch
        }).ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return null;
        }

        return await Puppeteer.ConnectAsync(new ConnectOptions {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);
    }

    static async Task Login(IPage page) {
        // Simulating login by filling out email and password fields and submitting the form
        await page.TypeAsync("[type=\"email\"]", "email").ConfigureAwait(false);
        await page.TypeAsync("[type=\"password\"]", "password").ConfigureAwait(false);
        await page.ClickAsync("[type=\"submit\"]").ConfigureAwait(false);
    }

How It Works

  1. Initialize the Client: Create an instance of BrowserService using your API token.

  2. Request a Browser Instance with Session Saving and Recovery: Call svc.Open() with the following options:

    • Label: Set a custom label for the browser session.

    • SaveSession: Enable session saving, so that the state of the session (like cookies and local storage) is stored.

    • RecoverSession: Enable session recovery, so the session is restored the next time the browser is opened.

  3. Perform Actions: Navigate to a webpage (in this case, http://app.cloudbrowser.ai), simulate a login, and close the browser.

  4. Session Restore: On the second visit, the session is automatically restored, so you don’t need to log in again.

  5. Manage Stored Sessions: Use the SessionService to list all stored sessions, remove a session, or interact with them as needed.

  6. Close the Browser: The browser can be closed after each interaction using browser.CloseAsync(). The session data is saved for the next time you open the browser with session recovery enabled.


This approach enables you to save and restore sessions across multiple visits to the same page, making it more efficient for use cases like logging in once and maintaining the session for subsequent visits.

RemoteDesktop

The following example demonstrates how to request a browser instance, connect to it via Puppeteer, start a remote desktop session, and then stop the remote desktop session.

        using BrowserService svc = new("YOUR CLOUDBROWSER.AI TOKEN");

        var rp = await svc.Open().ConfigureAwait(false);

        if (rp.Status == CloudBrowserAiSharp.Browser.Types.ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return;
        }

        var browser = await Puppeteer.ConnectAsync(new() {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);
        Console.WriteLine("Browser connected");

        // Start the remote desktop session
        var rmt = await svc.StartRemoteDesktop(rp.Address).ConfigureAwait(false);
        Console.WriteLine("Remote desktop address:");
        Console.WriteLine($"https://browser.cloudbrowser.ai${ObtainId(rp.Address)}/{rmt.Password}");

        // Wait for 5 seconds to simulate the usage of the remote desktop
        await Task.Delay(5000).ConfigureAwait(false);

        // Stop the remote desktop session
        await svc.StopRemoteDesktop(rp.Address).ConfigureAwait(false);
        Console.WriteLine("Remote Desktop closed");
    }

    // Function to extract the ID from the browser WebSocket address
    static string ObtainId(string address) {
        string pattern = @"\.ai\/(.*?)\/devtools";
        var match1 = Regex.Match(address, pattern);
        return match1.Groups[1].Value;
    }

How It Works

  1. Initialize the Client: Create an instance of BrowserService using your API token.

  2. Request a Browser Instance: Call svc.Open() to request a new browser session. This will return a WebSocket address to connect to the browser instance.

  3. Connect to the Browser with Puppeteer: Use PuppeteerSharp to connect to the browser instance using the provided WebSocket endpoint (rp.Address).

  4. Start Remote Desktop Session: Call svc.StartRemoteDesktop() to initiate a remote desktop session, and the service will return a URL and password to access the session.

  5. Obtain Remote Desktop URL: The URL to access the remote desktop is generated by extracting the browser ID from the WebSocket address and appending the password provided by StartRemoteDesktop().

  6. Stop Remote Desktop Session: Call svc.StopRemoteDesktop() to close the remote desktop session once you're done.

  7. Wait for Remote Desktop Use: After starting the remote desktop session, the program waits for a set period (5 seconds) to simulate usage before closing the session.


This approach allows you to remotely control a browser instance and interact with it via a remote desktop session, making it useful for automating tasks where visual interaction with the browser is necessary.

Get

The following example demonstrates how to request a browser instance, navigate to a webpage, disconnect the browser, retrieve details about all active browsers, and close them.

        using BrowserService svc = new("YOUR CLOUDBROWSER.AI TOKEN");

        // Request a new browser instance
        var rp = await svc.Open().ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return;
        }

        // Connect to the browser using PuppeteerSharp
        var browser = await Puppeteer.ConnectAsync(new () {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);
        Console.WriteLine("Browser connected");

        // Navigate to a webpage
        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];
        await page.GoToAsync("http://www.cloudbrowser.ai").ConfigureAwait(false);
        Console.WriteLine("Web visited");

        // Disconnect the browser
        browser.Disconnect();
        Console.WriteLine("Browser disconnected");

        // Retrieve the list of all active browsers
        var rpGet = await svc.Get().ConfigureAwait(false);

        // Print details of all active browsers
        Console.WriteLine("Label | Address | Started On | VNC Opened | VNC Pass");
        foreach (var b in rpGet.Browsers) {
            Console.WriteLine("{0} | {1} | {2} | {3} | {4}", b.Label, b.Address, b.StartedOn, b.VNCPass != null, b.VNCPass);
            await svc.Close(b.Address).ConfigureAwait(false); // Close each browser
        }

How It Works

  1. Initialize the Client: Create an instance of BrowserService using your API token.

  2. Request a Browser Instance: Call svc.Open() to request a new browser session. The response will contain a WebSocket address (rp.Address) to connect to the browser instance.

  3. Connect to the Browser with Puppeteer: Use PuppeteerSharp to connect to the browser instance using the WebSocket address provided by the Open method.

  4. Navigate to a Webpage: Interact with the browser by navigating to a specified URL (e.g., "http://www.cloudbrowser.ai").

  5. Disconnect the Browser: Use browser.Disconnect() to disconnect from the browser session via PuppeteerSharp.

  6. Retrieve Active Browsers: Call svc.Get() to get a list of all active browser sessions, including their details like label, address, start time, and VNC credentials.

  7. Close Active Browsers: Loop through the list of active browsers and close each one by calling svc.Close() for each browser's address.


This approach allows you to automate browser interaction, retrieve information about active sessions, and close them as needed, all through the CloudBrowser.AI API.

AIQuery

The following example demonstrates how to query an AI model (via OpenAI) to process an HTML document retrieved from a browser, and extract specific information based on a prompt.

    const string clToken = "YOUR CLOUDBROWSER.AI TOKEN";
    const string openAiToken = "YOUR OPEN AI TOKEN";

    static async Task Main(string[] args) {

        // Retrieve the HTML content of a webpage
        var html = await GetHTML("http://www.cloudbrowser.ai").ConfigureAwait(false);

        if (html == null) return;

        // Initialize AIService with your CloudBrowser.AI and OpenAI credentials
        using AIService ai = new(clToken, new() {
            OpenAIConfiguration = new() {
                ApiKey = openAiToken,
            }
        });

        // Query the AI model using the HTML and prompt
        var rpai = await ai.Query<decimal>(new() {
            Html = html,
            Prompt = "Give me the lowest price"
        }).ConfigureAwait(false);

        // Output the result
        Console.WriteLine("The lowest price is: {0}", rpai);
    }

    // Function to retrieve HTML content from a given URL
    static async Task<string?> GetHTML(string address) {
        using BrowserService svc = new(clToken);

        var rp = await svc.Open().ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return null;
        }

        // Connect to the browser using PuppeteerSharp
        var browser = await Puppeteer.ConnectAsync(new ConnectOptions {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);

        Console.WriteLine("Browser connected");
        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];

        // Navigate to the given address and retrieve HTML content
        await page.GoToAsync(address).ConfigureAwait(false);
        return await page.GetContentAsync().ConfigureAwait(false);
    }

How It Works

  1. Initialize CloudBrowser.AI and OpenAI Service: Create instances of BrowserService (for CloudBrowser.AI) and AIService (for querying OpenAI) with your respective API tokens.

  2. Retrieve HTML Content: Use the GetHTML() method to launch a browser, navigate to a given URL, and retrieve the HTML content of the page using PuppeteerSharp.

  3. Query AI for Data Extraction: Call the Query() method of AIService to send the HTML and a custom prompt to OpenAI for processing. In this example, the prompt asks for the "lowest price" on the webpage. The AI model returns a result based on the prompt.

  4. Output the Result: Once the AI query is processed, the result is displayed in the console. In this case, the lowest price on the page is printed.


This approach integrates CloudBrowser.AI's browser automation capabilities with OpenAI's language model to process HTML content and extract specific information based on custom queries.

AIDescribe

The following example demonstrates how to extract an image URL from a webpage, send it to OpenAI for processing, and ask a question about the image (e.g., whether it is red). This example integrates CloudBrowser.AI's browser automation with OpenAI's AI model for image analysis.

    const string clToken = "YOUR CLOUDBROWSER.AI TOKEN";
    const string openAiToken = "YOUR OPEN AI TOKEN";

    static async Task Main(string[] args) {

        // Get the image source URL from the webpage
        var src = await GetImageAddress("http://www.cloudbrowser.ai", "img").ConfigureAwait(false);

        if (src == null) return;

        // Initialize AIService with your CloudBrowser.AI and OpenAI credentials
        using AIService ai = new(clToken, new() {
            OpenAIConfiguration = new() {
                ApiKey = openAiToken,
            }
        });

        // Query the AI model to describe the image based on the provided question
        var rpai = await ai.Describe<bool>(new() {
            ImageUrl = src,      // Send the image URL to the AI model
            Question = "Is the image red?"  // Ask the AI a question about the image
        }).ConfigureAwait(false);

        // Output the result
        Console.WriteLine("The image is red: {0}", rpai);
    }

    // Function to retrieve the image source URL from a webpage
    static async Task<string?> GetImageAddress(string address, string selector) {
        using BrowserService svc = new(clToken);

        // Open a browser session using CloudBrowser.AI
        var rp = await svc.Open().ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return null;
        }

        // Connect to the browser using PuppeteerSharp
        var browser = await Puppeteer.ConnectAsync(new ConnectOptions {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);

        Console.WriteLine("Browser connected");
        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];

        // Navigate to the given address and retrieve the image URL
        await page.GoToAsync(address).ConfigureAwait(false);
        var element = await page.QuerySelectorAsync(selector).ConfigureAwait(false);
        return await element.EvaluateFunctionAsync<string>("(el, attr) => el.getAttribute(attr)", "src").ConfigureAwait(false);
    }

How It Works

  1. Extract Image URL: The GetImageAddress() method uses CloudBrowser.AI and PuppeteerSharp to launch a browser, navigate to the provided webpage, and extract the src attribute of an image using the provided CSS selector.

  2. Send Image URL to OpenAI: The image URL is passed to OpenAI using the AIService.Describe() method. You can ask a question about the image, such as "Is the image red?" The AI model processes the image URL and provides a response.

  3. Output the Response: The response, which is a boolean value indicating whether the image is red, is displayed in the console.


This example showcases how CloudBrowser.AI's browser automation and OpenAI's AI model can be used to analyze images on the web by extracting image URLs and posing descriptive questions about them.

AIOptimize

The following example demonstrates how to use OpenAI through CloudBrowser.AI to optimize a product title for SEO (Search Engine Optimization). In this case, we optimize a product title to improve its visibility on an online store.

    const string clToken = "YOUR CLOUDBROWSER.AI TOKEN";
    const string openAiToken = "YOUR OPEN AI TOKEN";

    static async Task Main(string[] args) {
        // Initialize AIService with your CloudBrowser.AI and OpenAI credentials
        using AIService ai = new(clToken, new() {
            OpenAIConfiguration = new() {
                ApiKey = openAiToken,
            }
        });

        // Optimize the product title using OpenAI
        var rpai = await ai.Optimize<string>(new() {
            Text = "FakeBrand Boa XL Max Water Pump Pliers in a Festive Christmas Ornament",  // Original title
            Instruction = "SEO for an online store product title"  // SEO optimization instruction
        }).ConfigureAwait(false);

        // Output the optimized title
        Console.WriteLine("Optimized title: {0}", rpai);
    }

How It Works

  1. Set Up AI Service:

    • The AIService is initialized with CloudBrowser.AI and OpenAI API credentials.

    • AIService connects to OpenAI's API to handle optimization tasks.

  2. Optimize Product Title:

    • You provide the product title (Text) and the instruction (Instruction).

    • In this case, the instruction is "SEO for an online store product title," guiding OpenAI to enhance the product title for SEO purposes.

  3. Display the Optimized Title:

    • The optimized title is returned by OpenAI and printed to the console for review.


This example highlights the power of integrating AI optimization into your workflow, particularly for SEO purposes in an e-commerce environment, leveraging CloudBrowser.AI and OpenAI's capabilities.

AISummarize

The following example demonstrates how to use CloudBrowser.AI and OpenAI to extract and summarize the content from a webpage. It retrieves the HTML content from the webpage and uses OpenAI to summarize it.

    const string clToken = "YOUR CLOUDBROWSER.AI TOKEN";
    const string openAiToken = "YOUR OPEN AI TOKEN";

    static async Task Main(string[] args) {
        // Initialize AIService with your CloudBrowser.AI and OpenAI credentials
        using AIService ai = new(clToken, new() {
            OpenAIConfiguration = new() {
                ApiKey = openAiToken,
            }
        });

        // Get the HTML content of the webpage
        var html = await GetHTML("http://www.cloudbrowser.ai").ConfigureAwait(false);

        if (html == null) return;

        // Summarize the webpage content using OpenAI
        var rp = await ai.Summarize(new() {
            Html = html
            // Alternatively, you can manually define a response format
            // ResponseFormat = "{\"response\":\"string\", \"required\":[\"response\"]}"
        }).ConfigureAwait(false);
        
        // Optionally, you can define a custom type for the response if needed
        // var rpai = await ai.Summarize<CustomType>(new() {
        //     Html = html
        // }).ConfigureAwait(false);

        // Output the summarized response
        Console.WriteLine("{0}", rp.Response);
    }

    static async Task<string?> GetHTML(string address) {
        using BrowserService svc = new(clToken);

        // Request a browser instance
        var rp = await svc.Open().ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return null;
        }

        // Connect to the browser using Puppeteer
        var browser = await Puppeteer.ConnectAsync(new ConnectOptions {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);

        Console.WriteLine("Browser connected");

        // Open the webpage and retrieve its content
        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];
        await page.GoToAsync(address).ConfigureAwait(false);
        return await page.GetContentAsync().ConfigureAwait(false);
    }

How It Works

  1. Set Up AI Service:

    • The AIService is initialized with CloudBrowser.AI and OpenAI API credentials.

  2. Retrieve Webpage HTML:

    • The GetHTML() method uses PuppeteerSharp to navigate to a specified webpage ("http://www.cloudbrowser.ai") and extract its HTML content.

  3. Summarize HTML Content:

    • The ai.Summarize() method is used to send the extracted HTML content to OpenAI for summarization.

    • The response is returned, which contains the summary of the webpage.

  4. Output the Summary:

    • The summary is printed to the console.


Response Formats

  • By default, the response is a string that contains the summary of the page.

  • You can customize the response format by defining it in ResponseFormat, if necessary.

This example showcases how to extract information from a webpage and use OpenAI to generate a summary, making it useful for content analysis or summarization tasks.

AITo

This example demonstrates how to use CloudBrowser.AI and OpenAI to convert HTML content into different formats like JSON, Markdown, CSV, and custom data types.

    const string clToken = "YOUR CLOUDBROWSER.AI TOKEN";
    const string openAiToken = "YOUR OPEN AI TOKEN";

    // Define a custom class to represent the extracted content
    class CustomType {
        public string Title { get; set; }
        public string Description { get; set; }
        public string[] Paragraphs { get; set; }
    }

    static async Task Main(string[] args) {
        // Initialize AIService with CloudBrowser.AI and OpenAI API credentials
        using AIService ai = new(clToken, new() {
            OpenAIConfiguration = new() {
                ApiKey = openAiToken,
            }
        });

        // Retrieve the HTML content of the webpage
        var html = await GetHTML("http://www.cloudbrowser.ai").ConfigureAwait(false);

        if (html == null) return;

        // Convert the HTML to JSON
        var json = await ai.ToJSON(new() {
            Html = html
        }).ConfigureAwait(false);
        Console.WriteLine("JSON output: " + json);

        // Convert the HTML to Markdown
        var markDown = await ai.ToMarkdown(new() {
            Html = html
        }).ConfigureAwait(false);
        Console.WriteLine("Markdown output: " + markDown);

        // Convert the HTML to CSV
        var csv = await ai.ToCSV(new() {
            Html = html,
            Headers = "Name,Price,Duration"
        }).ConfigureAwait(false);
        Console.WriteLine("CSV output: " + csv);

        // Convert the HTML to a custom data type
        var custom = await ai.To<CustomType>(html).ConfigureAwait(false);
        Console.WriteLine($"Title: {custom.Title}, Description: {custom.Description}");
    }

    static async Task<string?> GetHTML(string address) {
        using BrowserService svc = new(clToken);

        // Request a browser instance
        var rp = await svc.Open().ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return null;
        }

        // Connect to the browser using Puppeteer
        var browser = await Puppeteer.ConnectAsync(new ConnectOptions {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);

        Console.WriteLine("Browser connected");

        // Open the webpage and retrieve its content
        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];
        await page.GoToAsync(address).ConfigureAwait(false);
        return await page.GetContentAsync().ConfigureAwait(false);
    }

How It Works

  1. Set Up AI Service:

    • The AIService is initialized using your CloudBrowser.AI token and OpenAI API key.

  2. Retrieve Webpage HTML:

    • The GetHTML() method uses PuppeteerSharp to load the webpage ("http://www.cloudbrowser.ai") and retrieves the page's HTML content.

  3. Convert HTML to JSON:

    • The ai.ToJSON() method is used to convert the webpage HTML into JSON format.

  4. Convert HTML to Markdown:

    • The ai.ToMarkdown() method is used to convert the webpage HTML into Markdown format.

  5. Convert HTML to CSV:

    • The ai.ToCSV() method is used to convert the webpage HTML into CSV format, where you can specify headers such as "Name", "Price", and "Duration".

  6. Convert HTML to Custom Type:

    • The ai.To<CustomType>() method allows you to define a custom data type to structure the extracted information from the HTML.

  7. Output the Results:

    • The JSON, Markdown, and CSV formats are printed to the console. The CustomType data is printed by showing the extracted title and description.

Customization:

  • You can adjust the CustomType class or other methods to extract and structure the data as per your specific needs.

  • For CSV output, you can modify the Headers property to match the structure of the data you are extracting.

Response Formats:

  • JSON: The raw HTML content is converted into a structured JSON format.

  • Markdown: The HTML content is converted into Markdown.

  • CSV: The content is structured into columns and rows in CSV format.

  • Custom Type: The content is mapped into a custom C# class (like CustomType) for structured processing.

AITranslate

This example demonstrates how to easily convert web page content into various formats that can be used for further processing or analysis.

The AITranslate example demonstrates how to use CloudBrowser.AI and OpenAI to retrieve and translate text from a webpage. It retrieves a specific text from the webpage and translates it into another language (in this case, Spanish).

Here's the complete code with explanations:

    const string clToken = "YOUR CLOUDBROWSER.AI TOKEN";  // CloudBrowser.AI API token
    const string openAiToken = "YOUR OPEN AI TOKEN";  // OpenAI API token

    static async Task Main(string[] args) {
        // Initialize AIService with CloudBrowser.AI and OpenAI API credentials
        using AIService ai = new(clToken, new() {
            OpenAIConfiguration = new() {
                ApiKey = openAiToken,
            }
        });

        // Retrieve the text from the webpage
        var text = await GetText("http://www.cloudbrowser.ai", "h1").ConfigureAwait(false);

        if (text == null) return;

        // Translate the retrieved text into Spanish
        var rp = await ai.Translate(new() {
            Text = text,  // Text to be translated
            IsoLang = "ES"  // Target language (Spanish in this case)
        }).ConfigureAwait(false);

        // Optionally, you can deserialize the response into a custom type (uncomment if needed)
        //var rpai = await ai.Translate<CustomType>(new() {
        //    Text = text,
        //    IsoLang = "ES"
        //}).ConfigureAwait(false);

        // Output the translated text
        Console.WriteLine("Translated Text: {0}", rp.Response);
    }

    // Method to retrieve the text from a specific HTML element on a page
    static async Task<string?> GetText(string address, string selector) {
        using BrowserService svc = new(clToken);

        // Open a browser session
        var rp = await svc.Open().ConfigureAwait(false);

        if (rp.Status == ResponseStatus.Succes) {
            Console.WriteLine("Browser requested");
        } else {
            Console.WriteLine("Error requesting browser: {0}", rp.Status.ToString());
            return null;
        }

        // Connect to the browser using PuppeteerSharp
        var browser = await Puppeteer.ConnectAsync(new ConnectOptions {
            BrowserWSEndpoint = rp.Address,
            DefaultViewport = null,
            AcceptInsecureCerts = true,
            SlowMo = 0
        }).ConfigureAwait(continueOnCapturedContext: false);

        Console.WriteLine("Browser connected");

        // Open the page in the browser
        var page = (await browser.PagesAsync().ConfigureAwait(false))[0];

        await page.GoToAsync(address).ConfigureAwait(false);

        // Get the inner text of the specified HTML element (e.g., <h1> tag)
        return await page.EvaluateExpressionAsync<string>($"document.querySelector('{selector}').innerText").ConfigureAwait(false);
    }

How It Works:

  1. CloudBrowser.AI Setup:

    • AIService is initialized with your CloudBrowser.AI token and OpenAI token.

    • These tokens are necessary for both controlling the browser session and using OpenAI's translation capabilities.

  2. Retrieve Text from Webpage:

    • The GetText() method retrieves the inner text of an HTML element from a webpage. In this example, it fetches text from the <h1> tag ("h1" selector).

    • PuppeteerSharp is used to open a browser instance, load the webpage, and extract the text from the specified HTML element.

  3. Translate Text:

    • Once the text is retrieved, the Translate() method from AIService is used to translate the text into a different language. The target language is specified using an ISO language code ("ES" for Spanish in this case).

  4. Output Translated Text:

    • The translation result (rp.Response) is printed to the console.

Customization:

  • Text Selection: The selector can be adjusted to target different HTML elements. For example, you can retrieve text from a paragraph ("p" selector) or a div ("div.someClass").

  • Target Language: Change the value of IsoLang to any ISO language code (e.g., "EN" for English, "FR" for French) to translate into different languages.

Steps to Run:

  1. Replace "YOUR CLOUDBROWSER.AI TOKEN" with your CloudBrowser.AI token.

  2. Replace "YOUR OPEN AI TOKEN" with your OpenAI API key.

  3. Run the program. It will fetch the text from the <h1> element on "http://www.cloudbrowser.ai", translate it into Spanish, and print the result.

This example shows how to combine the power of CloudBrowser.AI (to interact with web pages) and OpenAI (for translation) to automate the process of retrieving and translating text from a webpage.

Last updated