Что будет, если дать GPT-3 браузер с интернетом?

Ищем погоду в Москве

Как предприниматель я уже давно мечтаю об ИИ-помощнике, а как разработчик пользуюсь штуками вроде GitHub Copilot и, конечно, GPT-3. Эти вещи в моей голове соединились в понимание того, что нужная мне технология ближе, чем кажется. На самом деле, нам почти только и осталось, что дать нейросетям возможность не только дополнять текст, но и совершать действия. Пока Microsoft готовит нам интеграцию Chat GPT в Bing, я решил поставить небольшой эксперимент и предоставить нейросети от OpenAI доступ к полноценному браузеру с возможностью ввода текста, нажатия кнопок и перехода по ссылкам.

GPT-3, пользуясь браузером, выдает правильный курс на 3 февраля 2023, о котором никак не может знать из своих собственных данных, которые заканчиваются на 2021 году.

Начнем с того, что API, к которому можно подключиться для Chat GPT-3 официально "coming soon", поэтому мне пришлось довольствоваться GPT-3 Text Completion API, то есть никакой истории чата, каждый запрос является для нейросети отдельным.

Я сделал приложение на Node.js и благодаря Electron создаю окно браузера, с возможностью передачи данных из браузера в Node и обратно. При загрузке каждой страницы подгружается JS скрипт, который отвечает за логику взаимодействия и отображает поле ввода для "задачи", которая далее становится частью общего prompt (запроса к нейросети).

Интерфейс нейросети исключительно текстовый, то есть передать желаемую веб-страницу мы не можем. По-хорошему, здесь нужна отдельная система в духе "компьютерного зрения" или хотя бы какой-то умный парсер, и это, конечно, будет сделано в серьезной разработке в самом ближайшем будущем, но для эксперимента на один день это было бы слишком, поэтому я решил просто передавать структуру HTML элементов и самые "содержательные" их атрибуты вроде value, type, name и т.д.

Затем в нейросеть передается довольно сложный Prompt, описывающий логику нашего взаимодействия.

const initialPrompt = 'You are an AI assistant given access to a virtual browser.' + 'You will be given a task to complete by interacting with the browser.' + 'Each time page is loaded you will be provided with a current url, page title and its html structure.' + 'Each time you should check out the url, title and structure provided and respond with a list of interactions you wish to perform.' + 'The virtual browser gives you three kinds of interaction: typing, submitting, clicking.' + 'You have to specify the id of the element you want to interact with.' + 'Set "click" to true if you want to perform click action on element.' + 'Set "setValue" to your value if you want to change element value (i.e. input field).' + 'Set "submit" to true if you want to perform submit action on element.' + 'SetValue and Submit usually should have the same element id' + 'Only array of interactions in JSON format is accepted.' + `Your current task is to ${task}. Find the required information and perform needed actions using the virtual browser. Browser has been loaded with ${url} page.`

Выше показана его стартовая часть, а далее еще более длинно описывается конкретная логика предоставляемых данных и требуемый формат ответов.

Нейросеть должна прислать ответ в JSON формате, содержащий список взаимодействий, которые она хочет совершить на странице (с указанием Id элемента), либо, если считает, что задача выполнена, отправить объект completed и информацию о результате, после чего будет выведено то самое окошко Task Completed, которое вы видите на картинках.

Находим что сегодня в кино, перейдя по ссылке из поисковой выдачи

Общий prompt многократно корректировался, но в целом уже на этом этапе все более-менее работало. Реальной проблемой оказался лимит на длину запроса к API, который составляет 4096 токенов (примерно 10000 символов) из-за которого даже в финальной версии приложения нейросеть "видит" в основном только верхнюю часть страницы сложных сайтов, что сильно снижает качество результата.

Путем множества оптимизаций, включающих сокращения всего и вся, удаления структуры, лишних тегов, пробелов и тому подобного, страницы при передаче GPT-3 стали выглядеть примерно так (фрагмент):

