2 votes

Télécharger vers AWS S3 avec des informations d'identification temporaires en JavaScript

Je travaille sur l'upload de fichiers vers un bucket S3 en utilisant des identifiants temporaires reçus d'AWS Cognito et je commence à être frustré. J'ai accès au access-token mais je me perds en essayant d'initialiser le client AWS S3. Actuellement, je stocke le fichier access-token y idToken dans un biscuit (mais cela va changer).

Lorsque j'arrive sur ma page de téléchargement, j'ai une entrée de fichier et un bouton de téléchargement de fichier et je veux télécharger le fichier lorsque le bouton est pressé... mais je n'arrive pas à comprendre comment faire et je me sens vraiment, vraiment, stupide en parcourant la documentation en vain.

Voici mon code jusqu'à présent :

(function(){
    var fileSource = $("#fileSource");
    fileSource.on("change", function(){
        var filePath = $(this).val().split("\\");
        $("#upload-file-info").html(filePath[filePath.length - 1]);
    });
    console.log("accessToken", accessToken);
    console.log("idToken", idToken);
    AWS.config.region = Region;
    var bucket = new AWS.S3({
        params: {
            Bucket: bucketName + "/" + idToken["cognito:username"]
        }
    });
    console.log(bucket);
    $("#uploadButton").on("click", function(){
        if(!window.FileReader){
            return alert("FileReader API is not supported by your browser.");
        }
        var input = fileSource[0];
        if(input.files && input.files[0]){
            file = input.files[0];
            fr = new FileReader();
            fr.onload = function () {
                var objKey = bucketName + "/" + idToken["cognito:username"] + '/' + file.name;
                var params = {
                    Key: objKey,
                    ContentType: file.type,
                    Body: file
                };
                console.log(params);
                bucket.putObject(params, function (err, data) {
                    if (err) {
                        console.log("arguments", arguments)
                    } else {
                        console.log("arguments", arguments)
                    }
                });
            };
            fr.readAsDataURL( file );
        } else {
            alert("File not selected or browser incompatible.")
        }
    });
})();

bucketName est défini dans un autre fichier, de même que la méthode de récupération et de décodage des cookies.

Si quelqu'un pouvait m'indiquer la bonne direction, je lui en serais reconnaissant, car je sais qu'il me manque quelque chose ! Même un pointeur vers un repo où quelqu'un a réussi à faire fonctionner cela serait utile.

(J'aime l'idée de ce truc sans serveur, mais c'est un casse-tête de changer de paradigme comme ça).

1voto

annoyingmouse Points 3761

J'ai trouvé une grande partie de ma réponse à cette question tout en continuant à me creuser les méninges. la documentation . En fait, le SDK Javascript place la plupart des éléments dont j'ai besoin dans le stockage local, ce qui évite d'avoir à manipuler des cookies (je ne l'ai constaté qu'après m'être éloigné des cookies et avoir utilisé le stockage local pour moi-même, ainsi qu'après avoir inspecté le stockage local ;-)). ). Je n'y suis pas encore arrivé, mais j'ai fait des progrès et il se peut que je pose une autre question plus tard.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X