Taro 微信小程序 上传文件到minio
小程序前端上传文件不建议直接引用minio的js npm包,一来是这个包本身较大,会影响小程序的体积,二来是ak sk需要放到前端存储,不够安全,因此建议通过请求后端拿到签名数据后上传。
由于小程序的uploadFile仅支持POST请求(估计以后也不会支持PUT了),因此只能使用minio的PresignedPostPolicy方法返回签名后的formData,然后再放到小程序的uploadFile方法的formData参数中
后端 .net
安装minio nuget包
接口返回dto
public class UploadInfo
{
public string Key { get; set; }
public string Url { get; set; }
public Dictionary<string, string> FormData { get; set; }
}
多个key进行预签名, 注意new MinioClient的第一个参数是minio的服务器地址,不能有http://或https://, 如果是https则需要new 之后再调用.WithSSL(),参见官方文档。 当然最佳实践还是要将minioClient对象通过依赖注入管理,minio相关配置通过IConfiguration(appsettings.json)来管理。
public async Task<UploadInfo[]> PresignedPostPolicyAsync(string[] keys)
{
string bucket = "myBucket";
var minioClient = new MinioClient("myminio.com:9000",
"ak",
"sk"
);
var result = new UploadInfo[keys.Length];
for (int i = 0; i < keys.Length; i++)
{
var policy = new PostPolicy();
policy.SetKey(keys[i]);
policy.SetBucket(bucket);
policy.SetExpires(DateTime.UtcNow.AddHours(2));//设置策略过期时间
Tuple<string, Dictionary<string, string>> data = await minioClient.PresignedPostPolicyAsync(policy);
result[i] = new UploadInfo
{
Key = keys[i],
Url = $"{data.Item1}{bucket}/{keys[i]}",
FormData = data.Item2,
};
}
return result;
}
后端 java
dto
import java.util.Map;
import lombok.Data; @Data
public class Upload {
private String key;
private String url;
private Map<String, String> formData;
}
多个key进行预签名, 和.net sdk不一样的地方在于minio 服务器地址需要加上http, 还有可以设置上传条件,如 addEqualsCondition("key", key),表示key必须为对应的值, addStartsWithCondition("content-type","image/") 表示content-type必须以image/开头,也就是只能上传图片。
public List<Upload> uploadFiles(String[] keys)
throws IOException, NoSuchAlgorithmException, InvalidKeyException {
List<Upload> uploads = new ArrayList<>();
String bucket = "myBucket";
String endPoint = "http://myminio.com:9000";
try {
MinioClient minioClient =
MinioClient.builder()
.endpoint(endPoint)
.credentials("ak", "sk")
.build();for (int i = 0; i < jsonArray.size(); i++) {
Upload upload = new Upload();
String key = keys[i];
PostPolicy policy = new PostPolicy(bucket, ZonedDateTime.now().plusHours(2));
policy.addEqualsCondition("key", key);
Map<String, String> formData = minioClient.getPresignedPostFormData(policy);
String url = endPoint + "/" + bucket +"/" + key;
upload.setKey(key);
upload.setUrl(url);
upload.setFormData(formData);
uploads.add(upload);
}
}catch (MinioException e) {
System.out.println("Error occurred: " + e);
}
return uploads;
}
小程序
Taro代码如下,如果是原生微信小程序则把Taro换为wx即可。 注意uploadFile参数里 name需要设置为file, formData里设置key为policy签名的key。 上传成功minio会返回204
1 let minioUrl = 'https://myminio.com:9000'
2 let minioPresignUrl = 'https://myminio.com:8000/files/presign';
3 Taro.chooseImage({
4 count: 1,
5 sizeType: ["original", "compressed"],
6 sourceType: ["album", "camera"],
7 success: async res=>{
8 let result = await Taro.request({url: minioPresignUrl, data: {keys:[res.tempFilePaths[0]]}});
9 result.data.data.forEach(f => {
10 f.formData.key = f.key;
11 Taro.uploadFile({
12 filePath:res.tempFilePaths[0] ,
13 name: "file",
14 url: minioUrl,
15 formData: f.formData,
16 success: r => {
17 if (r.statusCode === 204) {
18 console.log('上传成功');
19 }
20 }
21 });
22 })
23 }
24 })
Taro 微信小程序 上传文件到minio的更多相关文章
- 微信小程序上传文件遇到的坑
在开发小程序时,使用的花生壳做的内网映射,域名使用花生壳卖的https域名 在做小程序文件上传时,调用接口,老是报错. Caused by: org.apache.commons.fileupload ...
- 微信小程序上传文件时弹出当前系统代理不是安全代理,是否信任
我的开发环境是.net core 启用了https,而微信的开发者工具不认这个证书. 解决办法1:关闭https 然后在 Startup.cs 中关闭注释掉 app.UseHttpsRedirecti ...
- 微信小程序上传文件
wx.chooseImage({ count: 1, // 默认9 sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 sourc ...
- 微信小程序上传Excel文本文件功能
问题: 在开发过程中会发现微信小程序有很多功能都还不能满足我们的需求,谁叫客户就是上帝呢,前几天小编遇到了这么个问题,就是用微信小程序上传文件,但是还以为微信带有这个模块,可是查了许久还是没有找到,只 ...
- 微信小程序上传多张图片,及php后台处理
微信小程序上传多张图片,级小程序页面布局直接来代码index.wxml <view class='body' style='width:{{windowWidth}}px;height:{{wi ...
- 微信小程序上传与下载文件
需要准备的工作: ①.建立微信小程序工程,编写以下代码. ②.通过IDE建立springboot+web工程,编写接收文件以及提供下载文件的方式,并将上传的文件相关信息记录在mysql数据库中.具体请 ...
- 微信小程序上传后发布或者体验版测试无数据解决办法
在做微信小程序开发的过程中,发现小程序在本地调用接口的数据都显示,但是上传之后,发现手机体验没有数据.以下为解决办法: 1.先清除缓存试试. 2.打开微信小程序工具右上角的详情——项目设置,将“不校验 ...
- 微信小程序-上传照片-多张显示
图片就是一个简单的效果 实现 先看wxml和wxss代码 <view class='in-demand'> <view class='dema-title'> <text ...
- 微信小程序上传一或多张图片
一.要点 1.选取图片 wx.chooseImage({ sizeType: [], // original 原图,compressed 压缩图,默认二者都有 sourceType: [], // a ...
随机推荐
- Part 18 $http service in AngularJS
In Angular there are several built in services. $http service is one of them. In this video, we will ...
- 25.A Famous Music Composer
描述 Mr. B is a famous music composer. One of his most famous work was his set of preludes. These 24 p ...
- 1组-Alpha冲刺-1/6
一.基本情况 队名:震震带着六菜鸟 组长博客:https://www.cnblogs.com/Klein-Wang/p/15526531.html 小组人数:7人 二.冲刺概况汇报 王业震 过去两天完 ...
- 如何使用原生的Hystrix
什么是Hystrix 前面已经讲完了 Feign 和 Ribbon,今天我们来研究 Netflix 团队开发的另一个类库--Hystrix. 从抽象层面看,Hystrix 是一个保护器.它可以保护我们 ...
- VS2013中using System.Windows.Forms;引用不成功
命名空间"System"中不存在类型或命名空间名称"Windows" 项目右侧--解决资源管理器---引用---右键--添加引用---在.NET下拉框找---找 ...
- BootStrap中模态框踩坑
在模态框中使用html标签上的自定义属性来打开模态框后,在使用JS关闭模态框,就会出现多层蒙板问题 出现这个问题的原因就是没有仔细看bootstrap的官方文档,我人麻了,搞了好久 务必将模态框的 H ...
- [noi32]sort
先解释一下checker.cpp,它的判定标准是2e7,即答案超过2e7就认为代价过大了. 首先,很容易想到的办法是直接对其快排,从外到内交换区间即可,然而这样会被邪恶的出题人给卡掉(当然其实随便一组 ...
- 【IDEA】IntelliJ IDEA 2020.1破解版
IntelliJ IDEA 2020.1破解版 2020-09-09 14:58:56 by冲冲 安装链接: 1. 百度网盘下载地址链接:https://pan.baidu.com/s/1cxjz ...
- 学以致用 | Redis概念与简单实操
Redis概念 Redis是一个由C语言编写.基于key-value存储结构的开源NoSQL数据库,其读写速度为10万次/秒,这个速度已经远远大于传统的关系型数据库. 使用场景 在高并发的情况下,可将 ...
- 访问ajax请求后的结果
let getJPM = (function() { let result; let url ="xxx"; $.ajax({ type: "post", ur ...