[{"id":"5489","tg":"SPAN","tx":"Skip to main content"},{"id":"8223","tg":"SPAN","tx":"Enable accessibility for visually impaired"},{"id":"6326","tg":"SPAN","tx":"Open the accessibility menu"},{"id":"1293","tg":"IFRAME","name":"userway"},{"id":"3291","tg":"D","tx":"Like our new website? New look, same sports bar⛳️"},{"id":"4099","tg":"SPAN","tx":"Home"},{"id":"3970","tg":"A","hf":"https://www.noonan.."},{"id":"1098","tg":"SPAN","tx":"Contact"},{"id":"3492","tg":"A","hf":"https://www.noonan.."},{"id":"1916","tg":"SPAN","tx":"About"},{"id":"1987","tg":"A","hf":"https://www.noonan.."},{"id":"3625","tg":"SPAN","tx":"Menu"},{"id":"5674","tg":"A","hf":"https://www.noonan.."},{"id":"1113","tg":"D","tx":"ORDER ONLINE"},{"id":"4640","tg":"SPAN","tx":"Order on DoorDash"},{"id":"4331","tg":"A","hf":"https://order.onli.."},{"id":"2407","tg":"SPAN","tx":"Order on Grubhub"},{"id":"1423","tg":"A","hf":"https://noonansspo.."},{"id":"7680","tg":"SPAN","tx":"Order on UberEats"}

А в запросе, помимо прочего, нейросети теперь объясняются значения сокращений:

`List of property abbreviations used: ch means children, al means aria-label, tx means text, tg means tag` + `List of element tag name abbreviations used: D means DIV, BTN means BUTTON, L means LABEL, SEL means SELECT, O means OPTION, TXAR means TEXTAREA, INP means INPUT.`

После получения результата от API OpenAI, он передается в тот самый предзагруженный скрипт на странице и тот симулирует действия (нажатия, ввод, отправку) и выделяет красной рамкой элементы, с которыми происходит взаимодействие. Именно взаимодействие оказалось второй существенной проблемой, потому что многие сайты используют неочевидную вложенность элементов или реализуют интерактивность через JavaScript, так что даже когда нейросеть правильно попадает по элементу, взаимодействие не происходит. Но это, конечно, не будет препятствием в настоящей разработке.

Заполняем форму и успешно отправляем мне e-mail

Описываем о чем страница

Получив более-менее адекватный результат, я решил считать этот маленький эксперимент завершенным. Надо отметить, что на изображениях я показал избранные удачные дубли. Часто нейросеть не может попасть в правильный элемент, что через какое-то время автоматически вызывает перезагрузку страницы и я жду результата несколько итераций. Иногда случается досрочное завершение задачи, а стабильность "системы" снижается с удалением от стартовой страницы (ею был bing.com) из-за ошибочных переходов по неверным ссылкам. Но надо отдать должное GPT-3 в том, что она самостоятельно поддерживает порядок в списке взаимодействий таким образом, чтобы заполнения полей были в начале, а отправка форм в конце, и почти всегда отдает ответ в корректном JSON виде.

Подводя итог, на мой взгляд, распространение нейросетей, способных самостоятельно действовать — сёрфить интернет, пользоваться электронной почтой, соц. сетями, мессенджерами и совершать звонки, является перспективой самого ближайшего будущего.

P.S. Как я уже сказал, я разработчик и предприниматель. Мой основной бизнес это RocketBrush Studio — студия аутсорсинга и разработки игр. Мы активно растем и если вдруг вы лично ищете работу или ваша организация предлагает услуги для бизнеса, то у нас есть задачи в области управления, маркетинга, развития бизнеса и продаж (B2B, США \ Европа), SEO и SMM, Веб-дизайна, QA (Unity), Unity C# и Node.JS разработки. А также я ищу хорошего помощника :)

Вы можете связаться со мной через alex@rocketbrush.com. Я открыт для любых предложений в области бизнеса и IT \ gamedev.