技术 -

从浏览器地址栏发起一个 Poe ChatGPT 聊天

本文介绍一种从浏览器地址栏快速发起一个 Poe (ChatGPT) 聊天的方法。这种方法基于浏览器的地址栏搜索特性（输入搜索引擎简称 + 搜索内容后，自动拼接搜索 URL 并跳转），以及浏览器 UserScript 扩展程序注入 JS 脚本（模拟输入和点击操作）的功能来实现。

同理，这种方式也可以应用到其他不支持直接通过 URL 传入参数的网站。

文章目录

效果图

前提条件

  1. 浏览器支持在地址栏使用自定义搜索引擎进行搜索（例如 Chrome、Edge 等浏览器）
  2. 浏览器安装了支持 UserScript 的扩展程序（例如 Tampermonkey 等扩展程序）

设置步骤

示例环境

以下步骤以安装了 Tampermonkey 的 Chrome 浏览器为例。

  • Chrome 浏览器的地址栏搜索特性：在地址栏输入搜索引擎的快捷字词后，按 Tab 或空格键，可以指定使用指定的搜索引擎 URL 搜索后续输入的内容
  • Tampermonkey（篡改猴）：提供 UserScript 能力，可以向特定网站注入自定义 JS 脚本

示例步骤

  1. 在 Tampermonkey（或者其他 UserScript 扩展程序）中，创建一个用户脚本，这个脚本使得浏览器访问 https://poe.com/?s={对话内容} 时，会自动将对话内容填入输入框，然后点击发送按钮。

    这个脚本的代码如下：

    // ==UserScript==
// @name         Poe.com quick chat
// @namespace    https://imkero.net/
// @version      1.0.0
// @description  start a Poe.com chat with URL
// @author       imkero
// @match        https://poe.com/?s=*
// @icon         https://icons.duckduckgo.com/ip3/poe.com.ico
// ==/UserScript==

(function() {
    'use strict';
    const searchParams = new URLSearchParams(window.location.search);

    // 1. 检查 仅当 query 带 s 参数时执行
    if (!searchParams.has('s')) {
        return;
    }

    const searchValue = searchParams.get('s');

    // 2. 找到输入框
    const messageInput = document.querySelector('div[class^="ChatMessageInputContainer"] textarea');
    if (!messageInput) {
        console.error('chat textarea not found');
        return;
    }

    // see https://stackoverflow.com/a/46012210
    const updateTextareaValue = (textarea, value) => {
        const nativeValueSetter = Object.getOwnPropertyDescriptor(HTMLTextAreaElement.prototype, 'value').set;
        nativeValueSetter.call(textarea, value);
        textarea.dispatchEvent(new Event('input', { bubbles: true }));
    };

    // 页面可交互后执行
    const handle = () => {
        // 4. 输入对话内容
        updateTextareaValue(messageInput, searchValue);

        setTimeout(function() {
            // 5. 点击发送按钮
            const sendButton = Array.from(document.querySelectorAll('div[class^="ChatMessageInputContainer"] button'))
              .find(button => button.className.includes('ChatMessageSendButton'));
            if (sendButton) {
                sendButton.click();
            } else {
                console.error('chat send button not found');
            }
        }, 100);

        // 最多执行一次
        messageInput.removeEventListener('focus', handle);
    };

    // 3. 用输入框被 focus 判断页面当前可交互
    messageInput.addEventListener('focus', handle);
})();

  2. 启用上述脚本，尝试访问 https://poe.com/?s=Hello，对话内容 Hello 应当被自动填入输入框，并开始一个新的聊天。

    如果上述代码不生效，可能是 Poe 首页的页面结构发生了变化导致失效（需要调整 UserScript 中的 selector），或者 UserScript 未被启用

  3. 打开浏览器设置，找到网站搜索或自定义搜索引擎的相关设置项，创建一个新的搜索选项（以 Chrome 浏览器为例）

    • 打开 Chrome 浏览器设置
    • 选择【搜索引擎】>【管理搜索引擎和网站搜索】
    • 点击【网站搜索】一栏的【添加】

  4. 填写搜索引擎信息并创建搜索引擎

    • 网址格式（假设用 %s 代替搜索字词）：https://poe.com/?s=%s
    • 快捷字词：poe（通过地址栏发起搜索时需要使用这个快捷字词作为前置字符串）

  5. 在地址栏输入 poe <Tab 键> Hello <Enter 键>，应当跳转到 https://poe.com/?s=Hello，自动输入对话内容并发起聊天

最佳实践

设置 Poe 的默认对话机器人
访问 Poe 的 设置 页面，在【默认机器人】下拉框选择自己常用的机器人。

纯键盘完成对话发起

  1. 键盘快捷键 Alt + D 聚焦到浏览器的地址栏
  2. 输入 poe（前面创建的 Poe 搜索引擎的快捷字词）
  3. 按 Tab 键（选择这个搜索引擎）
  4. 输入对话内容
  5. 按 Enter 键
ChatGPTPOETampermonkeyUserScript