ChatGPT页面截长图插件更新：GPT Screen Shooter V3.0.0
本帖最后由 夸克逃逸 于 2023-7-31 18:09 编辑【原帖：https://www.52pojie.cn/thread-1790136-1-1.html】
更新至3.0.0了，可以自定义配置字色、字号、隐藏头像等内容了
插件截图：
是这样的，前不久因为有需求，做了一个GPT截长图的插件。
后来感觉没什么人有这个需求，或者有其他更好的选择，所以就没管。
事实上，ChatGPT官网有更新代码，导致插件不可用了。
后来B站有个小伙伴告诉我，插件失效了。于是最近才抽出时间搞了一下。
现在的插件支持（GPT-3.5）：
①处理页面，放大字号，修改字色，拓宽内容宽度至满屏，配合浏览器自带的截长图功能实现截长图（清晰度不错）。
②复制完整的对话内容（用【输入内容】和【输出内容】区别了，可自行调整）；
③将完整的对话内容导出至txt文件中。
插件核心代码：
```javascript
chrome.runtime.onMessage.addListener((req, sender, resp) => {
const opt = req.opt;
if (opt === 0) {
// 隐藏侧边栏
const nav = document.querySelector(".bg-gray-900");
nav.style.display = "none";
// 隐藏下方输入框
const input = document.getElementsByClassName("pt-2");
input.style.display = "none";
// 设置为可滚动
const whole = document.querySelector(".w-full");
whole.classList.remove("overflow-hidden");
whole.classList.remove("h-full");
const whole2 = document.querySelector(".max-w-full");
whole2.classList.remove("overflow-hidden");
const whole3 = document.querySelector(".transition-width");
whole3.classList.remove("overflow-hidden");
whole3.children.classList.remove("overflow-hidden");
// 修改顶部内容，增加宽度，删除模型名称
const sticky = document.getElementsByClassName("sticky");
sticky.style.height = stickyHeight + "px";
sticky.innerHTML = "";
// 回复内容样式
let gc = document.getElementsByClassName("prose");
for (let i=0;i<gc.length;i++) {
gc.style.fontWeight = "bold";
gc.style.fontSize = fontSizeA + "px";
gc.style.color = colorB;
}
// 发送内容样式
let sc = document.getElementsByClassName("min-h-");
for (let i=0;i<sc.length;i++) {
sc.style.fontWeight = "bold";
sc.style.lineHeight = (fontSizeB + 8) + "px";
sc.style.fontSize = fontSizeB + "px";
sc.style.color = "#000000";
}
// 所有内容样式
const ac = document.getElementsByClassName("lg:max-w-");
for (const item of ac) {
item.style.width = ContentWidth + "% !important";
item.style.maxWidth = ContentWidth + "%";
item.style.left = (100 - ContentWidth)/2 + "%"
}
resp("处理成功，请打开浏览器开发者工具，手动截屏");
}
// if(opt === 1) {
// // 显示侧边栏
// const nav = document.querySelector(".bg-gray-900");
// nav.style.display = "block";
// // 显示下方输入框
// const input = document.getElementsByClassName("pt-2");
// input.style.display = "block";
// // 恢复
// const whole = document.querySelector(".w-full");
// whole.classList.add("overflow-hidden");
// const whole2 = document.querySelector(".max-w-full");
// whole2.classList.add("overflow-hidden");
// const whole3 = document.querySelector(".transition-width");
// whole3.classList.add("overflow-hidden");
// whole3.children.classList.add("overflow-hidden");
// // 将回复内容设置样式
// let gc = document.getElementsByClassName("prose");
// for (let i=0;i<gc.length;i++) {
// gc.style.fontWeight = "normal";
// gc.style.fontSize = "16px";
// }
// // 将发送内容设置样式
// let sc = document.getElementsByClassName("min-h-");
// for (let i=0;i<sc.length;i++) {
// sc.style.fontWeight = "normal";
// sc.style.fontSize = "16px";
// }
// resp("恢复成功");
// }
// 复制文本到剪贴板
let chatRecords = "";
if (opt === 1 || opt === 2) {
// 获取main标签
const mainNode = document.getElementsByTagName("main");
const chats = mainNode.children.children.children.children.children;
for (const item of chats) {
// 如果是发送内容
if (item.className == "group w-full text-gray-800 dark:text-gray-100 border-b border-black/10 dark:border-gray-900/50 dark:bg-gray-800") {
chatRecords += `\n【输入内容】\n${item.children.children.children.children.children.innerHTML}`;
} else if (item.className == "group w-full text-gray-800 dark:text-gray-100 border-b border-black/10 dark:border-gray-900/50 bg-gray-50 dark:bg-[#444654]") {
chatRecords += `\n【输出内容】\n${item.children.children.children.children.children.innerText}\n-----`;
}
}
if (opt === 1) {
const a = document.createElement("a");
a.style.display = "none";
document.body.appendChild(a);
a.addEventListener("click", () => {
toClipBoard(chatRecords);
})
a.click();
setTimeout(() => {
document.body.removeChild(a);
})
resp("复制成功，可直接在输入框粘贴");
} else {
save2Text(chatRecords);
resp("导出成功");
}
}
})
function toClipBoard(content) {
const textarea = document.createElement('textarea');
document.body.appendChild(textarea);
textarea.style.position = 'fixed';
textarea.style.top = '10px';
textarea.value = content;
textarea.select();
document.execCommand('copy', true);
setTimeout(() => {
document.body.removeChild(textarea);
}, 1000)
}
function save2Text(content) {
const a = document.createElement("a");
a.setAttribute("download", "chatgpt导出内容");
a.style.display = "none";
const blob = new Blob();
a.setAttribute("href", URL.createObjectURL(blob));
document.body.appendChild(a);
a.click();
setTimeout(() => {
document.body.removeChild(a);
}, 1000)
}
```
插件开源地址：GPT Screen Shooter
欢迎star fork~ 金山文档限制权限，无法复制只能截屏，EXCEL表需要左右横向滚动长截屏！大神您有可以左右横向滚动长截屏的吗？如无，大神有相关左右横向长截屏软件分享吗，急需，急需 谢谢楼主分享{:1_921:} 感谢分享，谢谢。。。。{:1_893:} 感谢分享，我也没想到GPT截长图这个想法 请问有中文版的吗？ 感谢楼主分享{:1_893:} 非常感谢楼主的分享，对分享GPT网页的内容有很大的帮助 wsxb 发表于 2023-7-28 18:25
请问有中文版的吗？
就是一个插件，里面内容都是中文，只不过名称取得英文 感谢君主分享，谢谢啦！ 感谢分享，有用学习一下