ChatGPT对话数据备份

news2025/7/18 17:17:06

ChatGPT对话数据备份

文章目录

  • ChatGPT对话数据备份
    • 1. 背景
    • 2. 其他(失败的)方法
      • 2.1 右键另存为
      • 2.2 直接copy html代码
    • 3. 编写Javascript脚本
      • 3.1 思路过程
      • 3.2 安装教程
      • 3.3 使用说明
      • 3.4 最终效果

1. 背景

之前在ChatGPT更新时有好几天都无法查看过往对话,而在服务器爆满宕机的时候更是不能登录回顾自己的对话。

所以有了缓存自己对话的需要,做好数据的备份。

2. 其他(失败的)方法

2.1 右键另存为

第一个想到最便捷的方法无疑是直接在浏览器端右键“另存为”:

右键另存为

然而这种方法会额外下载许多资源文件:并放在一个目录上。

在这里插入图片描述

关键是当你双击页面进入时,只会出现首页,根本没有保存到对话:

(猜测是因为router:每次进入都是先进入该首页,随后再进行路由跳转到对应的对话。)

在这里插入图片描述

2.2 直接copy html代码

学过前端基础的小伙伴就知道,我们右键“检查”可以打开控制台,在“元素”栏目上找到整个对话的html代码——即main标签,随后粘贴到本地的html文件中进行重现。

在这里插入图片描述

这种方式可以得到我们对话的数据,当然,因为仅有main标签,所以损失了对应的样式和copy code的功能。

在这里插入图片描述

即便是copy整份html代码也是如此。

原因就是源代码上的script标签和样式链接基本都是相对链接,而且部分资源还有跨域限制。

在这里插入图片描述

3. 编写Javascript脚本

至此,为了省去不必要的麻烦。同时也是脚本优化的功能所在:

  • 一键下载当前对话的html,不额外下载其他静态资源。

  • 自动转化所有的相对链接为绝对链接。

  • 保留样式风格:light mode以及dark mode

  • 保证隐私:去除了原页面所有的script脚本,仅保留自己实现的copy code功能。

3.1 思路过程

  • 操作DOM对象
    • 仅保留<head>标签和<main>标签、去除侧边栏、底部
    • 对DOM对象内部所有的“相对链接”都转成“绝对链接”
    • 通过正则提取内部所有的<script>标签并去除,自己写一个copy code的<script>标签引入。
  • 小细节:需要对页面DOM对象进行深拷贝,否则会影响原本的页面。

3.2 安装教程

  1. 下载浏览器端脚本管理器(如Tampermonkey,暴力猴)。
  2. 脚本下载途径:(两种)
    • 下载Gitee仓库js文件夹内的downloadgpt.js,并将该脚本导入到管理器。
    • 通过Greasyfork网站直接下载:https://greasyfork.org/zh-CN/scripts/459853-download-chatgpt-record

3.3 使用说明

下载脚本后进入ChatGPT聊天,右下角出现download按钮,点击即可保存当前的对话记录。

在这里插入图片描述

3.4 最终效果

保存后的html文件页面如下:

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/405312.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

webpack 面试题整理

文章目录webpack 面试题整理谈谈你对Webpack的理解Webpack的打包过程/打包原理/构建流程&#xff1f;Webpack中loader的作用/ loader是什么&#xff1f;常见的loader有哪些&#xff1f;Plugin有什么作用&#xff1f;/Plugin是什么常见的Plugin有哪些Webpack 插件的执行顺序&…

15套前端经典实战项目大合集,小白练手必备实战项目

15套前端经典实战项目大合集&#xff0c;悄悄练习&#xff0c;你会惊艳所有人。 今日我以内卷为荣&#xff0c;明日内卷以我为荣&#xff0c;不管学习哪门语言都要做出实际的东西来&#xff0c;这个实际的东西就是项目。 这里整理了15前端经典实战项目&#xff0c;每套都有完…

nodejs高版本降为低版本方案

1.首先通过控制面板应用卸载当前环境下的Node.js相关安装&#xff0c;并清理磁盘残存的文件夹等文件 2.下载nvm来管理node版本 官网&#xff1a;https://github.com/coreybutler/nvm-windows/releases 说在前面&#xff0c;贴一个error C:\Windows\system32>nvm use 12.10.…

web前端Vue 报错:Uncaught (in promise) TypeError: Cannot read properties of nu

前言 最近在写vue项目 在写自定义分页器的时候报了一个异常 知道错误却一直找不到解决方案 苦思冥想后 还是js的基础语法不扎实导致的&#xff0c;在此记录一下解决方案和思路 为以后的bug解决之路打下基础 错误提示 错误内容Uncaught (in promise) TypeError: Cannot read…

【HTML特效程序】① 给女神表白的程序(让女神看科技烟花),输入名字自动生成表白二维码

目录一、效果演示视频二、一步一步创建项目三、生成表白二维码的小链接一、效果演示视频 给女神表白的程序二、一步一步创建项目 &#x1f339; 在您的电脑上创建 love 文件夹 &#xff08;存放所有的资源和代码&#xff09; &#x1f339; 在 love 文件夹中创建 images 文件夹…

Vue 国际化之 vue-i18n 的使用

目录 一、安装 二、使用 1、准备语言包 2、准备翻译的语言环境 3、实现语言翻译 三、整合 ElementUI 语言包 1、扩展中文 2、扩展英文 3、使用扩展语言翻译 四、问题记录 五、扩展 vue3 中使用 vue-i18n 一、安装 npm install vue-i18n 如果在一个模块系统中使用…

elementUI使用el-upload上传文件写法总结及避坑,上传图片/视频到本地/服务器以及回显+删除

