Programme de sensibilisation Note:

De nombreux petits programmes pour fournir aux utilisateurs fonctionnalité de téléchargement d'image. A cette époque, l'utilisation de certains services de cloud computing « de stockage d'objets », est peut-être le choix le plus rapide et le plus économique.

Alors, comment utiliser un petit programme de tels services? Lors de l'utilisation, et quelles questions devraient y prêter attention?

Programme de sensibilisation (Micro Signal zxcx0101) aujourd'hui pour partager cet article service de stockage d'objets nuage Tencent, par exemple, vous enseigner l'accès applet service de stockage d'objets.

Wen | goodspeed

préparations

Téléchargez des photos, télécharger des images à base d'objets nuage principalement Tencent (COS).

Pour utiliser l'API de stockage d'objets, besoin d'effectuer les étapes suivantes:

 
• Acheter Tencent nuage objet services de stockage (COS).
• Créer une console de stockage d'objets nuage seau Tencent.
• Dans la console page "API personnel clé", get AppID, SecretID, SecretKey etc.
• Ecrire un programme d'algorithme de signature de la demande (ou utiliser un SDK du serveur)
• Le calcul d'une signature, les appels d'API pour effectuer l'opération

Nous devons donc faire des travaux préparatoires sont:

 
• nuage Tencent dans le site officiel (www.qcloud.com), compte enregistré.
• console journal service de stockage d'objets nuage (COS), l'ouverture des services COS, créer un besoin de ressources pour télécharger Bucket.
• En arrière-plan de l'applet de plate-forme publique, définissez les informations de nom de domaine lié (ou ne peut être entrepris dans ce nom de domaine dans la demande applet).

Le processus de configuration décrite ici ne, présente les prochaines étapes 4 et 5.

Télécharger des images de flux applet graphique à COS, comme suit:

Dans ce processus, nous devons réaliser que le retour du serveur d'authentification à la signature de l'étape, ainsi que d'un petit pas de traitement de programme images liées.

service d'authentification COS

Lorsque vous utilisez un service de stockage objet COS, Grâce à l'API RESTful, requête HTTP anonyme pour initier ou demande de signature de COS.

Pour toute demande de signature, serveur COS authentifiera l'initiateur de la demande.

 
• demandes anonymes: requête HTTP ne porte pas d'informations d'identité et d'authentification Effectuer une opération de requête HTTP par une API RESTful.
• Demande de signature: requête HTTP à ajouter une signature, côté serveur COS après réception du message, d'authentification, vérifiez que vous pouvez accepter avec succès et exécuter des demandes Ou il renvoie un message d'erreur et jeter la demande.

Tencent stockage en nuage objet COS, basé sur la clé HMAC (Hash Message Authentication Code) système HTTP personnalisé pour authentifier.

Dans cet exemple, télécharger des images est une demande de signature La nécessité d'une vérification de signature.

1. Le procédé de signature

les requêtes HTTP par la signature du client et transmet la demande signée à la signature de vérification procédure spécifique nuage Tencent illustré ci-dessous.

Nous avons développé à l'aide du SDK, vous avez seulement besoin d'une compréhension générale de ce processus sur la ligne. Est inclus dans le SDK pour obtenir la signature, nous avons seulement besoin d'appeler la méthode dans le SDK peut être.

En signant processus, nous pouvons savoir, la signature requise SecretId et SecretKey, Ces deux ne sont pas appropriés pour stocker des informations dans le client Ceci est la raison principale pour un déploiement du serveur d'authentification séparé.

2. Générer interface de signature

Dans l'article précédent, j'ai présenté ma génération Reste l'utilisation de l'API cadre Sanic et swagger_py_codegen sur le serveur.

Afin de compléter l'API de génération de signature, il faut ajouter l'API sont décrites dans pertinentes du document.

/ Qc_cos / config: get: Résumé: Description de configuration nuage Tencent: balises de configuration nuage Tencent:  operationId: paramètres de get_qc_cos_config: - ref $: '# / paramètres / AccessToken' - $ ref: '# / paramètres / qcos_path_in_query' réponses: 200: schéma: $ ref: '# / définitions / QCOSConfig' par défaut: Description: schéma d'erreur inattendue : $ ref: '# / définitions / erreur' sécurité: - OAuth2:

Cette interface nous avions besoin des appels de journalisation.

Après l'achèvement de la définition du document, appel swagger_py_codegen -s docs / v1.yml. -P apis -tlp Sanic générer des modèles de code. code API pour atteindre les résultats suivants:

