炸裂!!用SingleFile把网页保存成html,一个文件就搞定

炸裂!!用SingleFile把网页保存成html,一个文件就搞定

以前我保存网页都是Ctrl+S,但是这样会多出来一个文件夹,用来存网页上的css、图片等等,一点都不优雅。

今天给大家分享一款浏览器插件,可以把网页完完整整的保存成html,而且只有一个html文件就搞定了。

在浏览器里打开加载项,我这里用的是Edge

搜索singlefile,找到插件后,点击获取

安装完成之后,打开想要保存的网页,然后点击这个插件图标,等到加载完成后就会自动下载html啦

防止迷路,快点马住~~

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
将整个页面存档到一个HTML文件SingleFile也可以用来替代快照/截图/捕获页面扩展。 1-说明: - 等待页面完全加载:您可能需要向下滚动整个页面并悬停动态文档元素(例如“翻转”图像)以确保所有元素都已加载 - 点击Chrome工具栏中的SingleFile图标(或按Ctrl Shift S)以启动页面处理 - 等到保存标题出现在页面顶部 - 点击横幅链接将页面保存在默认的下载文件夹中 补充笔记: - 在安装过程中,扩展会要求您安装“SingleFile Core”,按照安装说明或从这里下载:https://chrome.google.com/webstore/detail/jemlklgaibiijojffihnhieihhagocma - 您可以使用上下文菜单处理整个页面(“处理页面”),页面的选定部分(“处理选择”)或框架(“处理框架”) - 从SingleFile版本0.3.0开始,默认行为是显示一个横幅,它允许您轻松地将页面保存到Downloads目录中。要使用Chrome文件 - >另存为...对话框并将文件保存到选定位置,请取消选择页面中的“显示保存横幅”和“显示保存通知”(右键单击单个文件图标,选择选项)。 2 - 一般说明 - 保存文件与Firefox,Opera,Safari,Konqueror兼容,部分与Internet Explorer 8兼容(请参阅帮助页面)*不安装任何扩展名* - SingleFile使用“数据URI”方案将图像和帧内容嵌入到页面中:生的格式不是MHT / MHTML。 - 右键单击​​SingleFile图标并选择“Options”打开选项页面 3 - 更多信息 有关选项,技术说明和已知问题的更多详细信息,请参阅选项页面中的扩展帮助。 >>您想在查看保存的页面时打开原始页面吗?尝试“打开单个文件的原始” >> https://chrome.google.com/webstore/detail/ofpgbbdbebphacpiilccacdhjnehlhia >>您是否在寻找高级档案管理员?尝试“PageArchiver” >> https://chrome.google.com/webstore/detail/ihkkeoeinpbomhnpkmmkpggkaefincbn >>你想保存一个zip文件中的多个标签?试试“ZipTabs” >> https://chrome.google.com/webstore/detail/ccnanbffbfbcgfmmkgejodommhidpjba 4 - 问题 如果您发现一个未知的问题(即冻结过程,额外保存文件,空白或更改的文档,标签崩溃...): - 检查SingleFile帮助页面中的已知问题 - 在SingleFile选项页面中重置选项 - 如果选项重置不起作用,请尝试取消选中“显示保存通知”和“显示保存横幅”,并确保后台进程未被选中(您需要使用Chrome“另存为”对话框来保存页面)。 - 禁用所有其他分机,查看是否有冲突 - 如果发生冲突,请尝试确定哪个分机(S) - 用一个简短的描述报告问题,描述如何重现它,Chrome版本,操作系统名称和版本: https://github.com/gildas-lormeau/SingleFile/issues 建议欢迎:) 支持语言:Deutsch,English,Français,español,polski,русский,中文 (简体),中文 (繁體),日本語
下面是一个使用Dropzone.js将文件上传到服务器并将其保存的完整案例: 1. 安装Dropzone.js 使用npm或yarn在您的项目中安装Dropzone.js: ``` npm install dropzone ``` 或者 ``` yarn add dropzone ``` 2. 创建HTML文件 创建一个HTML文件,并在其中添加Dropzone.js的样式和脚本文件。您可以从Dropzone.js官方网站上找到这些文件。 ```html <!DOCTYPE html> <html> <head> <title>Dropzone.js上传文件保存到服务器</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.7.0/min/dropzone.min.css" /> </head> <body> <form action="/upload" class="dropzone"></form> <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.7.0/min/dropzone.min.js"></script> <script> Dropzone.options.myAwesomeDropzone = { paramName: "file", // The name that will be used to transfer the file maxFilesize: 2, // MB dictDefaultMessage: "拖拽文件到此或点击上传", init: function() { this.on("success", function(file, response) { console.log(response); }); } }; </script> </body> </html> ``` 3. 创建服务器端代码 创建一个Node.js服务器,并使用Multer来处理文件上传。Multer是一个Node.js中间件,用于处理`multipart/form-data`类型的表单数据,特别是用于文件上传。它可以在Express.js框架中使用。 ```javascript const express = require("express"); const multer = require("multer"); const app = express(); // 配置Multer const storage = multer.diskStorage({ destination: function(req, file, cb) { cb(null, "uploads/"); }, filename: function(req, file, cb) { cb(null, file.originalname); } }); const upload = multer({ storage: storage }); // 处理文件上传 app.post("/upload", upload.single("file"), (req, res) => { res.json({ message: "文件上传功" }); }); // 启动服务器 app.listen(3000, () => { console.log("服务器已启动"); }); ``` 4. 运行应用程序 现在,您可以使用以下命令在终端中运行应用程序: ``` node app.js ``` 然后,在浏览器中访问`http://localhost:3000`,您应该可以看到一个带有Dropzone.js的上传表单。您可以将文件拖放到表单中或单击表单以选择要上传的文件。 当您上传文件时,服务器将保存文件到`uploads/`目录中,并将消息“文件上传功”作为JSON响应发送回客户端。 这就是如何使用Dropzone.js将文件上传到服务器并将其保存的完整案例。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值