# 搭配 Playwright 使用 AgentCore 瀏覽器
<a name="browser-quickstart-playwright"></a>

您可以搭配瀏覽器工具使用 Playwright 自動化架構：

 **步驟 1：安裝相依性** 

建立專案資料夾 （如果您之前沒有建立） 並安裝必要的套件：

```
mkdir agentcore-browser-quickstart
cd agentcore-browser-quickstart
python3 -m venv .venv
source .venv/bin/activate
```

**注意**  
在 Windows 上，使用： `.venv\Scripts\activate`

安裝必要的套件：

```
pip install bedrock-agentcore playwright boto3 nest-asyncio
```

這些套件提供：
+  `bedrock-agentcore` ：適用於 Amazon Bedrock AgentCore 工具的 SDK，包括 AgentCore 瀏覽器
+  `playwright` ：適用於瀏覽器自動化的 Python 程式庫
+  `boto3` ： AWS SDK for Python (Boto3) 以建立、設定和管理 AWS 服務
+  `nest-asyncio` ：允許在現有事件迴圈中執行非同步事件迴圈

 **步驟 2：使用 Playwright 控制瀏覽器** 

您可以直接使用瀏覽器，無需代理程式架構或 LLM。當您想要以程式設計方式控制瀏覽器自動化時，這會很有用。Amazon Bedrock AgentCore 提供與 Playwright 的整合，以進行瀏覽器自動化。

 **非同步 Playwright 範例** 

建立名為 的檔案`direct_browser_playwright.py`，並新增下列程式碼：

```
from playwright.async_api import async_playwright, Playwright, BrowserType
from bedrock_agentcore.tools.browser_client import browser_session
import asyncio

async def run(playwright: Playwright):
    # Create and maintain a browser session
    with browser_session('us-west-2') as client:
        # Get WebSocket URL and authentication headers
        ws_url, headers = client.generate_ws_headers()

        # Connect to the remote browser
        chromium: BrowserType = playwright.chromium
        browser = await chromium.connect_over_cdp(
            ws_url,
            headers=headers
        )

        # Get the browser context and page
        context = browser.contexts[0]
        page = context.pages[0]

        try:
            # Navigate to a website
            await page.goto("https://docs.aws.amazon.com/bedrock-agentcore/latest/devguide/what-is-bedrock-agentcore.html")

            # Print the page title
            title = await page.title()
            print(f"Page title: {title}")

            # Keep the session alive for 2 minutes to allow viewing
            print("\n\nBrowser session is active. Check the AWS Console for live view.")
            await asyncio.sleep(120)

        finally:
            # Clean up resources
            await page.close()
            await browser.close()

async def main():
    async with async_playwright() as playwright:
        await run(playwright)

# Run the async function
if __name__ == "__main__":
    asyncio.run(main())
```

 **同步 Playwright 範例與即時檢視** 

或者，您可以使用同步 API 搭配整合式即時檢視伺服器：

```
from playwright.sync_api import sync_playwright, Playwright, BrowserType
from bedrock_agentcore.tools.browser_client import browser_session
from browser_viewer import BrowserViewerServer
import time

def run(playwright: Playwright):
    # Create the browser session and keep it alive
    with browser_session('us-west-2') as client:
        ws_url, headers = client.generate_ws_headers()

        # Start viewer server
        viewer = BrowserViewerServer(client, port=8005)
        viewer_url = viewer.start(open_browser=True)

        # Connect using headers
        chromium: BrowserType = playwright.chromium
        browser = chromium.connect_over_cdp(
            ws_url,
            headers=headers
        )

        context = browser.contexts[0]
        page = context.pages[0]

        try:
            page.goto("https://amazon.com/")
            print(page.title())
            time.sleep(120)
        finally:
            page.close()
            browser.close()

with sync_playwright() as playwright:
    run(playwright)
```

 **執行指令碼** 

執行任一指令碼：

```
python direct_browser_playwright.py
```

 **預期的輸出** 

您應該會看到列印的頁面標題 `Page title: What is Amazon Bedrock AgentCore? - Amazon Bedrock AgentCore` （例如，)。指令碼會在關閉之前讓瀏覽器工作階段保持作用中 2 分鐘。

兩個範例：
+ 使用 Amazon Bedrock AgentCore 瀏覽器建立受管瀏覽器工作階段
+ 使用 Playwright 的 Chrome DevTools 通訊協定 (CDP) 連線至遠端 Chrome 瀏覽器
+ 導覽至 AgentCore 文件並列印頁面標題
+ 保持工作階段運作 2 分鐘，讓您可以在 AWS 主控台中檢視
+ 正確關閉瀏覽器並清除資源