前端阿里云OSS直传,微信小程序版本

前言:

网络上许多的文章资料,全是使用阿里云官方的SDK,ali-oss插件去做直传。可是各位素未谋面的朋友要注意,这个SDK它支持web环境使用,也就是PC端浏览器

项目环境切换到微信小程序,是无法使用这种方式的,当然官方也有给出微信小程序直传的文档,继续往下看。

支持配置OSS直传的callback参数,这是其它文章中没用到的


官方:如何使用ali-oss进行直传icon-default.png?t=N4P3https://help.aliyun.com/document_detail/64041.html?spm=a2c4g.383954.0.0.43c25e89vo4jkS

官方:微信小程序OSS直传icon-default.png?t=N4P3https://help.aliyun.com/document_detail/92883.html?spm=a2c4g.31925.0.0.24de344egXVqTI

代码:

酒过三巡我还是少说话,多贴代码。并且把一些踩坑的地方告诉大家。继续往下看。

首先需要下载三个库。

注意:官方文档是让我们使用import { Base64 } from 'js-base64';   
可是它会它会报错!!!根本用不了。
所以需要换成import base64 from 'base-64';import utf8 from 'utf8'

npm install crypto-js --save

npm install base-64 --save

npm install utf8 --save


crypto-js:是阿里官方的签名库
base-64、utf8:是用来转码,配合crypto-js使用的


签名不都是后端的事情吗?没错大部分是后端。

但是我在官方文档看到客户端也可以签名,然后这么随口一说。

我亲爱的后端同事便说:客户端(前端)也可以签名,那就你自己签名吧。

配置callback(可选,根据后端要求来决定是否需要)

为什么需要使用callback,这就是后端的骚操作。
他要我们把文件顺利传到OSS后,再让OSS去请求他的接口。
他接口会去做一些业务逻辑,比如改文件的重命名。

而callback则是配置,后端处理业务逻辑的接口地址、接请求参数。


直传OSS配置callback是有格式要求的,并且微信小程序端、web端,callback的配置格式要求还不一样。
这里可能是因为用户们很少用到callback参数,官方文档写得也不准确。
大家按照我代码来,指定是没问题的,细节我不想说了,有问题评论区交流。

import crypto from 'crypto-js'
import base64 from 'base-64'
import utf8 from 'utf8'


你可能感兴趣的:(前端记录,阿里云,OSS直传,微信小程序,uniapp)