ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

layui上传图片以二进制流保存

2022-07-05 14:34:48  阅读:175  来源: 互联网

标签:function return string 二进制 layui result msg 上传


前端:

            <div class="layui-form-item">
            <label class="layui-form-label" style="width:100px">图形名称</label>
            <div class="layui-input-inline">
                <input type="text" name="PicName" id="PicName"  lay-verify="title" placeholder="请输入" autocomplete="off" class="layui-input" style="width:220px">
                <input type="text" name="PicChoose" id="PicChoose"  style="display: none">
            </div>
            <div class="layui-upload" style="margin-left: 380px;">
                <button type="button" class="layui-btn" id="uploadImg" style="margin-left: 20px">选择图片</button>
                <button id="hideUpload" type="button" style="display: none"></button>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block" style="text-align:center">
                <button class="layui-btn" lay-submit lay-filter="formDemo">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
            <div class="layui-upload-list" style="margin-left:300px">
                <p id="demoText"></p>
                <div style="width:220px;height:300px;background: white;margin-top: 20px"><img class="layui-upload-img" id="demo1"></div>
            </div>
        </div>
            
            <script>
            //图片上传
            var uploadInst = upload.render({
                elem: '#uploadImg'         //绑定点击按钮
                , url: '/EXFactoryBaseData/uploadPicFile'     //访问后台路径
                , accept: 'images'               //图片格式
                , auto: false                     //取消自动上传
                , method: 'post'                 //请求上传的 http 类型
                , bindAction: '#hideUpload'       //绑定真正的上传按钮
                , data: {                         //访问后台提交的数据
                    // name: $('#a').val()
                    baseId: function(){return baseId},
                    fileName: () => {
                        return $('#demo1').val();//官方文档说明:实现动态传值
                    }
                }
                , choose: function (obj) {
                    //预读本地文件示例,不支持ie8
                    obj.preview(function (index, file, result) {
                        $('#demo1').attr({ src: result, width: "220", height: "300" });//图片链接(base64)
                    });
                    var PicChoose = "1";
                    $('#PicChoose').val(PicChoose);
                }
                , done: function (res) {
                    var result = JSON.parse(res)
                    //如果上传失败
                    if (result.code > 0) {
                        return layer.msg('图片上传失败!');
                    }
                    //上传成功
                    layer.msg("图片上传成功!", {
                        time: 1000
                    }, function () {
                        //重新加载页面
                        location.reload();
                    });
                }
                , error: function () {
                    //演示失败状态,并实现重传
                    var demoText = $('#demoText');
                    demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                    demoText.find('.demo-reload').on('click', function () {
                        uploadInst.upload();
                    });
                }
            });
        });
    </script>

后端:

        /// <summary>
        /// 上传图片信息
        /// </summary>
        /// <returns></returns>
        [HttpPost]
        public string uploadPicFile()
        {
            string baseId = Request["baseId"].ToString();
            string PicName = Request["PicName"].ToString();
            string code = "0", msg = "";
            string[] imgInfo = Request.Files[0].FileName.Split('.');
            if (!(imgInfo[1] == "bmp" || imgInfo[1] == "jpg" || imgInfo[1] == "jpeg" || imgInfo[1] == "png"))
            {
                msg = "上传的文件格式不对!";
                return "{\"code\":\"-1\", \"msg\":\"" + msg + "\"}";
            }
            HttpPostedFileBase file = Request.Files[0];
            string name = file.FileName;
            Stream fileStream = file.InputStream;
            byte[] byimg = GetBytesFromImage(fileStream);
            int result = BLL.uploadPicFile(byimg, baseId, PicName);
            return "{\"code\":\"0\", \"msg\":\"\"" + "}";
        }


        //转流方法
        public byte[] GetBytesFromImage(Stream filename)
        {
            Stream fs = filename;
            int length = (int)fs.Length;
            byte[] image = new byte[length];
            fs.Read(image, 0, length);
            fs.Close();
            return image;
        }

后面直接将二进制流保存到数据库就可以了

 

标签:function,return,string,二进制,layui,result,msg,上传
来源: https://www.cnblogs.com/lily15146/p/16446295.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有