JavaScript-Techniken für den Zugriff auf die Zwischenablage:

1.Verwenden der Zwischenablage-API (navigator.clipboard.readText):

Die Clipboard-API bietet eine sichere Möglichkeit, aus der Zwischenablage zu lesen und in sie zu schreiben. So können Sie mit navigator.clipboard.readText() schnell Textdaten aus der Zwischenablage abrufen.

async function getClipboardContent() {
    try {
        const text = await navigator.clipboard.readText();
        console.log('Clipboard content:', text);
        alert('Clipboard content: '   text);
    } catch (err) {
        console.error('Failed to read clipboard contents:', err);
    }
}

// Trigger the function
getClipboardContent();

2. Verwenden einer Schaltfläche zum Abrufen von Zwischenablageinhalten:
Manchmal möchten Sie möglicherweise das Lesen der Zwischenablage nur dann auslösen, wenn der Benutzer auf eine Schaltfläche klickt. So können Sie es machen:

Show Clipboard Content

3. Bearbeitungsberechtigungen für den Zugriff auf die Zwischenablage:
Für die Zwischenablage-API sind Benutzerberechtigungen erforderlich. Daher ist es wichtig, mögliche Berechtigungsprobleme ordnungsgemäß zu behandeln. So stellen Sie sicher, dass Sie über die entsprechende Berechtigung verfügen, bevor Sie versuchen, in die Zwischenablage zu lesen oder in sie zu schreiben:

async function getClipboardContent() {
    try {
        // Request permission to read from the clipboard
        const readPermission = await navigator.permissions.query({ name: 'clipboard-read' });
        if (readPermission.state === 'granted' || readPermission.state === 'prompt') {
            const text = await navigator.clipboard.readText();
            alert('Clipboard content: '   text);
        } else {
            alert('Clipboard read access denied');
        }
    } catch (err) {
        console.error('Failed to read clipboard contents:', err);
    }
}

async function writeToClipboard(text) {
    try {
        // Request permission to write to the clipboard
        const writePermission = await navigator.permissions.query({ name: 'clipboard-write' });
        if (writePermission.state === 'granted' || writePermission.state === 'prompt') {
            await navigator.clipboard.writeText(text);
            alert('Text copied to clipboard: '   text);
        } else {
            alert('Clipboard write access denied');
        }
    } catch (err) {
        console.error('Failed to write to clipboard:', err);
    }
}

Beispiel für das Schreiben in die Zwischenablage

Copy "Hello, World!" to Clipboard

Vollständiger Beispielcode
Den vollständigen Beispielcode, um schnell herauszufinden, was sich in Ihrer Zwischenablage befindet, finden Sie hier auf GitHub Gist.

Wenn dieser Artikel Ihr Entwicklungsleben ein wenig einfacher gemacht hat, tippen Sie auf dieses Herz ❤️ und bleiben Sie hier für mehr JavaScript-Magie!