Τον Απρίλιο του 2025, η Microsoft εγκατέλειψε ήσυχα , ένας νέος διακομιστής που συνδέει τον πράκτορά σας AI (μέσω του MCP) απευθείας στο API του προγράμματος περιήγησης Playwright. Playwright MCP Τι σημαίνει αυτό στην αγγλική γλώσσα; (Και για δωρεάν!) » «» «—Όλα χωρίς να γράψετε μια μόνο γραμμή κώδικα αυτοματισμού του προγράμματος περιήγησης. Your AI agent can now interact with real web pages using nothing but simple text instructions Κάντε κλικ εδώ Κάντε μια οθόνη Ναι, αυτό είναι τόσο μεγάλο που Και μόλις μόλις ξεκίνησε. 🔥 Playwright MCP has already become one of the most-starred MCP servers on GitHub Σε αυτόν τον οδηγό βήμα προς βήμα, θα δείτε ακριβώς τι μπορεί να κάνει αυτός ο διακομιστής και πώς να το συνδέσετε σε μια ροή εργασίας AI που βασίζεται σε Python χρησιμοποιώντας το OpenAI Agents SDK. Γιατί όλοι μιλούν για το Playwright MCP Server είναι ένας διακομιστής MCP (Model Context Protocol) που δίνει στους πράκτορες AI σοβαρές υπερδυνάμεις αυτοματοποίησης του προγράμματος περιήγησης μέσω του API Playwright. Παιχνίδι MCP Παιχνίδι MCP Πίσω από τις σκηνές, αντί να βασίζεται σε στιγμιότυπα οθόνης ή μοντέλα προσαρμοσμένα στο όραμα, επιτρέπει στα LLM να αλληλεπιδρούν με ιστοσελίδες χρησιμοποιώντας Αυτό σημαίνει ταχύτερες, καθαρότερες και πολύ πιο φιλικές προς το LLM αλληλεπιδράσεις. structured accessibility snapshots Στον κόσμο του Εκεί που πρέπει να , και σαν άνθρωπος - αυτό είναι ένα ολοκληρωμένο παιχνίδι-αλλαγή! Agentic AI και Agentic RAG ροές εργασίας Διαβάστε ΚΛΙΚ Ναυτιλία Και πάρτε αυτό: παρόλο που η Microsoft δεν το εκτέλεσε με πολύ φανατισμό (χωρίς flashy keynote, χωρίς blog post blitz), αυτή η βιβλιοθήκη χαμηλού κλειδιού είναι ήδη καθισμένη στο ...και την αναρρίχηση. 12K+ ⭐ on GitHub Επειδή απλά λειτουργεί, και παρακάτω είναι αυτό που το κάνει ιδιαίτερο: Blazing γρήγορο και ελαφρύ: Χρησιμοποιεί το δέντρο προσβασιμότητας του προγράμματος περιήγησης, όχι αργή, κουραστική pixel-based είσοδο. LLM-πρώτος σχεδιασμός: Δεν χρειάζεται μοντέλο όρασης. είναι χτισμένο για δομημένες διασυνδέσεις κειμένου. ️ Οριστική χρήση εργαλείων: Καμία μαρτυρία, καμία ασάφεια – μόνο σαφείς, αξιόπιστες ενέργειες μέσω διαφόρων εργαλείων. Επιπλέον, έρχεται με μια σταθερή CLI και χρήσιμες σημαίες προσαρμογής για λεπτομερή έλεγχο του προγράμματος περιήγησης. Αυτή η τεχνολογία σας επιτρέπει να δημιουργήσετε σοβαρούς παράγοντες που όχι μόνο ψευδαισθάνονται, αλλά στην πραγματικότητα Στο διαδίκτυο Κάντε πράγματα Πώς να χρησιμοποιήσετε το Playwright MCP Server: Βήμα προς βήμα σεμινάριο Είστε έτοιμοι να εφαρμόσετε τον διακομιστή MCP του Playwright; Ακολουθήστε τα παρακάτω βήματα για να το συνδέσετε με το σενάριο Python σας χρησιμοποιώντας το OpenAI Agents SDK! Προϋποθέσεις Για να ακολουθήσετε μαζί με αυτό το σεμινάριο, βεβαιωθείτε ότι έχετε την εγκατάσταση του developer έτοιμη να μετακινηθεί: Python 3.10+ εγκατεστημένο τοπικά Το Node.js είναι εγκατεστημένο και λειτουργεί (η τελευταία έκδοση LTS είναι ο φίλος σας) ️ Ένα κλειδί API από έναν υποστηριζόμενο πάροχο LLM (το OpenAI Agents SDK το χρειάζεται και συνιστούμε το Gemini επειδή είναι δωρεάν στη χρήση) Βήμα #1: Εγκατάσταση και διαμόρφωση του έργου Αυτή η ολοκλήρωση Playwright + MCP βασίζεται σε αυτό που κάλυψαμε Έτσι, αν δεν το έχετε ελέγξει ακόμα, πηγαίνετε να το σκουπίσετε πραγματικά γρήγορα. . MCP + OpenAI Agents SDK: How to Build a Powerful AI Agent MCP + OpenAI Agents SDK: Πώς να δημιουργήσετε έναν ισχυρό πράκτορα AI MCP + OpenAI Agents SDK: Πώς να δημιουργήσετε έναν ισχυρό πράκτορα AI Αλλά αν είστε σε μια βιασύνη (το παίρνουμε), : here’s the TL;DR version to get you rolling Δημιουργήστε ένα φάκελο έργου. Μέσα σε αυτό, προσθέστε ένα αρχείο που ονομάζεται agent.py και δημιουργήστε ένα εικονικό περιβάλλον Python. Εγκαταστήστε τις απαραίτητες βιβλιοθήκες με το pip install openai-agents python-dotenv. Προσθέστε ένα αρχείο .env στον φάκελο του έργου σας και, μέσα σε αυτό, ρίξτε το κλειδί API Gemini σας ως εξής: GEMINI_API_KEY=<your-gemini-api-key> Τώρα είστε κλειδωμένοι, φορτωμένοι και έτοιμοι να ξεκινήσετε την κατασκευή! 💥 Βήμα #2: Ολοκλήρωση του Playwright MCP Server Πάρτε τον διακομιστή MCP του Playwright και τρέξτε μέσα στο OpenAI Agents SDK με τον ακόλουθο κώδικα: async with MCPServerStdio( name="Playwright MCP server", params={ "command": "npx", "args": ["-y", "@playwright/mcp@latest", "--output-dir", "./"], }, ) as server: # Create and initialize the AI agent with the running MCP server agent = await create_mcp_ai_agent(server) # Agent request-response cycle... ```python This chunk of code basically runs the following shell command under the hood: ```bash npx -y @playwright/mcp@latest --output-dir "./" Σε απλή αγγλική γλώσσα; Ενεργοποιεί τον διακομιστή Playwright MCP χρησιμοποιώντας το Node.js. bit λέει πού να πετάξετε τα αρχεία εξαγωγής, όπως εικόνες οθόνης και PDF. --output-dir "./" ️ : Εάν ο πράκτορας σας δεν χρειάζεται να εξαγάγει κανένα αρχείο, μπορείτε να παραλείψετε το Η σημαία είναι προαιρετική! Note --output-dir Βήμα #3: Πλήρης κώδικας Εδώ είναι το δικό σας Αυτό είναι το πλήρες Open AI Agents SDK-built, Gemini-powered, Playwright-ενοποιημένο πράκτορα AI έτοιμο να αναλάβει δράση μέσω του MCP: agent.py import asyncio from dotenv import load_dotenv import os from agents import ( Runner, Agent, OpenAIChatCompletionsModel, set_default_openai_client, set_tracing_disabled ) from openai import AsyncOpenAI from agents.mcp import MCPServerStdio # Load environment variables from the .env file load_dotenv() # Read the required secrets envs from environment variables GEMINI_API_KEY = os.getenv("GEMINI_API_KEY") async def create_mcp_ai_agent(mcp_server): # Initialize Gemini client using its OpenAI-compatible interface gemini_client = AsyncOpenAI( api_key=GEMINI_API_KEY, base_url="https://generativelanguage.googleapis.com/v1beta/openai/" ) # Set the default OpenAI client to Gemini set_default_openai_client(gemini_client) # Disable tracing to avoid tracing errors being logged in the terminal set_tracing_disabled(True) # Create an agent configured to use the MCP server and Gemini model agent = Agent( name="Assistant", instructions="You are a helpful assistant", model=OpenAIChatCompletionsModel( model="gemini-2.0-flash", openai_client=gemini_client, ), mcp_servers=[mcp_server] ) return agent async def run(): # Start the Playwright MCP server via npx async with MCPServerStdio( name="Playwright MCP server", params={ "command": "npx", "args": ["-y", "@playwright/mcp@latest", "--output-dir", "./"], }, ) as server: # Create and initialize the AI agent with the running MCP server agent = await create_mcp_ai_agent(server) # Main REPL loop to process user requests while True: # Read the user's request request = input("Your request -> ") # Exit condition if request.lower() == "exit": print("Exiting the agent...") break # Run the request through the agent output = await Runner.run(agent, input=request) # Print the result to the user print(f"Output -> \n{output.final_output}\n\n") if __name__ == "__main__": asyncio.run(run()) Boom. Ακριβώς όπως αυτό, έχετε χτίσει έναν πλήρως λειτουργικό πράκτορα AI σε ~75 γραμμές Python. . 🧠 🛠️ think through Gemini and act through Playwright Βήμα #4: Δοκιμάστε το Playwright-Powered AI Agent σας Ήρθε η ώρα να δοκιμάσετε τον πράκτορά σας τρέχοντας: python agent.py Εδώ είναι τι θα δείτε στο Startup: Τώρα το χτύπησε με μια βιασύνη σαν αυτή: Visit hackernoon.com, click on "Trending Stories", wait for the page to fully load, and then export it as a PDF file named "hackernoon-trending-stories.pdf" Το αποτέλεσμα αυτό; Ιούλιος , it nailed it! Αλλά αυτό ήταν γρήγορο, οπότε ας σπάσουμε αυτό που συνέβη: Ο πράκτορας ξεκινά μια εκδοχή του Chrome που τροφοδοτείται από το Playwright. Επισκεφθείτε το hackernoon.com Κάντε κλικ στο σύνδεσμο «Τρέχουσες ιστορίες». ️ Περιμένετε να φορτωθεί πλήρως η σελίδα. Εξάγει τη σελίδα σε ένα αρχείο PDF που ονομάζεται hackernoon-trending-stories.pdf, το οποίο εμφανίστηκε στον φάκελο του έργου. Σημειώστε ότι το browser Αυτό είναι τέλειο αν θέλετε να στείλετε μια άλλη προειδοποίηση και να κρατήσετε ζωντανή την τρέχουσα συνεδρία! Μείνετε ανοιχτοί Δεν σας αρέσει αυτό και θέλετε να τερματίσετε τη συνεδρία και να κλείσετε το πρόγραμμα περιήγησης; Απλά πληκτρολογήστε κάτι σαν: Now, close the browser. Ο πράκτορας θα κλείσει το πρόγραμμα περιήγησης για εσάς. Τώρα, πηγαίνετε να ελέγξετε το δημιουργημένο αρχείο PDF Κάντε κύλιση μέσα από το φάκελό σας και θα δείτε: hackernoon-trending-stories.pdf Πολύ ωραίο! α , συνδέσμους και όλα, σε λεπτή μορφή PDF. Αυτό είναι πραγματική αυτοματοποίηση του προγράμματος περιήγησης, που τροφοδοτείται από τον δικό σας πράκτορα AI. clean, full-page export of Hackernoon’s trending page Και αυτό, κύριοι, είναι Αυτό το πράγμα είναι σοβαρά ισχυρό.Αφήστε το να μαγειρέψει. how you build an AI agent with Playwright + MCP Οι κρυμμένοι περιορισμοί του playwright MCP (και πώς να τους ξεπεράσετε) Καλά! μπορεί να σκέφτεσαι: «Εντάξει, έχω τα εργαλεία... ένα LLM που μπορεί να σκέφτεται, ένας διακομιστής MCP που μπορεί να σκουπίζει, και ο Playwright για να ελέγχει το πρόγραμμα περιήγησης. «Εντάξει, έχω τα εργαλεία... ένα LLM που μπορεί να σκέφτεται, ένας διακομιστής MCP που μπορεί να σκουπίζει, και ο Playwright για να ελέγχει το πρόγραμμα περιήγησης. Όχι και τόσο γρήγορα... Βεβαίως, υπάρχουν μόνο : two core things AI agents need to thrive Πρόσβαση σε δεδομένα ιστού σε πραγματικό χρόνο (✅ χειρίζεται από ενσωματώσεις MCP με δυνατότητα απόξεσης) Η δυνατότητα αλληλεπίδρασης με ένα πρόγραμμα περιήγησης (✅ εισάγετε Playwright MCP) Εδώ είναι που τα πράγματα γίνονται ενδιαφέροντα... Δοκιμάστε να ρωτήσετε τον πράκτορα AI που τροφοδοτείται από το Playwright κάτι σαν: Visit g2.com, wait for the page to load, and take a screenshot Τι συμβαίνει όμως; Αυτό! Πλοηγείται στο G2. ✅ Περιμένει. ✅ Παίρνει μια φωτογραφία οθόνης. ✅ Αλλά υπάρχει μια σύλληψη: the page is blocked behind a verification wall. Και ο πράκτορας είναι ακόμη αρκετά ευγενικός για να σας πει: Your request -> Visit g2.com, wait for the page to load, and take a screenshot Output -> Okay, I navigated to g2.com, waited for 5 seconds, took a snapshot of the page, and then took a screenshot. However, the page is showing a verification requirement. I am unable to complete the request. Όχι, δεν είναι το "game over" για εμάς ως ανθρώπινα όντα. αλλά ίσως ... είναι Για την Παιχνίδι πάνω default Playwright browser setup Ιδού το θέμα: ♂️ Τότε τι πήγε στραβά; Vanilla Chrome! Το πρόγραμμα περιήγησης Playwright ελέγχει έξω από το κουτί δεν έχει σχεδιαστεί για να αποφύγει τα μπλοκ. Διαρρέει σήματα παντού, όπως σημαίες αυτοματισμού, παράξενες διαμορφώσεις και ούτω καθεξής.... To the point that most websites—jsut like G2 —instantly know it’s a bot So what’s the solution? 👉 A Δημιουργήθηκε για να υποστηρίξει τις ροές εργασίας των οργανισμών • Μιλάμε για: Playwright-compatible infrastructure remote browsers that get blocked ΔΕΝ ΔΕΝ Ατελείωτο ️ Λειτουργεί χωρίς κεφάλι ή κεφάλι 👁️ περισσότερα >> Τροφοδοτείται από ένα δίκτυο διαμεσολαβητών με 100M+ κατοικίες IP Σχεδιασμένο για να ταιριάζει με έναν πραγματικό χρήστη ️ ♂️ Αναρωτιέστε τι είναι αυτό το μαγικό εργαλείο; Πείτε αντίο — το κρυφό, κλιμακούμενο, φιλικό προς την τεχνητή νοημοσύνη πρόγραμμα περιήγησης: Το Agent Browser των Bright Data Το Agent Browser των Bright Data https://www.youtube.com/watch?v=T59GCkpk5zY&embedable=true Εάν αναρωτιέστε πώς να το συνδέσετε στην εγκατάσταση του Playwright MCP, είναι τόσο απλό όσο το πέρασμα ενός τερματικού σημείου CDP: async with MCPServerStdio( name="Playwright MCP server", params={ "command": "npx", "args": [ "-y", "@playwright/mcp@latest", # other arguments... "--cdp-endpoint", "<YOUR_BRIGHT_DATA_AGENT_BROWSER_CDP_URL>" ], }, ) as server: # Your agent logic here... και Όχι πια μπλοκ! Όχι πια τοίχοι bot. Όχι πια θλιβερά μνήματα Gru. just like that, Έτοιμοι να δημιουργήσουν οργανικές ροές εργασίας που Εργαστείτε στο live web; Στην πραγματικότητα Bright Data’s Agent Browser has your back! Δείτε το σε δράση σε άλλη ολοκλήρωση εδώ: https://www.youtube.com/watch?v=JG_INdktGsk&embedable=true Τελικές Σκέψεις Τώρα ξέρετε πώς να υπερφορτώσετε οποιονδήποτε πράκτορα AI που έχει κατασκευαστεί με το OpenAI Agents SDK - είτε τρέχει σε GPT, Gemini ή οτιδήποτε έρχεται στη συνέχεια - συνδέοντάς το στον διακομιστή MCP του Playwright για πραγματικό έλεγχο του προγράμματος περιήγησης. Δείξαμε επίσης πώς να προχωρήσουμε ακόμη περισσότερο ξεπερνώντας τα μπλοκ του προγράμματος περιήγησης χρησιμοποιώντας το Bright Data. Μόνο ένα κομμάτι της ισχυρής υποδομής AI . Agent Browser Έχουμε κατασκευαστεί για να υποστηρίζουμε ροές εργασίας πραγματικού κόσμου AI σε κλίμακα Στο Bright Data, η αποστολή μας είναι απλή: να κάνουμε την τεχνητή νοημοσύνη προσβάσιμη σε όλους, παντού.Έτσι, μέχρι την επόμενη φορά – μείνετε περίεργοι, μείνετε τολμηροί και συνεχίστε να χτίζετε το μέλλον της τεχνητής νοημοσύνης.