Wie ermöglicht Chrome 12 das direkte Einfügen von Bildern in Gmail?

Entsperren der Bild-Zwischenablage-Integration in Gmail und Chrome 12

In einer bemerkenswerten Weiterentwicklung gibt Chrome 12 und höher Benutzern die Möglichkeit, Bilder nahtlos direkt aus der Zwischenablage einzufügen in Gmail-Nachrichten. Diese innovative Funktionalität geht über die Einschränkungen bestehender Lösungen hinaus, die auf Tastendruckereignissen basieren und keinen Kontextmenüzugriff unterstützen.

Um dies zu erreichen, hat Webkit eine ausgeklügelte Verbesserung unter der Haube eingeführt. Durch die Erweiterung der Clipboard-API wird das Onpaste-Ereignis unterstützt, bei dem Entwickler auf den Inhalt der Zwischenablage zugreifen können. Beim Einfügen wird ein Array von ClipboardItem-Objekten angezeigt, die jeweils das spezifische Element enthalten, das eingefügt wurde.

Um in die Details dieser Funktionalität einzutauchen, können Entwickler auf den folgenden Codeausschnitt zurückgreifen:

<code class="javascript">document.onpaste = function(event) {
  var items = (event.clipboardData || event.originalEvent.clipboardData).items;
  console.log(JSON.stringify(items)); // Mime type information (optional)

  for (let item of items) {
    if (item.kind === 'file') {
      var blob = item.getAsFile();
      var reader = new FileReader();
      reader.onload = function(event) {
        console.log(event.target.result); // Data URL for the pasted image!
      }
      reader.readAsDataURL(blob);
    }
  }
};</code>

Sobald eine Daten-URL erhalten wurde, stellt sie das eingefügte Bild dar, das je nach Bedarf angezeigt oder hochgeladen werden kann. Die FileReader-API kann genutzt werden, um entweder eine Daten-URL oder Binärdaten aus dem Bild zu extrahieren. FormData bietet eine praktische Methode zum Hochladen von Bildern mithilfe von

Das obige ist der detaillierte Inhalt vonWie ermöglicht Chrome 12 das direkte Einfügen von Bildern in Gmail?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!