图片上传到ftp服务器，用户图片的获取

最新推荐文章于 2021-02-25 02:10:44 发布

wang_java_666_

最新推荐文章于 2021-02-25 02:10:44 发布

阅读量1.6k

点赞数 1

本文链接：https://blog.csdn.net/wang_666_/article/details/80526914

版权

这篇博客介绍了一个用户图片上传到FTP服务器的过程，包括前端使用layui组件实现图片预览和删除功能，后端使用FTPUtils类进行文件上传、删除。用户头像通过图片ID获取，并能在页面上展示和更新。

摘要由CSDN通过智能技术生成

<div class="am-u-md-4">
                    <img class="am-img-circle am-img-thumbnail" th:src="${userInformation.imgId}"/>
                </div>
                <div class="am-u-md-8">
                    <div class="layui-upload">
                        <button type="button" class="layui-btn" id="test2">更改头像</button>
                        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                            预览图：
                            <div class="layui-upload-list" id="demo2"></div>
                        </blockquote>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="/js/layui.all.js" charset="utf-8"></script>
<script>
    layui.use('upload', function() {
        var $ = layui.jquery
            , upload = layui.upload;

        var id=0;
        //多图片上传
        var uploadInst = upload.render({

            elem: '#test2'
            ,url: '/addpic'
            ,multiple: true
            ,before: function(obj){
                //
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    id++;
                    $('#demo2').append('<img id="img'+id+'" src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img">')

                });
            }
            , done: function (res) {
                alert("上传成功!"+id);
                $('#demo2').append('<button id="but'+id+'" οnclick="delete1(\''+res.path+'\','+id+')\">删除</button>')
            }
        });
    });





</script>
<script>
    function delete1(path,id) {

        $.ajax({
            /*url:'/deleteoneimg',*/
            type:'GET',
            data:{
                path<