js本地图片预览，及服务端保存

最新推荐文章于 2022-06-15 17:16:28 发布

wateryi

最新推荐文章于 2022-06-15 17:16:28 发布

阅读量1.7k

点赞数

分类专栏： js .net

本文链接：https://blog.csdn.net/liwateryi/article/details/50433300

版权

.net 同时被 2 个专栏收录

23 篇文章 0 订阅

订阅专栏

11 篇文章 0 订阅

订阅专栏

客户端：

<html>
<head>
    <title>js本地图片预览，及服务端保存</title>
</head>
<body>
    <input type="file" accept="image/*" id="fileChoose" name="fileChoose" οnchange="preview(this)" />
    <img id="editImg" style="width:100%;height:100%;"/>
    <script type="text/javascript">
		var base64img=null;//图片base64编码后的字符串，用于上传到服务器保存图片
        function preview(obj) {
            var file = obj.files[0];
            if (file) {
                var reader = new FileReader();
                reader.onload = function () {
                    document.getElementById("editImg").src = this.result;
                    base64img = this.result;
                }
                reader.readAsDataURL(file);
            }
        }

        $(function(){
    $('#fileChoose').change(function (e) {
        var file = $(this)[0].files[0];
        if (file) {
            var reader = new FileReader();
            reader.onload = function () {
                //alert(this.result.length);
                $("#shareImg").attr('src', this.result);
                base64img = this.result;
                alert(base64img);
            }
            reader.readAsDataURL(file);

        }
    });
});
 </script>
</body>
</html>

服务端:

 string baseStr = "data:image/jpeg;base64,base64后的内容";

            MemoryStream m = new MemoryStream(Convert.FromBase64String(baseStr.Split(',')[1]));

            string rootPath =  "c:\\img.jpg";

            FileStream fs = new FileStream(rootPath, FileMode.OpenOrCreate);
            BinaryWriter w = new BinaryWriter(fs);
            w.Write(m.ToArray());
            fs.Close();
            m.Close();

//asp.net 跨域上传文件，服务端设置 HttpContext.Current.Response.AppendHeader("Access-Control-Allow-Origin", "*");
$.ajax({
url:url,
type:'post',
data:{},
success:function(result){
alert(result);
}
});

wateryi

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
js本地图片预览，及服务端保存

客户端： js本地图片预览，及服务端保存 var base64img=null;//图片base64编码后的字符串，用于上传到服务器保存图片 function preview(obj) { var file = obj.files[0]; if (file) {
复制链接

扫一扫