一、Vue

只截取有用的片段，具体的完整的代码去看hello uniapp项目---接口--媒体--图片
前置提醒：currentOrder.bxsqListJson.Image 是功能模块中用于关联图片数据表的一个字段

1.data数据

imageList: [] //存放图片链接的数组
id: ''//guid随机码

2.页面代码

<!--拍照or上传图片-->
<view class="uni-uploader__files">
    <block v-for="(image,index) in imageList" :key="index" v-model="currentOrder.bxsqListJson.Image">
        <view class="uni-uploader__file">
            <image class="uni-uploader__img" :src="image" :data-src="image" @tap="previewImage"></image>
            <l-icon style="position: relative; top: -210rpx;float: right;" class="text-lg" type="close" color="black" @tap="delImage(index)"/>  
        </view>         
    </block>
    <view class="uni-uploader__input-box">
        <view class="uni-uploader__input" @tap="chooseImage"></view>
    </view>
</view>

3.方法

(1)选择图片&&上传图片

官方文档：
https://uniapp.dcloud.io/api/media/image?id=chooseimage
https://uniapp.dcloud.io/api/request/network-file?id=uploadfile

uni.chooseImage({
        success: (res) => {
            this.imageList = this.imageList.concat(res.tempFilePaths);//返回blob链接至数组，可以直接显示图片
            for(var i=0;i<this.imageList.length;i++){
                uni.uploadFile({
                  url: ,//后台接口
                  name: 'file',
                  filePath: res.tempFilePaths[i],
                  formData: { },//传参，数据+随机码
                  success:(data)=>{
                  this.currentOrder.bxsqListJson.Image = JSON.parse(data.data).data //即data中的id赋值
                  }
                })
            }
        }
})

(2)预览图片

官方文档：
https://uniapp.dcloud.io/api/media/image?id=unipreviewimageobject

previewImage: function(e) {
        var current = e.target.dataset.src
        uni.previewImage({
            current: current,
            urls: this.imageList
        })
}

(3)删除图片

delImage: async function(index){
        uni.showModal({
            title:'删除照片',
            content:'确定要删除这张照片吗？',
            cancelText:'取消',
            confirmText:'确定',
            success: res=>{
                console.log(res)
                if(res.confirm){
                    this.imageList.splice(index,1)
                }
            }
        })
}

二、C#

仅提供思路，后续自己完善

1.上传图片接口

var files = (List<HttpFile>)this.Context.Request.Files;//接收blob链接
var folderId;//接收前端的随机码（data--id）
var virtualPath；//存放图片的绝对路径
string path = Path.GetDirectoryName(virtualPath);
Directory.CreateDirectory(path);//创建文件夹
if(!System.IO.File.Exists(virtualPath)){
    //图片二进制，输入输出流
    byte[] bytes = new byte[files[0].Value.Length];
    files[0].Values.Read(bytes,0,bytes.Length);
    FileInfo file = new FileInfo(virtualPath);
    FileStream fs = file.Create();
    fs.Write(bytes,0,bytes.Length);
    fs.Close();
    //文件信息写入数据库
    ......
}
return SuccessString(folderId)

三、保存后查看图片

1.Vue 页面查看

uni.request({
            url: ,//获取图片的id，返回结果为数组
            data: { }//传参，数据+Image（根据Image关联数据库存放图片的表，获取图片id）
           }).then(([err, { data }])=>{
            for(var i=0;i<data.data.length;i++){
                var F_Id = data.data[i].F_Id//图片id
                this.imageList.push('查看图片接口?fileid='+F_Id)//查看图片
            }
            console.log(this.imageList)
        })

2.C#查看图片接口

//根据fileid得到图片数据表的信息（图片路径...）
byte[] byteArray;//图片二进制流数组
using (FileStream fs = new FileStream(图片绝对路径,FileMode.Open,FileAccess.Read)){
    byteArray = new byte[fs.Length];
    fs.Read(byteArray,0,byteArray.Length);
}
MemoryStream ms = new MemoryStream(byteArray);
var contentType;//图片类型
return Response.FromByteArray(ms.ToArray(),contentType);

//FromByteArray
public static Response FromByteArray(this IResponseFormatter formatter, byte[] body, string contentType = null){
    return new ByteArrayResponse(body,contentType);
}

3.直接在IIS上搭一个图片服务器更简单，看怎么选择吧