qiniu wxapp sdk
1.0.0
WeChat Mini Program SDK développé sur la base de l'API Qiniu Cloud
Qiniu-wxapp-SDK est l'implémentation de Qiniu Cloud sur le mini programme. Les fonctions réseau s'appuient sur l'API du mini programme WeChat. Vous pouvez facilement télécharger des fichiers sur Qiniu Cloud dans le mini programme basé sur le SDK.
Qiniu-wxapp-SDK est un SDK client et n'inclut pas l'implémentation de la génération de jetons. Pour des raisons de sécurité, il est recommandé d'obtenir le jeton du serveur via le réseau. Pour le code de génération spécifique, veuillez vous référer à la documentation suivante du SDK du serveur. Cette partie n'est actuellement pas incluse dans la démo du SDK.
D'autres fonctionnalités sont en cours de développement, alors restez à l'écoute.
Téléchargez qiniuUploader.js depuis github et importez le mini-projet de programme.
Avant d'utiliser le SDK, vous devez d'abord enregistrer un compte Qiniu Cloud et vous connecter à la console pour obtenir une paire de AccessKey et SecretKey valides. Vous pouvez lire Comment accéder à Qiniu et au mécanisme de sécurité pour en savoir plus sur la façon d'utiliser et de gérer correctement les clés. .
Le SDK s'appuie sur le serveur pour émettre le jeton, ce qui peut être réalisé des deux manières suivantes :
Vous devez savoir dans quelle région se trouve votre存储空间Qiniu, comme la Chine orientale, la Chine méridionale, etc., voir Paramètres régionaux.
Le service backend doit fournir une adresse URL pour que l'applet puisse demander l'adresse et obtenir le jeton. Une fois la requête réussie, le serveur doit renvoyer json au format suivant (y compris au moins le champ uptoken) :
{
"uptoken": "0MLvWPnyya1WtPnXFy9KLyGHyFPNdZceomL..."
}
Selon l'存储空间Qiniu que vous avez créé, ajoutez l'adresse de téléchargement https correspondante à la liste blanche d'accès du mini programme. La méthode est la suivante :
- Connectez-vous à la plateforme publique WeChat, accédez à Paramètres - Paramètres de développement et cliquez sur le lien « Modifier » sous Configuration du serveur .
- Modifiez le nom de domaine uploadFile (par exemple, l'adresse de téléchargement https de la Chine orientale est :
https://up.qiniup.com. Si vous ne savez pas quoi écrire dans l'adresse, veuillez vous référer à l'annexe d'adresse https)- Si vous devez télécharger un fichier, vous devez également définir le nom de domaine downloadFile comme adresse de téléchargement de compartiment.
- Enregistrez-le simplement
| Nom du champ | contenu |
|---|---|
| demander un nom de domaine | https://votreServce.com |
| nom de domaine uploadFile | https://up.qiniup.com (à renseigner selon la zone de stockage) |
| Nom de domaine du fichier de téléchargement | https://baldkf.bkt.clouddn.com |
Interface de téléchargement de fichiers Qiniu Cloud, les fichiers sont transférés vers l'interface correspondante et la zone de stockage correspond à l'adresse HTTPS. Veuillez vous référer à la documentation officielle.
| zone de stockage | indicatif régional | Adresse HTTPS |
|---|---|---|
| Chine orientale | ECN | https://up.qiniup.com |
| Chine du Nord | NCN | https://up-z1.qiniup.com |
| Chine du Sud | RCS | https://up-z2.qiniup.com |
| Amérique du Nord | N / A | https://up-na0.qiniup.com |
| Singapour | ASG | https://up-as0.qiniup.com |
Remarque !! WeChat limite actuellement la liste blanche des noms de domaine à seulement trois modifications par mois.
Prend temporairement en charge une méthode d'installation
Cloner le référentiel directement
git clone https://github.com/gpake/qiniu-wxapp-sdk.git
Les fichiers qiniuUploader.js et qiniuUploader.ts se trouvent dans le répertoire SDK de ce projet.
Il est recommandé de se référer à l'utilisation de la démo et de commencer par télécharger les événements liés aux boutons de l'interface utilisateur sur la page index.wxml de la démo. Les commentaires sont très détaillés.
const qiniuUploader = require ( "../../../utils/qiniuUploader" ) ; const qiniuUploader = require ( "../../utils/qiniuUploader" ) ;
// index.js
// 初始化七牛云相关配置
function initQiniu ( ) {
var options = {
// bucket所在区域，这里是华北区。ECN, SCN, NCN, NA, ASG，分别对应七牛云的：华东，华南，华北，北美，新加坡 5 个区域
region : 'NCN' ,
// 获取uptoken方法三选一即可，执行优先级为：uptoken > uptokenURL > uptokenFunc。三选一，剩下两个置空。推荐使用uptokenURL，详情请见 README.md
// 由其他程序生成七牛云uptoken，然后直接写入uptoken
uptoken : '' ,
// 从指定 url 通过 HTTP GET 获取 uptoken，返回的格式必须是 json 且包含 uptoken 字段，例如： {"uptoken": "0MLvWPnyy..."}
uptokenURL : 'https://[yourserver.com]/api/uptoken' ,
// uptokenFunc 这个属性的值可以是一个用来生成uptoken的函数，详情请见 README.md
uptokenFunc : function ( ) {
// do something
return qiniuUploadToken ;
} ,
// bucket 外链域名，下载资源时用到。如果设置，会在 success callback 的 res 参数加上可以直接使用的 fileURL 字段。否则需要自己拼接
domain : 'http://[yourBucketId].bkt.clouddn.com' ,
// qiniuShouldUseQiniuFileName 如果是 true，则文件的 key 由 qiniu 服务器分配（全局去重）。如果是 false，则文件的 key 使用微信自动生成的 filename。出于初代sdk用户升级后兼容问题的考虑，默认是 false。
// 微信自动生成的 filename较长，导致fileURL较长。推荐使用{qiniuShouldUseQiniuFileName: true} + "通过fileURL下载文件时，自定义下载名" 的组合方式。
// 自定义上传key 需要两个条件：1. 此处shouldUseQiniuFileName值为false。 2. 通过修改qiniuUploader.upload方法传入的options参数，可以进行自定义key。（请不要直接在sdk中修改options参数，修改方法请见demo的index.js）
// 通过fileURL下载文件时，文件自定义下载名，请参考：七牛云“对象存储 > 产品手册 > 下载资源 > 下载设置 > 自定义资源下载名”（https://developer.qiniu.com/kodo/manual/1659/download-setting）。本sdk在README.md的"常见问题"板块中，有"通过fileURL下载文件时，自定义下载名"使用样例。
shouldUseQiniuFileName : false
} ;
// 将七牛云相关配置初始化进本sdk
qiniuUploader . init ( options ) ;
}
//获取应用实例
var app = getApp ( )
Page ( {
data : {
// 图片上传（从相册）返回对象。上传完成后，此属性被赋值
imageObject : { } ,
// 文件上传（从客户端会话）返回对象。上传完成后，此属性被赋值
messageFileObject : { } ,
// 图片上传（从相册）进度对象。开始上传后，此属性被赋值
imageProgress : { } ,
// 文件上传（从客户端会话）进度对象。开始上传后，此属性被赋值
messageFileProgress : { } ,
// 文件在线查看来源fileUrl
viewFileOnlineFileUrl : '' ,
// 文件下载进度对象。用于文件在线查看前的预下载
downloadFileProgress : { } ,
// 此属性在qiniuUploader.upload()中被赋值，用于中断上传
cancelTask : function ( ) { }
} ,
//事件处理函数
onLoad : function ( ) {
console . log ( 'onLoad' ) ;
var that = this ;
} ,
// 图片上传（从相册）方法
didPressChooesImage : function ( ) {
var that = this ;
didPressChooesImage ( that ) ;
} ,
// 文件上传（从客户端会话）方法，支持图片、视频、其余文件 (PDF(.pdf), Word(.doc/.docx), Excel(.xls/.xlsx), PowerPoint(.ppt/.pptx)等文件格式)
didPressChooesMessageFile : function ( ) {
var that = this ;
didPressChooesMessageFile ( that ) ;
} ,
// 在线查看文件，支持的文件格式：pdf, doc, docx, xls, xlsx, ppt, pptx。关于wx.openDocument方法，详情请参考微信官方文档：https://developers.weixin.qq.com/miniprogram/dev/api/file/wx.openDocument.html
didPressViewFileOnline : function ( ) {
var that = this ;
didPressViewFileOnline ( that ) ;
} ,
// 中断上传方法
didCancelTask : function ( ) {
this . data . cancelTask ( ) ;
}
} ) ;
// 图片上传（从相册）方法
function didPressChooesImage ( that ) {
// 详情请见demo部分 index.js
}
// 文件上传（从客户端会话）方法，支持图片、视频、其余文件 (PDF(.pdf), Word(.doc/.docx), Excel(.xls/.xlsx), PowerPoint(.ppt/.pptx)等文件格式)
function didPressChooesMessageFile ( that ) {
// 详情请见demo部分 index.js
}
// 在线查看文件，支持的文件格式：pdf, doc, docx, xls, xlsx, ppt, pptx。关于wx.openDocument方法，详情请参考微信官方文档：https://developers.weixin.qq.com/miniprogram/dev/api/file/wx.openDocument.html
function didPressViewFileOnline ( that ) {
// 详情请见demo部分 index.js
} // 请先参照微信小程序开发文档配置 TypeScript 支持
import { upload } from 'qiniuUploader.ts' ;
Page ( {
didPressChooseImage : function ( ) {
wx . chooseImage ( {
count : 1 ,
success : function ( res ) {
var filePath = res . tempFilePaths [ 0 ] ;
upload ( {
filePath : filePath ,
options : {
key : '' , // 可选
region : '' , // 可选(默认为'ECN')
domain : '' ,
uptoken : '' , // 以下三选一
uptokenURL : '' ,
uptokenFunc : ( ) => {
return '[yourTokenString]' ;
} ,
shouldUseQiniuFileName : true // 默认true
} ,
before : ( ) => {
// 上传前
console . log ( 'before upload' ) ;
} ,
success : ( res ) => {
that . setData ( {
'imageObject' : res
} ) ;
console . log ( 'file url is: ' + res . fileUrl ) ;
} ,
fail : ( err ) => {
console . log ( 'error:' + err ) ;
} ,
progress : ( res ) => {
console . log ( '上传进度' , res . progress )
console . log ( '已经上传的数据长度' , res . totalBytesSent )
console . log ( '预期需要上传的数据总长度' , res . totalBytesExpectedToSend )
} ,
complete : ( err ) => {
// 上传结束
console . log ( 'upload complete' ) ;
}
} ) ;
}
} ) ;
}
} )Veuillez utiliser les outils de développement Web WeChat pour ouvrir le dossier de démonstration, puis configurer les paramètres pertinents dans index.js pour utiliser la démo.
var options = {
// bucket所在区域，这里是华北区。ECN, SCN, NCN, NA, ASG，分别对应七牛云的：华东，华南，华北，北美，新加坡 5 个区域
region : 'NCN' ,
// 获取uptoken方法三选一即可，执行优先级为：uptoken > uptokenURL > uptokenFunc。三选一，剩下两个置空。推荐使用uptokenURL，详情请见 README.md
// 由其他程序生成七牛云uptoken，然后直接写入uptoken
uptoken : '' ,
// 从指定 url 通过 HTTP GET 获取 uptoken，返回的格式必须是 json 且包含 uptoken 字段，例如： {"uptoken": "0MLvWPnyy..."}
uptokenURL : 'https://[yourserver.com]/api/uptoken' ,
// uptokenFunc 这个属性的值可以是一个用来生成uptoken的函数，详情请见 README.md
uptokenFunc : function ( ) {
// do something
return qiniuUploadToken ;
} ,
// bucket 外链域名，下载资源时用到。如果设置，会在 success callback 的 res 参数加上可以直接使用的 fileURL 字段。否则需要自己拼接
domain : 'http://[yourBucketId].bkt.clouddn.com' ,
// qiniuShouldUseQiniuFileName 如果是 true，则文件的 key 由 qiniu 服务器分配（全局去重）。如果是 false，则文件的 key 使用微信自动生成的 filename。出于初代sdk用户升级后兼容问题的考虑，默认是 false。
// 微信自动生成的 filename较长，导致fileURL较长。推荐使用{qiniuShouldUseQiniuFileName: true} + "通过fileURL下载文件时，自定义下载名" 的组合方式。
// 自定义上传key 需要两个条件：1. 此处shouldUseQiniuFileName值为false。 2. 通过修改qiniuUploader.upload方法传入的options参数，可以进行自定义key。（请不要直接在sdk中修改options参数，修改方法请见demo的index.js）
// 通过fileURL下载文件时，文件自定义下载名，请参考：七牛云“对象存储 > 产品手册 > 下载资源 > 下载设置 > 自定义资源下载名”（https://developer.qiniu.com/kodo/manual/1659/download-setting）。本sdk在README.md的"常见问题"板块中，有"通过fileURL下载文件时，自定义下载名"使用样例。
shouldUseQiniuFileName : false
} ;
// 图片上传（从相册）方法
function didPressChooesImage ( that ) {
// 详情请见demo部分 index.js
}
// 文件上传（从客户端会话）方法，支持图片、视频、其余文件 (PDF(.pdf), Word(.doc/.docx), Excel(.xls/.xlsx), PowerPoint(.ppt/.pptx)等文件格式)
function didPressChooesMessageFile ( that ) {
// 详情请见demo部分 index.js
}
// 在线查看文件，支持的文件格式：pdf, doc, docx, xls, xlsx, ppt, pptx。关于wx.openDocument方法，详情请参考微信官方文档：https://developers.weixin.qq.com/miniprogram/dev/api/file/wx.openDocument.html
function didPressViewFileOnline ( that ) {
// 详情请见demo部分 index.js
}La zone de stockage de l'espace de stockage peut être sélectionnée lors de la création de l'espace de stockage.
Le SDK s'appuie sur uptoken , qui peut être défini directement, en fournissant l'adresse de requête Ajax uptokenURL , ou en fournissant une fonction uptokenFunc qui peut renvoyer uptoken.
var options = {
// bucket所在区域，这里是华北区。ECN, SCN, NCN, NA, ASG，分别对应七牛云的：华东，华南，华北，北美，新加坡 5 个区域
region : 'NCN' ,
// 获取uptoken方法三选一即可，执行优先级为：uptoken > uptokenURL > uptokenFunc。三选一，剩下两个置空。推荐使用uptokenURL，详情请见 README.md
// 由其他程序生成七牛云uptoken，然后直接写入uptoken
uptoken : '' ,
// 从指定 url 通过 HTTP GET 获取 uptoken，返回的格式必须是 json 且包含 uptoken 字段，例如： {"uptoken": "0MLvWPnyy..."}
uptokenURL : 'https://[yourserver.com]/api/uptoken' ,
// uptokenFunc 这个属性的值可以是一个用来生成uptoken的函数，详情请见 README.md
uptokenFunc : function ( ) {
// do something
return qiniuUploadToken ;
} ,
// bucket 外链域名，下载资源时用到。如果设置，会在 success callback 的 res 参数加上可以直接使用的 fileURL 字段。否则需要自己拼接
domain : 'http://[yourBucketId].bkt.clouddn.com' ,
// qiniuShouldUseQiniuFileName 如果是 true，则文件的 key 由 qiniu 服务器分配（全局去重）。如果是 false，则文件的 key 使用微信自动生成的 filename。出于初代sdk用户升级后兼容问题的考虑，默认是 false。
// 微信自动生成的 filename较长，导致fileURL较长。推荐使用{qiniuShouldUseQiniuFileName: true} + "通过fileURL下载文件时，自定义下载名" 的组合方式。
// 自定义上传key 需要两个条件：1. 此处shouldUseQiniuFileName值为false。 2. 通过修改qiniuUploader.upload方法传入的options参数，可以进行自定义key。（请不要直接在sdk中修改options参数，修改方法请见demo的index.js）
// 通过fileURL下载文件时，文件自定义下载名，请参考：七牛云“对象存储 > 产品手册 > 下载资源 > 下载设置 > 自定义资源下载名”（https://developer.qiniu.com/kodo/manual/1659/download-setting）。本sdk在README.md的"常见问题"板块中，有"通过fileURL下载文件时，自定义下载名"使用样例。
shouldUseQiniuFileName : false
} ;Si vous souhaitez en savoir plus sur la stratégie de téléchargement de Qiniu, il est recommandé de lire attentivement la documentation officielle de Qiniu - Upload. La stratégie de téléchargement de Qiniu est spécifiée dans le service back-end.
Par exemple : Qiniuyun Java SDK a mentionné que les variables magiques peuvent spécifier qu'après le téléchargement d'un fichier, l'objet renvoyé contient des champs : taille du fichier fsize , type de fichier mimeType etc.
Si vous souhaitez en savoir plus sur le traitement d'image de Qiniu, il est recommandé de lire attentivement la documentation officielle de Qiniu - Traitement d'image
Lorsque l'exemple du SDK génère uptotken, le Bucket Name spécifié est un espace public, de sorte que les ressources après un téléchargement réussi sont accessibles publiquement. Si Bucket Name spécifié lors de la génération du jeton uptoken est un espace privé, vous devrez effectuer un traitement supplémentaire sur le serveur pour accéder aux ressources que vous avez téléchargées. Pour plus de détails, voir Téléchargement de certificats. Certaines fonctions de traitement des données du SDK ne sont pas applicables aux espaces privés.
À propos du téléchargement des clés
Si la clé du fichier n'est pas spécifiée lors du téléchargement, le tmp filePath obtenu par wx.chooesImage sera utilisé comme clé du fichier. Par exemple : tmp_xxxxxxx.jpg .
Alternativement, vous pouvez utiliser la clé attribuée par le serveur qiniu (déduplication globale). Par exemple : Fh6qfpY... (méthode recommandée)
Le nom de fichier généré automatiquement par WeChat est plus long, ce qui entraîne une URL de fichier plus longue. Il est recommandé d'utiliser la combinaison {qiniuShouldUseQiniuFileName: true} + "Lors du téléchargement de fichiers via fileURL, personnalisez le nom de téléchargement".
Pour plus de détails, veuillez consulter shouldUseQiniuFileName dans le index.js de la démo et l'attribut qiniuShouldUseQiniuFileName dans le SDK.
Configurer pour annuler le téléchargement et suspendre le téléchargement :
Veuillez consulter la section démo, data.cancelTask dans index.js . La méthode cancelTask dans qiniuUploader.js du sdk.
De plus, la page de démonstration propose une démonstration d'interface utilisateur qui interrompt le téléchargement.
Limitez les types de fichiers téléchargés :
Prend en charge les fichiers image, les fichiers vidéo et autres fichiers (PDF (.pdf), Word (.doc/.docx), Excel (.xls/.xlsx), PowerPoint (.ppt/.pptx) et autres formats de fichiers).
La page index.wxml dans la section démo contient des démonstrations d'interface utilisateur pour le téléchargement d'images (à partir de l'album) et le téléchargement de fichiers (à partir de la session client).
Lors du téléchargement de fichiers via fileURL, personnalisez le nom du téléchargement
Veuillez vous référer à : Qiniu Cloud « Stockage d'objets > Manuel produit > Ressources de téléchargement > Paramètres de téléchargement > Nom de téléchargement de ressources personnalisées » (https://developer.qiniu.com/kodo/manual/1659/download-setting) Par exemple : fileUrl est http://xxx.com/keyyyyy , ouvrez le fichier téléchargé à partir de ce lien directement dans le navigateur, le nom du fichier est "keyyyyy".
Si vous souhaitez personnaliser le nom du fichier téléchargé en tant que "myName", vous pouvez le télécharger via : http://xxx.com/keyyyyy?attname=myName , c'est-à-dire "fileUrl" + "?attname=" + " nom de fichier personnalisé" Way.
Connectez-vous à https://github.com
Fork [email protected]:gpake/qiniu-wxapp-sdk.git
Créez votre branche de fonctionnalités (git checkout -b new-feature)
Validez vos modifications (git commit -am 'Ajout de certaines fonctionnalités ou correction d'un bug')
Soumettez votre enregistrement de modification au référentiel git distant (nouvelle fonctionnalité git push origin)
Accédez ensuite au site Web de github et lancez une Pull Request sous la branche des nouvelles fonctionnalités du référentiel distant git.
LICENCE GPL V3
