c#后端:

        /// <summary>
/// 上传图片
/// </summary>
/// <returns></returns>
[HttpPost]
public ResultData uploadImage()
{
ResultData result = new ResultData();
try
{
string path = "/tmp/";
HttpPostedFile file = System.Web.HttpContext.Current.Request.Files["content"]; //对应小程序 name
string parameters = string.Format("postData:{0}", file.ToString()); //获取文件
if (file != null)
{
Stream sr = file.InputStream; //文件流
Bitmap bitmap = (Bitmap)Bitmap.FromStream(sr);
path += file.FileName;
string currentpath = System.Web.HttpContext.Current.Server.MapPath("~"); bitmap.Save(currentpath + path);
}
result.status = ;
result.data = path;
}
catch (Exception vErr)
{
result.status = -;
result.detail = vErr.Message;
return result;
}
return result;
}
    public class ResultData
{ public int status { get; set; } public string data { get; set; } public string detail { get; set; } }

小程序前端:

upFiles.js

var chooseImage = (t, count) =>{
wx.chooseImage({
count: count,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: (res) => {
var imgArr = t.data.upImgArr || [];
let arr = res.tempFiles;
// console.log(res)
arr.map(function(v,i){
v['progress'] = ;
imgArr.push(v)
})
t.setData({
upImgArr: imgArr
}) let upFilesArr = getPathArr(t);
if (upFilesArr.length > count-) {
let imgArr = t.data.upImgArr;
let newimgArr = imgArr.slice(, count)
t.setData({
upFilesBtn: false,
upImgArr: newimgArr
})
}
},
});
}
var chooseVideo = (t,count) => {
wx.chooseVideo({
sourceType: ['album', 'camera'],
maxDuration: ,
compressed:true,
camera: 'back',
success: function (res) {
let videoArr = t.data.upVideoArr || [];
let videoInfo = {};
videoInfo['tempFilePath'] = res.tempFilePath;
videoInfo['size'] = res.size;
videoInfo['height'] = res.height;
videoInfo['width'] = res.width;
videoInfo['thumbTempFilePath'] = res.thumbTempFilePath;
videoInfo['progress'] = ;
videoArr.push(videoInfo)
t.setData({
upVideoArr: videoArr
})
let upFilesArr = getPathArr(t);
if (upFilesArr.length > count - ) {
t.setData({
upFilesBtn: false,
})
}
// console.log(res)
}
})
} // 获取 图片数组 和 视频数组 以及合并数组
var getPathArr = t => {
let imgarr = t.data.upImgArr || [];
let upVideoArr = t.data.upVideoArr || [];
let imgPathArr = [];
let videoPathArr = [];
imgarr.map(function (v, i) {
imgPathArr.push(v.path)
})
upVideoArr.map(function (v, i) {
videoPathArr.push(v.tempFilePath)
})
let filesPathsArr = imgPathArr.concat(videoPathArr);
return filesPathsArr;
} /**
* upFilesFun(this,object)
* object:{
* url ************ 上传路径 (必传)
* filesPathsArr ****** 文件路径数组
* name ****** wx.uploadFile name
* formData ****** 其他上传的参数
* startIndex ****** 开始上传位置 0
* successNumber ****** 成功个数
* failNumber ****** 失败个数
* completeNumber ****** 完成个数
* }
* progress:上传进度
* success:上传完成之后
*/ var upFilesFun = (t, data, progress, success) =>{
let _this = t;
let url = data.url;
let filesPath = data.filesPathsArr ? data.filesPathsArr : getPathArr(t);
let name = data.name || 'file';
let formData = data.formData || {};
let startIndex = data.startIndex ? data.startIndex : ;
let successNumber = data.successNumber ? data.successNumber : ;
let failNumber = data.failNumber ? data.failNumber : ;
if (filesPath.length == ) {
success([]);
return;
}
const uploadTask = wx.uploadFile({
url: url,
filePath: filesPath[startIndex],
name: name,
formData: formData,
success: function (res) {
var data = res.data
successNumber++;
// console.log('success', successNumber)
// console.log('success',res)
// 把后台返回的地址链接存到一个数组
let uploaded = t.data.uploadedPathArr || [];
var da = JSON.parse(res.data);
// console.log(da)
if (da.code == ) {
// ### 此处可能需要修改 以获取图片路径
uploaded.push(da.data) t.setData({
uploadedPathArr: uploaded
})
}
},
fail: function(res){
failNumber++;
// console.log('fail', filesPath[startIndex])
// console.log('failstartIndex',startIndex)
// console.log('fail', failNumber)
// console.log('fail', res)
},
complete: function(res){ if (startIndex == filesPath.length - ){
// console.log('completeNumber', startIndex)
// console.log('over',res)
let sucPathArr = t.data.uploadedPathArr;
success(sucPathArr);
t.setData({
uploadedPathArr: []
})
console.log('成功:' + successNumber + " 失败:" + failNumber)
}else{
startIndex++;
// console.log(startIndex)
data.startIndex = startIndex;
data.successNumber = successNumber;
data.failNumber = failNumber;
upFilesFun(t, data, progress, success);
}
}
}) uploadTask.onProgressUpdate((res) => {
res['index'] = startIndex;
// console.log(typeof (progress));
if (typeof (progress) == 'function') {
progress(res);
}
// console.log('上传进度', res.progress)
// console.log('已经上传的数据长度', res.totalBytesSent)
// console.log('预期需要上传的数据总长度', res.totalBytesExpectedToSend)
}) }
module.exports = { chooseImage, chooseVideo, upFilesFun, getPathArr}

