克隆过程

事先声明，这是我的学习笔记，up主的一些操作我使用其他方式实现，遂记录。来源：bilibili up主ITKEY:网站克隆技术|拿来主义的魅力|vim宏的妙用

软件准备以及系统环境

IDEA （tomcat）
windows 10
火狐浏览器（我发现这是必要的，报错404内容比较完整，会带上完整链接，谷歌和Edge都不会）

整体流程

新建一个web 项目
找到喜欢的网站，copy源代码（右键-查看源代码）到index.html
配置服务器，在火狐浏览器打开；
找到它的检查报错，复制下来（视频里有讲），缺少的内容，大部分是图片，还有css文件，总之，它说缺什么，就下载下来，在idea里补上；
a. 我下载的那个网页还有一些ttf ,woff,woff2的文件，我也一并下载，复制进去了；

b. up主用的vim整理需要下载的链接和批量下载404里的内容。我使用的excel格式化链接，和bat命令批量下载文件（win10自带），写在后面；

c. 下载完成后补上。（视频里有讲）方法一是，一个一个右键新建package。方法二是在文件夹里批量新建文件夹，(win10也可以做到，写在后面)；

win10批量下载文件&批量创建文件夹

怎么用excel 把404里复制下来的无效内容剔除应该就不用说了吧，
a. crtl+f - 替换：[*] 全部替换为空；
b. 再使用crtl +f替换为官方网址；
关于批量下载文件：将格式化后的链接保存到一个txt文件中，命名为imgs.txt;
再新建一个txt, 在里面输入

@echo off
setlocal enabledelayedexpansion
for /f %%i in (imgs.txt) do (
curl %%i -O
)
pause

参考来源:cmd（批处理脚本）实现批量下载图片
(我使用链接里的代码执行不成功，我把后面改成了 -O ，是全部的意思，成功了)

保存退出，重命名为dow.bat;
双击运行这个bat文件，imgs里的链接内容就会被下载到这两个txt所在目录下了。
关于批量创建文件夹，我是手动的，因为我copy的网站没几个package;
但是使用win10 的bat同样可以批量创建文件夹；

详情，请参考：怎样批量建多个、多级文件夹 (亲测可用)
如下代码：(创建了aa/aa1/aa2 三级文件夹目录)
md aa
md aa/aa1
md aa/aa1/aa2

出现的问题

默认打开的是index.jsp;
解决：发现我放在了web-inf受保护的目录下，把index.html移到web目录下，同时删除index.jsp;
导入图片后打开不显示图片
解决：仍然是WEB-INF目录的问题，我拷贝的网站里的img地址链接都包含WEB-INF目录。最终我使用快捷键 ctrl+r批量替换img里的src链接中的【WEB-INF/ -> / 】；再把WEB-INF里的目录移动到web下，删除WEB-INF。
发现有一张图片显示不出来
解决：在火狐浏览器里右键检查-查看器定位到图片的代码处，在idea里看代码发现，代码里的图片名叫【20210529041606928.jpg】，但我下载下来后被重命名为【thumb_300_300_20210529041606928.jpg】,我修改了目录里的图片名，成功。
发现还有一张显示不出来
解决：定位 - 看代码 -图片在class里 -打开对应class文件 -发现里面的s3.png底下有红色波浪线- 从当初下载的地址里重新下载，粘贴进去。

5.我修改了href跳转的链接，可是实际浏览器上跳转的url一直不变
解决 : 浏览器右键检查发现改错位置了，上面跳转的链接没有改，只改了下面…

打开跳转页面后，报错如下：

来自“http://localhost:63342/qd/js/v.js”的资源已被阻止，因为 MIME 类型（“text/html”）不匹配（X-Content-Type-Options:nosniff）。

解决：百度得到把script标签的 type=text/html改为type=javascript，原本网页是在WEB-INF目录下，但是我拷贝后是放在WEB目录下

修改后仍然是之前的错误和页面
解决：删除ou缓存t文件，restart

总结

拷贝的是静态页面，本质就是看报错，打补丁
不是一个完整的项目，但是用于学习别人的前端代码是非常不错的。
感谢up主

网站静态页面克隆 | 学习笔记相关推荐

CSS3与页面布局学习笔记（八）——浏览器兼容性问题与前端性能优化方案
一.浏览器兼容 1.1.概要世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...
韩顺平php可爱屋源码_韩顺平_php从入门到精通_视频教程_第20讲_仿sohu主页面布局_可爱屋首页面_学习笔记_源代码图解_PPT文档整理...
韩顺平_php从入门到精通_视频教程_第20讲_仿sohu首页面布局_可爱屋首页面_学习笔记_源代码图解_PPT文档整理对sohu页面的分析注释很重要经验:写一点,测试一点,这是一个很好的方法. ...
C4D 克隆学习笔记
C4D 克隆学习笔记运动图形模块克隆物体放在克隆子层级(可以放置多个物体) 模式:线性位置,缩放,旋转:下一个物体到该物体的相对变换(也是对单个物体的影响) 变换中的位置,缩放,旋转是对于单个 ...
C# 网站静态页面生成器 for 多线程版
摘要:该生成器是用于放置于服务器上的一个小程序,用于生成站点中需要静态化的页面生成.我写c/s程序不多,所以本程序可能会有些小的bug.还望高手多多指教! 内容: 首先让大家看看该程序的几个流程界面 ...
CSS3与页面布局学习笔记（四）——页面布局大全(负边距、双飞翼、多栏、弹性、流式、瀑布流、响应式布局)
一.负边距与浮动布局 1.1.负边距所谓的负边距就是margin取负值的情况,如margin:-100px,margin:-100%.当一个元素与另一个元素margin取负值时将拉近距离.常见的功能 ...
利用img请求一个html页面,爬虫学习笔记——爬取单个网页里的所有图片（入门）...
最近闲着,想学一下爬虫 (^-^)V --[手动比耶]先从简单的练习开始吧~ 爬取单个网页里的所有图片,这个没有什么难点,因为不需要翻页哈哈哈哈. 我很喜欢一些文章中的配图,比如这篇,里面就会有很多电 ...
提高网站性能的方法(学习笔记）
1.缓存对那些经常使用的数据和需要大量的时间来创建的数据可以存储在内存中,后来的请求直接使用,不需要在从新生成, 使用方法很简单: <%@OutputCache VaryByParams=&q ...
JSP-java服务器端页面【学习笔记】
文章目录 1.JSP简介 1.1为什么学习jsp? 1.2Jsp全称 1.3Jsp只能运行在服务器中,不能直接使用浏览器打开 1.4Jsp本质是一个Servlet 1.5jsp能够以HTML页面的方式 ...
python爬虫爬取58网站数据_python实战学习笔记：爬取58同城平板电脑数据
学习爬虫一周后独立完成的第一个作业项目:爬取58同城平板电脑数据. 1.首先确定URL,并抓取详情页中需要的信息首先我们确定好需要爬取的网页URL是:http://zhuanzhuan.58.com ...
静态链表（学习笔记）
写在前面的一些话:这只是个人学习王道数据结构的代码笔记,仅供参考,如果有错误请友好的指出,谢谢!!! 文章目录一.静态链表 1.定义一个静态链表 2.初始化一个静态链表总结一.静态链表 1.定义 ...

网站静态页面克隆 | 学习笔记

文章目录