ChatGPT Atlas的Apps SDK开发者工具怎么用

陌萱吖_2352

陌萱吖_2352

2026-09-26

917人浏览

原创

必须使用openai官方apps sdk接入chatgpt atlas自定义应用,仅plus及以上订阅用户可启用开发者模式并创建inline widget类app,通过右键菜单、javascript调用或内容脚本三种方式在网页中实时触发,需配置域名白名单且调试依赖atlas专用开发者工具标签页。

chatgpt atlas的apps sdk开发者工具怎么用

要在ChatGPT Atlas中接入自定义应用并实现网页内实时调用,必须使用OpenAI官方提供的Apps SDK——它不是独立安装的桌面工具,而是嵌入在Atlas浏览器运行时环境中的开发接口。

确认开发权限与环境准入

登录ChatGPT Atlas后,访问 https://atlas.openai.com/dev/apps,仅Plus、Pro、Business或Enterprise订阅用户可见该页面;Free用户会看到空白页或403错误,无法继续。

点击「Enable Developer Mode」开关,系统将弹出二次确认框——【此操作不可逆,开启后所有本地网页脚本将获得调用Atlas原生API的权限】。关闭浏览器再打开也无法自动撤销,必须手动进入设置页关闭。

开发者模式启用后,地址栏右侧会出现一个灰色“Ψ”图标,悬停显示“Dev Mode Active”。

创建第一个可调用App

在 https://atlas.openai.com/dev/apps 页面点击「Create New App」→ 选择「Inline Widget」类型(适用于在网页任意位置唤起轻量交互面板)。

填写App名称(如“My Translator”)、图标(SVG格式,尺寸限制为32×32像素)、描述(不超过120字符),然后粘贴你的前端代码片段——SDK强制要求入口函数名为 atlasAppInit,且必须返回一个包含 render 和 onActivate 方法的对象。

示例最小可行代码:

function atlasAppInit(context) {<br>  return {<br>    render: () => <div style="padding:8px">Hello from Atlas SDK</div>,<br>    onActivate: (event) => console.log("Activated at", event.x, event.y)<br>  };<br>}

保存后,系统生成唯一App ID(形如 app_abc123xyz),该ID将用于后续在网页中注册调用。

在网页中注入并触发App

方法一:通过页面内右键菜单激活
在任意网页按住右键不放超过600ms,松开后若页面已加载对应App的JS资源,右键菜单底部会出现你注册的App名称;点击即可在鼠标位置浮起渲染结果。

Ask Gemini/ChatGPT
Ask Gemini/ChatGPT

用于在用户想通过浏览器自动化与 Google Gemini 或 ChatGPT 交互时。触发短语包括“ask Gemini”“ask ChatGPT”“ask GPT”“让...”。

下载

方法二:通过JavaScript主动调用
在目标网页控制台执行:
atlas.launchApp("app_abc123xyz", { data: { text: "test" } });
注意:必须确保该App已在当前域名下完成白名单配置,否则调用静默失败,控制台无报错提示。

方法三:使用内容脚本自动挂载(需配合Manifest V3扩展)
在你的Chrome扩展的 content_scripts 配置中添加 "matches": ["<all_urls>"]</all_urls> 并注入SDK初始化脚本,再调用 atlas.registerApp(...) 注册本地Widget——此方式绕过Atlas官网App列表,适合内部工具链集成。

调试与日志查看

打开Atlas浏览器的开发者工具(Cmd+Opt+I),切换到「Atlas」标签页,这里会实时显示所有App的生命周期事件:注册、激活、销毁、错误堆栈。

若某次调用无响应,先检查「Atlas」标签页中是否出现红色error条目;常见原因是 atlasAppInit 函数未定义,或返回对象缺少 render 方法——【缺失render方法会导致整个App被静默忽略,不会报错也不会渲染】。

日志默认保留最近200条,刷新页面后清空;如需持久化,点击右上角「Export Logs」导出为JSON文件。

发布与域名白名单配置