参考 https://www.cnblogs.com/flysem/p/9346759.html

c#后端 小程序上传图片的更多相关文章

  1. 微信小程序上传图片(附后端代码)

    几乎每个程序都需要用到图片. 在小程序中我们可以通过image组件显示图片. 当然小程序也是可以上传图片的,微信小程序文档也写的很清楚. 上传图片 首先选择图片 通过wx.chooseImage(OB ...

  2. .NET开发微信小程序-上传图片到服务器

    1.上传图片分为几种: a:上传图片到本地(永久保存) b:上传图片到本地(临时保存) c:上传图片到服务器 a和b在小程序的api文档里面有.直接说C:上传图片到服务器 前端代码: /* 上传图片到 ...

  3. 小程序上传图片功能 uploadFile:fail Read error:ssl=0xa738d808:I/O error during system call,Connection reset by peer

    由于纯网页上传图片小程序会闪退,就采用了小程序原生的上传功能wx.uploadfile 处理流程: 1.网页需要跳转到小程序 需要引用 <script src='https://res.wx.q ...

  4. 微信小程序上传图片及本地测试

    前端(.wxml) <view id="view1"> <view id="btns"> <image id="ima1 ...

  5. (十)微信小程序---上传图片chooseImage

    官方文档 示例一 wxml <view bindtap="uploadImage">请上传图片</view> <image wx:for=" ...

  6. 微信小程序 上传图片并等比列压缩到指定大小

    微信小程序官方API中  wx.chooseImage() 是可以进行图片压缩的,可惜的是不能压缩到指定大小. 实际开发中需求可能是压缩到指定大小: 原生js可以使用canvas来压缩,但由于微信小程 ...

  7. 微信小程序上传图片(前端+PHP后端)

    一.wxml文件 <text>上传图片</text> <view> <button bindtap="uploadimg">点击选择 ...

  8. 微信小程序 - 上传图片(组件)

    更新日期: 2019/3/14:首次发布,更新了2018/12/30的UI以及反馈信息获取方式,具体请下载:demo. 2019/3/20:感谢544429676@qq.com指出的现存bug,已修复 ...

  9. 微信小程序上传图片,视频及预览

    wxml <!-- 图片预览 --> <view class='preview-warp' wx:if="{{urls}}"> <image src= ...

随机推荐

  1. 《ASP.NET Core应用开发入门教程》与《ASP.NET Core 应用开发项目实战》正式出版

    “全书之写印,实系初稿.有时公私琐务猬集,每写一句,三搁其笔:有时兴会淋漓,走笔疾书,絮絮不休:有时意趣萧索,执笔木坐,草草而止.每写一段,自助覆阅,辄摇其首,觉有大不妥者,即贴补重书,故剪刀浆糊乃不 ...

  2. JavaScript-其他设计模式

    其他设计模式 JavaScript 中不常用 对应不到经典场景 原型模式-行为型 clone 自己,生成一个新对象 java 默认有 clone 接口,不用自己实现 //'object.creat'用 ...

  3. 微信小程序组件构建UI界面小练手 —— 表单登录注册微信小程序

    通过微信小程序中丰富的表单组件来完成登录界面.手机快速注册界面.企业用户注册界面的微信小程序设计. 将会用到view视图容器组件.button按钮组件.image图片组件.input输入框组件.che ...

  4. O2O外卖玩众包 开放平台难解标准之痛

    开放平台难解标准之痛" title="O2O外卖玩众包 开放平台难解标准之痛">  有一种怪现象一直是国内互联网企业摆脱不了的附骨之疽--不管规模大小,总是削尖了脑 ...

  5. PMP--1.6 项目经理

    本节都是理论的东西,可以在管理没有思路的或者管理陷入困境的时候当做提升或解决问题的思路来看. 一.项目经理 1. 项目经理.职能经理与运营经理的区别 (1)职能经理专注于对某个职能领域或业务部门的管理 ...

  6. Hibernate(六)--缓存策略

    缓存: 缓存就是数据库数据在内存中的临时容器,包括数据库数据在内存中的临时拷贝,它位于数据库与数据库访问中间层,ORM在查询数据时,首先会根据自身的缓存管理策略,在缓存中查找相关数据,如果发现所需的数 ...

  7. PHP将图片base64编码传输

    PHP函数源码 function imgToBase64($img_file) { $img_base64 = ''; if (file_exists($img_file)) { $app_img_f ...

  8. Prime_Series_Level-1

    0x01 先收集靶机端口,目录信息 1)nmap扫描端口 开启了ssh服务和apache服务,搜索相关漏洞 只有一个ssh用户名枚举,先放着 2)dirb爆破目录 dirb http://192.16 ...

  9. 00-django | 02-处理HTTP请求

    00-django | 02-处理HTTP请求 python Django Django 处理 HTTP 请求 Hello 视图函数 我们先以一个最简单的 Hello World 为例来看看 djan ...

  10. spring mvc5 的 配置文件 pom.xml

    spring mvc5 的 配置文件  pom.xml <?xml version="1.0" encoding="UTF-8"?> <pro ...