F12抓包14_修改网页图片网页保存到本地

课程大纲

1、修改网页图片（2种方式二选一）

        修改网页图片，需要定位到图片标签，修改<img>标签的属性。2种方法：

        1. 修改为网络图片url。缺点：url失效，图片无法显示。

        2. 修改为图片base64，相当于写了固定的数据，不会有图片不能显示的问题。

1.修改为网络图片url

【操作步骤】

Step1. 使用F12工具栏左上角选择工具，选中图片，定位对应的<img>标签元素。 Step2.复制一个网络图片url：鼠标在图片上右键，选择“复制图片地址”。

Step3. 鼠标置于<img>标签右键选择“修改属性”，将“src=”后的url替换为已复制的url，回车确认，图片替换完成。

2.修改为图片base64

【操作步骤】

搜索“在线图片转base64”，将图片数据转换为base64码，复制。（非常长）

同上Step1、2、3操作，差异：“src=”后改为复制的base64码。

2、为什么篡改网页后刷新，网页又恢复原来的样子？

        浏览器和服务器交互，如下图示，每次刷新，每次返回新的数据，原数据覆盖。

        想要每次刷新不更新内容，可以让请求指向一个固定的内容。可以将网页保存到本地，从本地打开。

3、网页保存到本地

比如将上方修改过的网页保存到本地，操作步骤：

Step1.网页显示空白区域，鼠标右键，选择“存储为”；

        

Step2.可设置名称，选择格式为“网页，全部”，点击“存储”。

        

Step3.存储位置可以看到同名的htm文件和文件夹，双击htm即可查看保存的网页。文件夹中是网页展示需要的资源，如网页的图片、css样式文件、js文件等。