完好实现layui+thinkphp图片上传功能
1前端<div class="layui-upload-drag" id="upload">
<i class="layui-icon"></i>
<p>点击上传，或将文件拖拽到此处</p>
<div class="layui-hide" id="uploadDemoView">
<hr>
<img src="" alt="上传成功后渲染" style="max-width: 196px">
</div>
</div><script>
layui.use(['jquery','upload'],
function () {
$ = layui.jquery;
var upload = layui.upload;
//拖拽上传
upload.render({
elem: '#upload'
, url: '/index.php/text/upload' //改成您自己的上传接口
, done: function (res) {
console.log(res.imgPath)
layer.msg('上传成功');
layui.$('#uploadDemoView').removeClass('layui-hide').find('img').attr('src', res.imgPath);
}
});});
</script>后端
public function upload()
{
// 获取表单上传文件 例如上传了001.jpg
$file = request()->file('file');
// 上传到本地服务器
$savename = Filesystem::disk('public')->putFile( 'upload', $file);
//转换反斜杠
$savename=str_replace('\\','/',$savename);
//$savename=》upload/20210725/28b20fe2b1913c94df7f84a239156fd7.png
//拼接服务器地址
$imgPath = 'http://127.0.0.1/upload/'.$savename;
return json(['code'=>200,'imgPath'=>$imgPath,'msg'=>'成功']);
}
页:
[1]