微信小程序上传阿里云

wx.chooseImage({sizeType:["compressed"],sourceType:["album"],success: function(res) {console.log("选择图片后的值为");console.log(res);console.log(res.tempFilePaths[0]);wx.uploadFile({url: "xxxxxxxxxxxxxxxxxxxx",filePath: res.tempFilePaths[0],//最后一张传入header: {"Content-Type": "multipart/form-data",},name: 'file',method: 'post',formData: {key:"xxxxxxxxxxxxxxxxxxxxxx",OSSAccessKeyId: "xxxxxxxxxxxxxxxxxxxxxxxxx",policy: "xxxxxxxxxxxxxxxxxxxxxx",signature: "xxxxxxxxxxxxxxxxxxxx",success_action_status:"200"},success: function (res) {console.log("上传图片后，阿里云返回的值为")console.log(res);},fail: function (res) {console.log("上传失败");console.log(res);}})},})

url：阿里云OSS的地址

OSSAccessKeyId，policy，signature如何获取呢？

点击这里下载应用服务器代码

下载好之后目录是这样的。（下图）

用浏览器打开 index.html 文件。（如下图）

点击 upload.js 文件，修改配置。

把上图选中的三个参数换成你自己的。

accessid,accesskey怎么获得？ --登录阿里云OSS平台查看

配置完成后，点击上传文件

然后打开开发者工具，可以按F12打开，也可以在web浏览器设置中打开（大部分都是浏览器右上角设置=>更多工具），打开network=>header 如下图，可以获取到服务器返回的OSSAccessKeyId，policy，signature值。

配置Bucket跨域访问

1. 登录OSS管理控制台。
2. 在左侧存储空间列表中，单击目标存储空间名称，打开该存储空间概览页面。
3. 单击基础设置页签，找到跨域设置区域，然后单击设置。
4. 单击创建规则，配置如下图所示。

配置外网域名到小程序的域名白名单

1. 登录OSS管理控制台。
2. 在左侧存储空间列表中，单击目标存储空间名称，打开该存储空间概览页面。
3. 在访问域名区域查看Bucket域名。
4. 登录微信小程序平台，配置小程序的上传域名白名单（注意：这一步操作的是微信小程序，需要登录微信公众平台配置）。

上传报错（返回400,403,405,204）

报错信息	解决方案
204	在formData: {}中添加 success_action_status:“200” 可以参考文章开篇的代码
400	添加上传的 Key 值，路径也要写正确，/images/test.png 为错误写法（最前面多了个斜杠），正确写法success images/test.png ；另外，阿里云OSS一次只允许上传一张照片。
403	检测 OSSAccessKeyId，policy，signature 是否填写正确； expiration已过期（详见下面）
405	URL中添加服务器地址 http://post-test.oss-cn-hangzhou.aliyuncs.com 而不能写成 http://post-test.oss-cn-hangzhou.aliyuncs.com/images/test.png这种形式

关于expiration过期的问题（403）

这个问题和下载的应用服务器代码有关。
如下图：

把未失效的policy，signature等值替换即可。

微信小程序上传阿里云OSS，返回204,400,403,405,解决方案相关推荐

微信小程序上传阿里云视频文件流程及代码
为了微信小程序客服端实现自拍视频能够分享给多个好友,我们需要把小程序自拍的视频存储到服务器,而阿里云在性能和速度上比较不错,所以我们选择了阿里云作服务器. 第一步.微信小程序项目创建 1. 到http ...
微信小程序录音直传阿里云OSS并语音识别
前言如题:做一个录音文字识别功能,知识点有三个,分别是微信小程序的录音功能.录音文件直传阿里云OSS.使用阿里云的录音文件识别接口返回识别后的文字一.微信小程序录音官方文档:微信小程序全局唯一的 ...
微信小程序上传图片到阿里云OSS
微信小程序代码 1.wxml: <image src="{{userInfo.headImg}}" class="user-head_img" bindt ...
微信开发图片上传阿里云 oss 服务器
在做微信开发时,我需要将图片上传至阿里云OSS,思路是服务端下载微信图片再转存至OSS. wx.chooseImage({count: 1, // 默认9sizeType: ['original', ...
微信小程序上传图片到阿里云oss方法
最近开发微信小程序要求上传图片到阿里云oss上,所以就顺手整理一下整个过程啦. 前提开通oss服务和创建oss存储空间啦(这个就自己去解决吧)下面接入正题: 步骤一:配置 Bucket 跨域客户端 ...
微信小程序上传文件到阿里OSS教程
前言 (一)开通OSS服务与新建Bucket 开通OSS服务这里省略,新建bucket. (二)设置Bucket属性,后台配置域名上传文件访问域名这里我们要在小程序后台配置上传域名(上面的域名是我 ...
NetCore多图片批量上传阿里云OSS，代码可以直接拿过来用
背景图片上传功能是web开发必不可少的功能.图片上传到哪里其实都是一个非常头疼的事情,多个文件源各种地址组合,经常会出现图片地址错误问题.自从前后端分离.小程序.app成为流行后,大家一般都会将文件 ...
文件分片上传阿里云OSS
本文参考其他博客并结合自身编写博客原作者:程序猿谢哥哥博客原地址:https://blog.csdn.net/weixin_42825651/article/details/108792264 注 ...
java利用iText写pdf并上传阿里云OSS并下载
iText是用于生成pdf的一个类库,通过它可以生成pdf或者将XML , HTML转换城pdf模版:阿里云的oss对象存储存储的类型比较多了,可以存储音频图片 pdf excel 等资源,oss本 ...

微信小程序上传阿里云OSS，返回204,400,403,405,解决方案

目录