Aktualisieren eines Bildes mit der paperlesspaper API

Manchmal möchte man einfach nur das Bild auf einem ePaper-Bildschirm austauschen: keine komplizierten Abläufe, keine signierten URLs, keine zusätzlichen Metadaten. Dieses Tutorial zeigt den einfachsten Weg, um ein neues Bild hochzuladen mit der paperlesspaper API über:

• Bild hochladen: POST /papers/uploadSingleImage/:paperId

Wir konzentrieren uns auf den Einzelbild-Upload Ablauf von Anfang bis Ende: Ziel auswählen, Datei hochladen und Ergebnis überprüfen.

Was Sie benötigen

• Die API-Basis-URL:
  https://api.memo.wirewire.de/v1
• API-Schlüssel (x-api-key: ...)
• Eine paperId
• Eine lokale Bilddatei (PNG funktioniert am besten)

Den API-Schlüssel erhalten

Besuchen Sie die API-Dokumentation um zu erfahren, wie man einen API-Schlüssel generiert.

Hochladen auf ein Paper (Bildschirmeintrag)

Um die ID des Bildes/der Seite (wir nennen sie paper) zu erhalten, die Sie aktualisieren möchten, besuchen Sie eines Ihrer verfügbaren Bilder. Der letzte Teil der URL im Editor ist die paperId.

Endpunkt POST /papers/uploadSingleImage/:paperId

Der einfache Upload: cURL

Laden Sie ein einzelnes Bild in ein Paper hoch

curl -X POST "https://api.memo.wirewire.de/v1/papers/uploadSingleImage/<PAPER_ID>" \
-H "x-api-key: <API_KEY>" \
-F "picture=@/path/to/image.png;type=image/png"

Aktualisieren Sie nun den Aktuellen Tab in der Webanwendung, um zu sehen, ob das Bild aktualisiert wurde.

node.js

Wenn Sie Code gegenüber Terminalbefehlen bevorzugen, hier ist derselbe Ablauf mit fetch + FormData. Senden Sie eine Multipart-Anfrage mit einem einzelnen Bild-Feld, und Sie sind fertig.

Hochladen zu einem Dokument

import fetch from "node-fetch";
import FormData from "form-data";
import fs from "fs";
import path from "path";

const API_BASE = "https://api.memo.wirewire.de/v1";
const API_KEY = process.env.PAPERLESSPAPER_API_KEY;

export async function uploadPaperImage(paperId, filePath) {
const form = new FormData();
const filename = path.basename(filePath);
form.append("picture", fs.createReadStream(filePath), { filename });
const res = await fetch(`${API_BASE}/papers/uploadSingleImage/${paperId}`, {
method: "POST",
headers: {
"x-api-key": API_KEY,
// Wichtig: node-fetch fügt den Multipart-Grenzheader nicht automatisch hinzu.
...form.getHeaders(),
},
body: form,
});
return res.json();
}

Ein funktionierendes Beispiel des Codes finden Sie in unseren node-samples.

Dies ist nur ein erstes Tutorial, wie es funktioniert. Wenn Sie Fragen haben, öffnen Sie bitte ein Issue auf Github.