Enregistrer dans PixelDrop Bêta
Permettez aux gens qui utilisent votre site ou votre application d'enregistrer un fichier directement dans leur propre PixelDrop. Une balise script, un appel.
Bêta : cet outil est nouveau. Les options peuvent changer, et vos commentaires aident à le façonner. Des questions ou des idées ? Écrivez à [email protected].
- L'ajouter
- L'essayer
- Choisir un fichier
- Ce que voit la personne
- Ce que reçoit votre page
- S'enregistrer et obtenir le badge
- Recevoir des fichiers dans votre application
L'ajouter
<script src="https://pixeldrop.ca/sdk.js"></script>
<button id="save">Save to PixelDrop</button>
<script>
document.getElementById("save").onclick = function () {
PixelDrop.save(myFileOrBlob, { name: "report.pdf" })
.then(function (saved) { console.log("saved", saved.id, saved.folder); })
.catch(function (err) { console.log("not saved:", err.code); });
};
</script>
Options : name (le nom du fichier) et folder (par défaut, le fichier va dans un dossier au nom de votre site ; donnez un court texte pour nommer le dossier vous-même, ou false pour l'enregistrer en vrac parmi les fichiers de la personne).
Appelez PixelDrop.save() depuis un clic : le navigateur n'ouvre la fenêtre PixelDrop que pour un clic. Le fichier peut être un File, un Blob, ou une fonction qui en retourne un (ou une promesse).
L'essayer
Choisissez un fichier, puis appuyez sur le bouton. Il faut un compte PixelDrop Membre, avec votre compte Pixeldrain connecté.
Les laisser choisir un fichier dans leur PixelDrop
PixelDrop.pick({ hours: 168 })
.then(function (file) { console.log(file.name, file.url); })
.catch(function (err) { console.log("not chosen:", err.code); });
Une fenêtre montre à la personne ses propres fichiers ; elle en choisit un (ou plusieurs avec multiple: true). Votre application reçoit { id, name, size, url, expires_at } : un lien vers le fichier, valable hours heures (de 1 à 720, 168 par défaut). Elle ne reçoit jamais le contenu du fichier autrement que par ce lien, ni rien d'autre du compte. Erreurs : popup_blocked, cancelled, not_member, no_files, failed.
Ce que voit la personne
Une petite fenêtre pixeldrop.ca s'ouvre. La personne se connecte si nécessaire et lit : « votre-site.com veut enregistrer un fichier dans votre PixelDrop », avec le nom et la taille du fichier. Elle appuie sur Enregistrer. Le fichier va dans son PixelDrop, dans un dossier au nom de votre site (vous pouvez nommer le dossier vous-même, ou l'enregistrer en vrac). Rien n'est partagé avec personne.
Le nom du site vient du navigateur, pas de votre code : aucune page ne peut se faire passer pour une autre. Les gens voient et retirent les sites utilisés dans Réglages → Applications connectées.
Ce que reçoit votre page
PixelDrop.save() retourne une promesse qui se résout en { id, name, size, folder }. Votre page ne reçoit jamais de clé, de jeton ni d'accès au compte : seulement le résultat.
code d'erreur | Signification |
|---|---|
popup_blocked | Le navigateur a bloqué la fenêtre. Appelez save() directement depuis un clic. |
cancelled | La personne a fermé la fenêtre ou appuyé sur Annuler. |
not_member | Enregistrer depuis d'autres sites demande un abonnement PixelDrop Membre (l'essai gratuit compte). |
too_large | Sans l'extension de navigateur PixelDrop, les fichiers de plus de 25 Mo ne peuvent pas être enregistrés. Avec elle, toutes les tailles. |
failed | Tout le reste ; err.message dit quoi. |
- Ça fonctionne sur tout site
https(et surlocalhostpendant que vous développez). - Avec l'extension de navigateur PixelDrop, le fichier va directement du navigateur au Pixeldrain de la personne, sans limite de taille. Sans elle, les fichiers jusqu'à 25 Mo passent par le serveur de PixelDrop.
- La personne ne paie rien de plus et vous non plus : PixelDrop ne stocke rien lui-même, le fichier vit dans son propre compte Pixeldrain.
- Dans la fenêtre de confirmation, la personne peut cocher « Toujours autoriser ce site à enregistrer ici » : les enregistrements de votre site démarrent alors d'eux-mêmes après un compte à rebours de 3 secondes, avec un bouton Annuler, jusqu'à ce qu'elle retire votre site dans les Réglages.
Enregistrez votre application et obtenez le badge « Vérifiée »
Un site non enregistré apparaît dans la fenêtre comme « Ce site n'est pas enregistré auprès de PixelDrop ». Enregistrez-le : les gens voient son nom et, une fois qu'on l'a examiné, un badge vert ✓ Application vérifiée.
- Connectez-vous, puis ouvrez Réglages → Pour les développeurs. Entrez le nom de votre application et l'adresse de votre site (
https://votre-site.com). - PixelDrop vous donne une ligne de texte. Publiez un fichier texte à l'adresse
https://votre-site.com/.well-known/pixeldrop-verify.txtcontenant exactement cette ligne. - Appuyez sur Vérifier maintenant. PixelDrop lit le fichier une fois, en https, sans suivre de redirection. Quand il correspond, votre site est prouvé et son nom s'affiche.
- Nous examinons ensuite l'application et l'approuvons : le badge apparaît. Vous pouvez retirer votre application à tout moment.
Permettre aux gens d'envoyer des fichiers à votre application
Une fois votre site prouvé, vous pouvez y ajouter une adresse de réception (Réglages → Pour les développeurs). Les personnes qui ont déjà enregistré depuis votre site voient alors votre application sous Envoyer vers… sur chaque fichier. Quand elles la choisissent, PixelDrop envoie un petit message JSON à votre adresse :
{ "event": "file.shared", "id": "…", "time": "2026-10-16T20:00:00Z",
"file": { "name": "report.pdf", "size": 1234, "sha256": "…", "url": "https://pixeldrop.ca/s/…" },
"expires_at": "…", "max_downloads": 3 }
Le lien fonctionne 24 heures et 3 téléchargements. Le message ne dit rien de la personne : ni nom, ni courriel, ni compte. Il est signé pour que vous sachiez qu'il vient de PixelDrop. L'en-tête est X-PixelDrop-Signature: t=<secondes unix>,v1=<hex>, où v1 est le HMAC-SHA256 de <t>.<corps brut> avec votre secret (affiché dans les Réglages). Vérifiez-le et refusez un t vieux de plus de quelques minutes. Répondez par n'importe quel statut 2xx pour accepter ; autre chose indique à la personne que l'application n'a pas accepté le fichier.
const sig = req.headers["x-pixeldrop-signature"]; // t=...,v1=...
const [t, v1] = sig.split(",").map(x => x.split("=")[1]);
const ok = crypto.createHmac("sha256", SECRET).update(t + "." + rawBody).digest("hex") === v1
&& Math.abs(Date.now()/1000 - Number(t)) < 300;
L'adresse doit être sur votre propre site (même hôte, https, sans port). PixelDrop l'appelle depuis son serveur et n'atteint jamais d'adresse privée ou interne.