php 抓取网页生成图片(PHP安全：如何防范用户上传PHP可执行文件())

　　php 抓取网页生成图片(PHP安全：如何防范用户上传PHP可执行文件())

　　一、前言

　　一直听说上传文件有危险，但为了方便，一直都是直接放在项目根目录下，方便访问。只是现在项目越来越大，虽然安全问题不需要刻意去追求，但是这些基础方面还是需要注意的。上传路径最好是项目无法直接访问的路径。

　　PHP 安全性：如何防止用户上传 PHP 可执行文件

　　链接文章中提到，当前jpg中也可以编辑部分代码，所以上传路径最好是项目不能直接访问的路径。比如项目B在：/soft/www/B，那么文件应该上传到/soft/www/images。在这种情况下，外界无法通过域名直接访问它，这样会更安全。包括下载的excel、csv等文件，要注意上传和下载部分。

　　二、图像访问问题

　　是的，我们设法将图像上传到非项目目录，我们已经阻止了黑客攻击，让我们干杯。博主高兴的时候，前端显示图片的页面突然出现问题。是的，原来我们都是通过路径直接找到图片存储的位置的，但是现在通过路径根本找不到。. .

　　1、直接绝对路径，试试文件协议访问

　　直接拼接地址，想本地看：C/project/images/aaa.png

　　答：这个不能访问，因为img的src默认是http协议，而我们的写法是文件协议，所以不能直接在网页上访问

　　2、用js直接访问本地图片，然后转base64显示？

　　答：不可以，出于安全原因，浏览器不允许网络直接访问用户的文件系统。除非使用了输入标签，或者小程序的平台（如微信）提供了相应的接口。存储数据，微信有wx.setStorage，H5有localstorage和IndexedDB。

　　网上搜索的大部分答案都需要使用输入文件上传来获取文件对象。我们这里不需要使用输入上传标签，所以在尝试了几种方法后，我只好放弃了。

　　3、考虑写入文件，由JS读取

　　这个解决方案是不是在存储图片的时候在文件中存储了一个base64文件，文件是JS读取的？

　　缺点：

　　(1）文件是js读取的，那么php每次刷新页面都要重写文件

　　（2）js需要先拆分，然后根据id获取base64，最后赋值给img，性能可能会慢很多，而且写文件会出现文件锁的问题，如果是多人访问的系统，尽量不要这样做。

　　(3）第二个是写好的json，为了让js能读取，必须放在可访问的目录下，通过ajax的url可以访问json文件。

　　ajax就是让js主动发起http请求，这样就可以发起请求获取数据而不用跳转url，也就是说json文件在浏览器上也是可以访问的，那我们为什么不直接上传图片到项目目录呢？由于不会上传到项目目录，所以使用这个json文件似乎没有意义。

　　(4）这个方案已经放弃了，不过js读文件还是可以学习的

　　js读取text文件：https://blog.csdn.net/qq_37338983/article/details/81567542

js读取json文件： var configure_json = $.ajax({url: “./json/configure.json”,async: false}).responseText;

var configure_json_val = $.parseJSON(configure_json);

alert(configure_json_val[0].holiday);

php使用file_get_contens写入json到json文件： https://zhidao.baidu.com/question/235095737.html

类似的方法： https://www.douban.com/note/710707937/

如果输出到页面JS接收，要注意编码一定要utf-8（json_encode 默认的就是utf-8编码）

　　4、使用基类直接生成缩略图并保存

　　如果直接生成缩略图，最终无法避免存储问题。如果还是存放在项目里面，其实并没有起到安全的作用。如果它存在于项目之外，仍然可以直接访问。但是，与直接在项目内部上传文件相比，缩略图可能会稍微安全一些。第二种是将其存储在数据库中，如果您使用附加字段来存储它。

　　仁者见仁，智者见智。感觉不是很好，也没有回避上面提出的安全问题。

　　三、最终提案

　　想了想，为了成功访问镜像，避免跨域问题，尝试转成base64返回。既然用JS达不到目的，只能继续磨练我们的php。

　　(1）php 将图片路径转换为base64

　　生成缩略图基类下载地址：链接：提取码：h8yk

　　获取图片流并生成base64代码：参考：

　　php代码：

　　 $img_path = $dir.$images; // 图片的哭啼路径

$thumb = new Thumbnail(100, 100); //设置缩略图大小为100*100

ob_start(); //开启缓冲，获取图片流

$thumb->loadFile($img_path);

$thumb->buildThumb();

$imageString = base64_encode(ob_get_contents()); //把获取的图片流转化为base64编码

ob_end_clean();

$base64_image = 'data:' .$thumb->getMine() . ';base64,' .$imageString; //拼接图片需要的base64格式

　　(2）js 匹配 id 并为图片的 src 赋值

　　js代码:

if (data.code === "200") { //请求成功就进行赋值

if(data.images.length > 1){

$("#preview").css("display","block"); //图片显示

$("#portrait").attr("src",data.images); //给图片的src赋值

}

}

　　这样我们终于可以在前端页面展示我们的图片了：

　　题：

　　（1）页面上可能有几十个base64，占用页面资源很多，不好。

　　(2）二是图片越大，最终生成的base64越长，

　　(3）当base64很长的时候，也会影响页面的加载速度。

　　(4）页面加载的时候，这些图片的base64会被转入页面，响应速度也会受到影响。

　　相关优化：

　　(1）使用生成缩略图的基类

　　(2）使用基类将图片生成更小的缩略图，然后将生成的图片流直接转成base64文件流，再拼接回前端页面

　　优点：可以通过缩略图控制图片的大小。缩略图更小后，生成的base64代码也更少，不会影响加载速度。

　　缺点：(1）页面上还是会有一些地方显示base64

　　(2）当页面上有很多base64代码时，会影响页面的加载速度，我们可以通过分页来避免这部分

　　虽然我们的图片都显示出来了，但是速度真的让人堪忧。需要继续优化。

　　优化文章：

　　网页上的base64代码太长？科普base64到底是什么

　　结尾