de l'importation Authfrom import de qcloud_cos.cos_auth Authasync obtenir def (auto, demande): auth = Auth (appid = Config.QCOS_APPID, secret_id = Config.QCOS_SECRET_ID, secret_key = Config.QCOS_SECRET_KEY) a expiré = temps + 3600 # signature efficace du temps 3600 secondes cos seau # répertoire de téléchargement dir_name = request.raw_args.get ( 'de cos_path', '/ xrzeti') # génère signe de signature = auth.sign_more (Config.QCOS_BUCKET_NAME, cos_path = dir_name, a expiré = expiré) retour { " signe « : signe}, 200

parce que Tencent nuage COS supports Python SDK v4 que Python 2, mais Sanic nécessitent Python 3.5+ Par conséquent, ici je casquer un support supplémentaire pour Python 3, les développeurs Python utilisent 3, vous pouvez l'utiliser.

Regarder « programme connu » Numéro public micro-canal, répondre « source » pour obtenir le cadre Télécharger.

télécharger des images Applet

1. Sélectionnez une image

wx.chooseImage (Object) sélectionner une image à partir d'une caméra album photo local ou de l'utilisation pour prendre des photos.

Cette méthode est appelée, Applet choisira l'image dans un chemin temporaire, peut être utilisé normalement au cours de cette applet de démarrage .

Persister, devrait faire l'objet d'appeler wx.saveFile, petit pour accéder au prochain démarrage du programme.

Dans l'applet, Nous ne pouvons télécharger le chemin du fichier temporaire .

Le code de base est la suivante:

uploadToCos: fonction {var = que ce // wx.chooseImage sélectionné téléchargement d'image ({SizeType: , // image du type d'image d'origine, la compression par défaut comprimé Figure à la fois avoir du succès : function (res) {// obtenir le fichier de chemin du fichier var = res.tempFiles ; console.log (file.size); // obtenir le nom du fichier var = fileName file.path.match (/ (wxfile: \ / . \ /) (+) /) filename = fileName // chemin temporaire après l'obtention de l'image, pour spécifier un nom de fichier de la Ajoutée cos upload (file.path, nom de fichier que);}})}

Après avoir sélectionné des photos avec succès ici, nous prenons l'image téléchargée sur le COS.

2. Télécharger des photos

COS URL télécharger des images, couture par le cos_region, appid, bucket_name et les paramètres de cos_dir_name ensemble.

Les champs suivants sont configurés leurs informations relatives à la COS (Pour plus de détails, consultez la documentation API):

cosUrl = "https: //" + REGION + ".file.myqcloud.com / fichiers / v2 /" + APPID + "/" + BUCKET_NAME + DIR_NAME;

 
• Région: COS téléchargé
• APPID: compte appid
• BUCKET_NAME: COS Nom Bucket
• DIR_NAME: répertoire de téléchargement de fichiers

config var = require ( » ../ config.js'); // établissiez d'abord téléchargé URLvar cosUrl = "https: //" + config.cos_region + ".file.myqcloud.com / fichiers / v2 /" + config .cos_appid + "/" + config.cos_bucket_name + config.cos_dir_name; // remplir leur serveur d'authentification adresse var = cosSignatureUrl config.host + '? / v1 / qc_cos / config cos_path =' + config.cos_dir_name; / ** * Ajouter méthode * filePath: chemin du fichier de téléchargement * fileName: télécharger que le nom de fichier * cos: petit objet où la page courante programme * / upload fonction (filePath, fileName, que) {données var; // Get authentification signature wx.request ({url: cosSignatureUrl, en-tête: {autorisation: 'JWT' + '' + that.data.jwt.access_token}, le succès: function (cosRes) {// Récupère signature signature var = cosRes.data.sign // signature de la bande de tête, télécharger des fichiers vers le COS var = uploadTask wx.uploadFile ({url: cosUrl + '/' + fileName, filePath: filePath, en-tête: { 'autorisation': signature}, le nom: 'ContenuFichier' , formData: {op: 'upload'}, le succès: function (uploadRes) {// pour télécharger Après l'opération var = upload_res JSON.parse (uploadRes.data) fichiers var = that.data.files; files.push (upload_res.data.source_url); that.setData ({upload_res: upload_res, fichiers: fichiers, test_image: upload_res .data.source_url})}, échec: function (e) {console.log ( 'e', e)}}); // téléchargement barre de progression (uploadTask.onProgressUpdate (res) = >  {That.setData ({upload_progress: res.progress}) si (res.progress === 100) {that.setData ({upload_progress: 0})}})}}) des données de retour}

Applet fournit uploadTask.onProgressUpdate pour obtenir l'image la progression du téléchargement, alors voici je télécharger des photos de progression apparaît.

Enfin, grâce à l'appui de sa petite amie.

Adresse originale: https: //juejin.im/post/59a23fff518825244d204d9e

Regarder "programme connu" numéro public & # 128071;

 
• En réponse aux coulisses micro lettre " développer « Obtenez son ensemble complet d'expérience de développement d'applications.
• En réponse aux coulisses micro lettre " 666 « Acquérir démo petit développement du programme.