Greasy Fork

Greasy Fork is available in English.

Download ChatGPT record

以html文件的形式保存当前页面下ChatGPT的对话记录:Save the chat record of ChatGPT on the current page in the form of html file

当前为 2023-02-14 提交的版本,查看 最新版本

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         Download ChatGPT record
// @namespace    http://tampermonkey.net/
// @version      0.5.1
// @description  以html文件的形式保存当前页面下ChatGPT的对话记录:Save the chat record of ChatGPT on the current page in the form of html file
// @author       YYForReal
// @match        https://chat.openai.com/chat*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=openai.com
// @grant        none
// @license      MIT

// ==/UserScript==

(function() {
    'use strict';
(function(){
    // 原本官网的域名,用于连接资源
    // const ResourceDomain = "https://chat.openai.com/"
    // 使用Gitee仓库内托管的资源
    const ResourceDomain = "https://gitee.com/friendArt/download-ChatGPT-record/raw/master/resource/"
    function downloadInit(){
        // DOM 深拷贝,防止影响页面
        const head = document.head.cloneNode(true)
        const body = document.body.cloneNode(true)

        // 替换所有的href链接
        let links = head.querySelectorAll("link");
        for (let link of links) {
            if (link.getAttribute("href").indexOf("http") !== 0) {
                link.setAttribute("href", ResourceDomain + link.getAttribute("href"));
            }
        }

        // 移除head内部的script代码
        let scripts = head.querySelectorAll("script");
        for (let scriptDom of scripts) {
            scriptDom.parentElement.removeChild(scriptDom);
            // 如果需要继续使用的话可以拼接保留
            // if (link.getAttribute("href").indexOf("http") !== 0) {
            //     link.setAttribute("href", ResourceDomain + link.getAttribute("href"));
            // }
        }

        // 单独移除最新的CSS样式
        links = head.querySelectorAll('link[rel="stylesheet"]');
        for (var i = 0; i < links.length; i++) {
            var link = links[i];
            link.parentNode.removeChild(link);
        }

        // 单独引入CSS样式
        var link = document.createElement('link');
        link.rel = 'stylesheet';
        link.type = 'text/css';
        link.href = 'https://gitee.com/friendArt/download-ChatGPT-record/raw/master/resource/_next/static/css/c770e01054031fe0.css';
        head.appendChild(link);


        // 移除body底部栏
        let bottom = body.querySelector('.absolute.bottom-0')
        bottom.parentNode.removeChild(bottom)

        // 修改样式,使之可以滚动
        let overflowDoms = body.querySelectorAll('.overflow-hidden')
        for (let dom of overflowDoms){
            dom.classList.remove("overflow-hidden")
        }

        // 拿到修改之后的字符串文本
        let mainStr = body.getElementsByTagName('main')[0].cloneNode(true).outerHTML;
        let headStr = head.outerHTML;

        // 去除所有的<script>
        // 获取script标签内的内容
        let reg = /<script[^>]*>([^<]|<(?!\/script))*<\/script>/gmi
        let res = mainStr.match(reg)
        // 如果具有script标签
        if (res != null) {
            res.forEach((ele) => {
                mainStr = mainStr.replace(ele,'')
            })
        }
        res = headStr.match(reg)
        if (res != null) {
            res.forEach((ele) => {
                headStr = headStr.replace(ele,'')
            })
        }

        // 去除头部的跨域标签
        headStr = headStr.replace(/crossorigin/igm,"")
        // 获取风格模式(light mode / dark mode)
        let htmlDom = document.querySelector('html')
        let mode = htmlDom.getAttribute('style')
        let htmlClass = htmlDom.className;

        // 增加copy code功能
        let copyCodeScript = `<script>
        let buttons = document.querySelectorAll('button.flex.ml-auto.gap-2')
        let timer = null;
        buttons.forEach(button => {
            button.addEventListener('click',(e)=>{
                // 不使用event对象找DOM会出现闭包、e.target是事件源、currentTarget是监听的对象
                let button = e.currentTarget
                let codeBlock = button.parentNode.nextSibling.children[0];
                const textArea = document.createElement("textarea");
                textArea.value = codeBlock.textContent;
                document.body.appendChild(textArea);
                textArea.select();
                document.execCommand("copy");
                textArea.remove();
                button.innerHTML = button.innerHTML.replace(/Copy code/igm,'Copied!');
                if(timer == null){
                    timer = setTimeout(()=>{
                        button.innerHTML = button.innerHTML.replace(/Copied!/igm,'Copy code');
                        clearTimeout(timer);
                        timer = null
                    },1000)
                }
            })
        });
        </script>`

        return `<html class="${htmlClass}" style="${mode}" >${headStr} <body> ${mainStr} ${copyCodeScript}</body> </html>`
    }

    // 定义按钮
    var downloadButton = document.createElement("button");
    downloadButton.className = "download-button"
    downloadButton.innerHTML = "Download Record";

    // 设置按钮元素的样式
    downloadButton.style.position = "fixed";
    downloadButton.style.padding = "5px";
    downloadButton.style.bottom = "100px";
    downloadButton.style.right = "20px";
    downloadButton.style.backgroundColor = "skyblue"
    downloadButton.style.border = "1px solid black";
    downloadButton.style.borderRadius = "10px";
    downloadButton.style.zIndex = 99;

    // 为按钮添加点击事件
    downloadButton.addEventListener("click", function () {
        // 定义html代码字符串
        // var htmlCode = "<html><body><h1>Example HTML code</h1></body></html>";
        var htmlCode = downloadInit();
        // 创建Blob对象
        var blob = new Blob([htmlCode], {
            type: "text/html"
        });

        // 获取时间,用于文件命名
        var today = new Date();
        var month = (today.getMonth() + 1).toString().padStart(2, '0');
        var day = today.getDate().toString().padStart(2, '0');


        // 创建下载链接
        var downloadLink = document.createElement("a");
        downloadLink.download = `Chat-${document.title}(${month}${day}).html`
        downloadLink.href = URL.createObjectURL(blob);

        // 点击链接,实现下载
        downloadLink.click();

        // 由于修改了DOM,所以需要重新刷新页面
        // window.location.reload();
    });

    // 将按钮添加到页面中
    document.body.appendChild(downloadButton);
})()



})();