mirror of
https://github.com/memohai/Memoh.git
synced 2026-04-25 07:00:48 +09:00
2 lines
7.1 KiB
JavaScript
2 lines
7.1 KiB
JavaScript
import{_ as e,o,c as r,ag as a}from"./chunks/framework.CAXxHpAX.js";const p=JSON.parse('{"title":"Browser Contexts","description":"","frontmatter":{},"headers":[],"relativePath":"getting-started/browser.md","filePath":"getting-started/browser.md","lastUpdated":1774787421000}'),s={name:"getting-started/browser.md"};function i(n,t,l,d,c,h){return o(),r("div",null,[...t[0]||(t[0]=[a('<h1 id="browser-contexts" tabindex="-1">Browser Contexts <a class="header-anchor" href="#browser-contexts" aria-label="Permalink to "Browser Contexts""></a></h1><p>Memoh can give a bot access to a headless browser through the <strong>Browser Gateway</strong>. A <strong>Browser Context</strong> stores the browser environment a bot should use, such as viewport size, locale, timezone, and mobile behavior.</p><p>Once a browser context is assigned to a bot, the bot can use browser tools to open pages, click elements, fill forms, capture screenshots, and inspect page content.</p><hr><h2 id="concept-browser-gateway" tabindex="-1">Concept: Browser Gateway <a class="header-anchor" href="#concept-browser-gateway" aria-label="Permalink to "Concept: Browser Gateway""></a></h2><p>The Browser Gateway is powered by <strong>Playwright</strong> and provides browser automation for bots. In practice, a browser context acts like a reusable browser profile configuration for one or more bots.</p><p>Typical use cases include:</p><ul><li>Navigating websites</li><li>Clicking buttons and links</li><li>Filling and submitting forms</li><li>Reading rendered page content</li><li>Capturing screenshots or PDFs</li></ul><hr><h2 id="creating-a-browser-context" tabindex="-1">Creating a Browser Context <a class="header-anchor" href="#creating-a-browser-context" aria-label="Permalink to "Creating a Browser Context""></a></h2><p>Manage contexts from the <strong>Browser Contexts</strong> page in the sidebar.</p><ol><li>Navigate to the <strong>Browser Contexts</strong> page.</li><li>Click <strong>Add Browser Context</strong>.</li><li>Fill in the following field: <ul><li><strong>Name</strong>: A display name for this browser context.</li></ul></li><li>Click <strong>Create</strong>.</li></ol><hr><h2 id="configuring-a-browser-context" tabindex="-1">Configuring a Browser Context <a class="header-anchor" href="#configuring-a-browser-context" aria-label="Permalink to "Configuring a Browser Context""></a></h2><p>After creating a context, select it from the sidebar and update its settings.</p><table tabindex="0"><thead><tr><th>Field</th><th>Description</th></tr></thead><tbody><tr><td><strong>Name</strong></td><td>The display name shown in the UI.</td></tr><tr><td><strong>Core</strong></td><td>Browser engine: <code>chromium</code> (default) or <code>firefox</code>.</td></tr><tr><td><strong>Viewport Width</strong></td><td>Browser viewport width in pixels.</td></tr><tr><td><strong>Viewport Height</strong></td><td>Browser viewport height in pixels.</td></tr><tr><td><strong>User Agent</strong></td><td>Optional custom browser user agent string.</td></tr><tr><td><strong>Device Scale Factor</strong></td><td>Optional device pixel ratio.</td></tr><tr><td><strong>Locale</strong></td><td>Optional locale such as <code>en-US</code> or <code>zh-CN</code>.</td></tr><tr><td><strong>Timezone ID</strong></td><td>Optional timezone such as <code>UTC</code> or <code>Asia/Shanghai</code>.</td></tr><tr><td><strong>Is Mobile</strong></td><td>Enables mobile-style browser behavior.</td></tr><tr><td><strong>Ignore HTTPS Errors</strong></td><td>Allows navigation to sites with invalid HTTPS certificates.</td></tr></tbody></table><h3 id="managing-contexts" tabindex="-1">Managing Contexts <a class="header-anchor" href="#managing-contexts" aria-label="Permalink to "Managing Contexts""></a></h3><ul><li><strong>Edit</strong>: Select a context and update its configuration.</li><li><strong>Delete</strong>: Remove a context you no longer use.</li></ul><hr><h2 id="assigning-a-browser-context-to-a-bot" tabindex="-1">Assigning a Browser Context to a Bot <a class="header-anchor" href="#assigning-a-browser-context-to-a-bot" aria-label="Permalink to "Assigning a Browser Context to a Bot""></a></h2><ol><li>Navigate to the <strong>Bots</strong> page and open your bot.</li><li>Go to the <strong>General</strong> tab.</li><li>Find the <strong>Browser Context</strong> dropdown.</li><li>Select the context you created.</li><li>Click <strong>Save</strong>.</li></ol><p>After saving, the bot can use that browser context when browser tools are invoked.</p><hr><h2 id="bot-interaction" tabindex="-1">Bot Interaction <a class="header-anchor" href="#bot-interaction" aria-label="Permalink to "Bot Interaction""></a></h2><p>When a browser context is configured, the bot can use built-in browser tools such as:</p><ul><li><code>browser_action</code>: perform actions like navigation, click, fill, select, scroll, tab management, screenshot, or PDF export</li><li><code>browser_observe</code>: inspect the current page and gather information for the model</li></ul><p>This lets the bot interact with real websites instead of relying only on static HTML or search results.</p><hr><h2 id="browser-core-selection" tabindex="-1">Browser Core Selection <a class="header-anchor" href="#browser-core-selection" aria-label="Permalink to "Browser Core Selection""></a></h2><p>Memoh's browser image can include Chromium, Firefox, or both. The available cores are determined at build time by the <code>BROWSER_CORES</code> build argument.</p><p>The install script prompts for browser core selection during setup. To rebuild manually with specific cores:</p><div class="language-bash vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">bash</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">BROWSER_CORES</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;">chromium</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> docker</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> compose</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> --profile</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> browser</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> build</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> browser</span></span></code></pre></div><p>Valid values for <code>BROWSER_CORES</code>: <code>chromium</code>, <code>firefox</code>, <code>chromium,firefox</code> (default).</p><hr><h2 id="next-steps" tabindex="-1">Next Steps <a class="header-anchor" href="#next-steps" aria-label="Permalink to "Next Steps""></a></h2><ul><li>If you have not configured memory yet, continue with <a href="/memory-providers/builtin.html">Built-in Memory Provider</a>.</li><li>To manage a bot's long-term knowledge after setup, see <a href="/getting-started/memory.html">Bot Memory Management</a>.</li></ul>',36)])])}const b=e(s,[["render",i]]);export{p as __pageData,b as default};
|