Laravel+Layer实现图片上传功能(整理篇)
♩ 背景
昨天在自己的 Laravel5.5
框架项目中,希望集成 Layer
的图片上传功能 但是在 ajax(POST)
提交请求时,一直显示 500 报错
♪ 分析
⒈ 问题所在
最后将核心代码摘出,放到 Larvel
框架以外运行,发现代码是没有问题的,因为对 Laravel
框架接触的太浅,忽视了 CSRF
的限制
⒉ 解决方案
一般在表单提交时,都会存放一个隐藏的输入框
或者在需要提交的表单中补充一行代码:
但是,在比较单一的元素进行 ajax
提交时,建议可使用如下的方法
①. 页面中添加隐藏域
②. ajax 请求前,先获取 csrf_token()
值
③. ajax 请求时,将该值作为数据的一部分传输过去,例如:
♫ 实现步骤
⒈ 源文件目录
⒉ 前端准备
页面引入layui 的 css 和 js 文件
注: 本人下载的 layui 框架源码包为 layui-v2.2.45
核心代码:
js 代码:
⒊ 后端处理
因为前端 Layer 默认的是 POST
请求,则后台 uplaod.php
核心代码如下:
【注意】: 使用下载的源码文件时,可将该处的核心代码进行替换
补充公共函数 showMsg()
:
⒋ 实现效果
♬ 补充
⒈ 注意事项 提供的代码,可用于 PHP
的原生开发或其他流行框架,其实只要后台能接收到 $_FILES
数据就好办了 我就是卡在了 Laravel
框架的 CSRF
认证上,耗费了好多时间,所以:
后端代码的图片上传功能属于原生程序,可自行优化,建议使用流行框架所推荐的集成方法。 ⒉ move_uploaded_file()
补充
对于上述的代码,需要注意一点 : move_uploaded_file()
方法的使用
如果图片所上传的目录不存在,很可能会报错,所以需要判断当前情况,若不存在,要建立新目录
⒊ Laravel 中的处理 作为 PHP 开发的流行框架,必然做了对文件上传功能的集成,文件的上传,可参考学习文档,以本人的处理为例:
⑴. 相对于使用默认的上传方法,会将文件存放到 "storage"
目录中,而进一步对该目录的访问还需要添加软链接,感觉有点麻烦,所以我指定磁盘到 "public"
目录即可
⑵. 可参考我之前的一篇文章—— Laravel 文件上传功能实现 ,打开配置文件 config/filesystems.php
,向磁盘配置数组中添加一个 url
⑶. 相对应的后台核心处理代码则为:
如此一来,上传的图片所在目录为: public/upload/image/{$date}/
☺ 源码下载
源码下载提供
总结
以上所述是小编给大家介绍的Laravel+Layer实现图片上传功能(整理篇),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对编程学习网网站的支持!