Element Upload 上传 Element Upload官方文档&#xff1a;el-upload 具体细节只看官方文档&#xff0c;本篇主要介绍避坑点和用法总结 注意点以及坑 本地上传想要回显图片视频&#xff0c;使用on-success是没办法再在上传后获取到本地文件路径后进行回显的&#xff0c;因为只…

若依(RuoYi )权限管理设计

前言 若依权限管理包含两个部分&#xff1a;菜单权限 和 数据权限。菜单权限控制着我们可以执行哪些操作。数据权限控制着我们可以看到哪些数据。 菜单是一个概括性名称&#xff0c;可以细分为目录、菜单和按钮&#xff0c;以若依自身为例&#xff1a; 目录&#xff0c;就是页…

TypeScript 学习笔记(十万字超详细知识点总结)

👉 本系列专栏:TypeScript从入门到精通 🖥️ NodeJS专栏:Node.js从入门到精通 📢 欢迎私信博主加入前端交流群🌹 知识目录 一、介绍1、JavaScript最大的问题2、什么是TypeScript3、JS , ES , TS 的关系4、为什么使用TypeScript5、配置TypeScript环境二、数据类型1、基…

下载、编译、安装、使用 vue-devtools

不少人都想下载 vue-devtools插件&#xff0c;但又不会做&#xff0c;今天我做个比较详细的笔记 查看当前的devtools的版本可以去这个网站看右侧的个v几点几的&#xff0c;就是版本号 github/vuejs/devtools 目录 第一个方法&#xff1a;使用极简插件 第一步&#xff1a;查…

Node.js | JavaScript也能写后端?

本文已收录于专栏⭐️ 《深入浅出Node.js》⭐️ 学习指南&#x1f4c3;&#x1f449;引入⭐️初识Node.js⭐️发展历史⭐️应用场景⭐️搭建环境&#x1f449;完结散花&#x1f449;参考文献&#x1f449;引入 如果读者是一个前端开发的同学&#xff0c;不知道你有没有过这样的…

jsoup的使用

本文在写作过程中参考了官方文档&#xff0c;传送门。 一、jsoup概述 jsoup 是一款基于 Java 的HTML解析器&#xff0c;它提供了一套非常省力的API&#xff0c;不但能直接解析某个URL地址、HTML文本内容&#xff0c;而且还能通过类似于DOM、CSS或者jQuery的方法来操作数据&…

Node.js和Vue的安装与配置(超详细步骤)

目录一、下载二、安装三、配置四、安装配置vue五、构建运行Vue项目一、下载 Node.js官网下载 大家根据自己的系统进行下载安装包&#xff08;我的电脑是windows10-64位&#xff0c;所以下载第一个&#xff09; 二、安装 点击下载的安装包进行安装 点击Next 打勾并点击Ne…

vue3 路由的使用

路由的使用 在传统的 Web 开发过程中&#xff0c;当需要实现多个站内页面时&#xff0c;以前需要写很多个 HTML 页面&#xff0c;然后通过 标签来实现互相跳转。在如今工程化模式下的前端开发&#xff0c;像 Vue 工程&#xff0c;可以轻松实现只用一个 HTML 文件&#xff0c;…

JavaScript:实现复制粘贴剪切功能

文章目录js实现复制粘贴功能方式一&#xff1a;原生方式实现复制粘贴剪切&#xff08;不推荐&#xff09;方式二&#xff1a;浏览器自带clipboard API实现复制粘贴&#xff08;推荐&#xff09;简介特点clipboard对象及相关APIClipboard.readText()Clipboard.read()Clipboard.w…

iframe标签的使用

iframe标签的使用1、什么是iframe2、iframe的元素属性3、iframe操作4、iframe 对象及属性5、创建iframe元素6、iframe之间的通信6.1、什么是主域名&#xff0c;什么是子域名(拓展)6.2、iframe之间的通信7、其他7.1、iframe自适应7.2、防嵌套网页7.2.1、浏览器端7.2.2、服务器端…

使用HBuilderX软件快速搭建Vue项目

1.node.js环境下载 node.js相当于java中jdk,但是是在服务器端的 JavaScript,需要通过npm去管理node.js的包,通过npm可以下载node.js中的扩展 ①首先下载node.js的安装包 https://nodejs.org/zh-cn/download/releases/(以往版本) ②选择node.js的下载路径配置环境变量(一般会…

5分钟带你看懂 prettier + eslint 搭配(vscode)

最近身边不少朋友在用eslint和prettier搭配的时候&#xff0c;总是遇到一些莫名其妙的报错&#xff0c;自己也不知道怎么配&#xff0c;所以我总结了一下自己搭配的步骤&#xff0c;分享一下&#xff0c;如有不对之处&#xff0c;静请诸位大佬雅正&#xff01; 本文按顺序配置一…

轻松实现在web页面中直接播放rtsp视频流

轻松实现在web页面中直接播放rtsp视频流写在前面实现介绍如何使用准备ffmpeg运行rtsp2web参数说明前端代码参数说明课外知识写在前面 我之前研究在 web 中直接播放 rtsp 视频流时&#xff0c;写过一篇文章&#xff1a;【前端】rtsp 与 rtmp 视频流的播放方法。阅读 这篇文章 对…

vue3 props属性基本使用梳理

前言 vue2中props属性的使用是比较统一的基本就一种方式&#xff0c;但是vue3中其实方式是比较多的&#xff0c;因此就打算梳理一下。 会按照选项式和组合式进行梳理&#xff0c;包括属性的定义、取值以及属性的监听。 应该是叫单文件组件和组合式API&#xff0c;不知道vue官…