第一步:进入App编辑页 → 点击「Publish」按钮 → 勾选「Enable for all subdomains」(若主站为 example.com,则自动覆盖 api.example.com、blog.example.com)。

第二步:在「Allowed Domains」输入框中逐行添加目标域名,每行一个,支持通配符但仅限子域层级(如 *.example.com 合法,*.com 非法)。

第三步:点击「Save Domain Settings」,系统立即生效,无需重新部署代码或重启浏览器。

注意:白名单变更后,旧页面需手动刷新才能加载新策略;已打开的iframe页面不受影响,除非其父页面也刷新。

相关文章

PHP速学视频免费教程(入门到精通)
PHP速学视频免费教程(入门到精通)

PHP怎么学习?PHP怎么入门?PHP在哪学?PHP怎么学才快?不用担心,这里为大家提供了PHP速学教程(入门到精通),有需要的小伙伴保存下载就能学习啦!

下载

相关标签:

chatgpt

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
ChatGPT注册
ChatGPT注册

ChatGPT注册方法:1、访问OpenAI的官方网站,进入注册页面;2、完成注册后收到一份邮件,打开后点击验证账号;3、选择一个适合您需求的订阅计划;4、获得访问ChatGPT的权限即可。

2023.09.12

1933

9

国内免费ChatGPT大全
国内免费ChatGPT大全

ChatGPT是一种基于深度学习技术的自然语言处理模型,由OpenAI开发。它是GPT的一个变体,专门设计用于生成上下文相关的文本回复。ChatGPT被训练成一个聊天机器人,可以与用户进行对话交互。更多关于ChatGPT的文章详情请查看本专题,希望对大家能有所帮助。

2023.10.25

4665

20

手机安装chatgpt的方法
手机安装chatgpt的方法

手机安装chatgpt的方法:1、在ChatGTP官网或手机商店上下载ChatGTP软件;2、打开后在设置界面中,选择语言为中文;3、在对局界面中,选择人机对局并设置中文相谱;4、开始后在聊天窗口中输入指令,即可与软件进行交互。想了解更多chatgpt的相关内容,可以阅读本专题下面的文章。

2024.03.05

7941

9

chatgpt国内可不可以使用
chatgpt国内可不可以使用

chatgpt在国内可以使用,但不能注册,港澳也不行,用户想要注册的话,可以使用国外的手机号进行注册,注意注册过程中要将网络环境切换成国外ip。想了解更多chatgpt的相关内容,可以阅读本专题下面的文章。

2024.03.05

3216

10

chatgpt官网入口地址合集
chatgpt官网入口地址合集

本专题整合了chatgpt官网入口地址、使用教程等内容,阅读专题下面的文章了解更多详细内容。

2026.03.16

1798

24

chatgpt使用指南
chatgpt使用指南

本专题整合了chatgpt使用教程、新手使用说明等等相关内容,阅读专题下面的文章了解更多详细内容。

2026.03.16

517

20

ChatGPT编程开发实战教程
ChatGPT编程开发实战教程

本专题全面讲解ChatGPT在编程开发中的应用,包括代码生成、接口调试、Bug修复、前端页面开发、Python脚本编写及数据库优化等,帮助开发者提升效率。

2026.05.29

200

14

ChatGPT自媒体创作教程
ChatGPT自媒体创作教程

本专题聚焦ChatGPT在自媒体领域的应用,包括爆款标题生成、短视频脚本撰写、小红书文案优化、公众号排版及AI创意输出等内容,适合内容创作者与运营人员学习。

2026.05.29

219

15

ChatGPT零基础入门教程
ChatGPT零基础入门教程

本专题适合ChatGPT新手用户学习,内容涵盖账号注册、基础功能、提示词使用、插件工具、聊天技巧及常见问题处理,帮助快速掌握ChatGPT核心操作。

2026.05.29

497

15

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
ChatGPT入门手册
ChatGPT入门手册

共0课时 | 0人学习

ChatGPT使用教学
ChatGPT使用教学

共2课时 | 183人学习