{"id":81747,"date":"2022-09-15T05:09:15","date_gmt":"2022-09-15T03:09:15","guid":{"rendered":"https:\/\/rmarketingdigital.com\/development\/desbloqueo-del-acceso-al-portapapeles\/"},"modified":"2021-07-06T09:30:08","modified_gmt":"2021-07-06T07:30:08","slug":"desbloqueo-del-acceso-al-portapapeles","status":"publish","type":"post","link":"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/","title":{"rendered":"Zugriff auf die Zwischenablage entsperren"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_86 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Contenidos<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Copiar-escribir-datos-en-el-portapapeles\" >Copiar: escribir datos en el portapapeles<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#writeText\" >writeText ()<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#escribir\" >escribir()<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#El-evento-de-copia\" >El evento de copia<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Pegar-leer-datos-del-portapapeles\" >Pegar: leer datos del portapapeles<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Lea-el-texto\" >Lea el texto()<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#leer\" >leer()<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#El-evento-de-pegar\" >El evento de pegar<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Manejo-de-diversos-tipos-de-archivos\" >Manejo de diversos tipos de archivos<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Seguridad-y-permisos\" >Seguridad y permisos<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Deteccion-de-caracteristicas\" >Detecci\u00f3n de caracter\u00edsticas<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Poblacion\" >Poblaci\u00f3n<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Proximos-pasos\" >Pr\u00f3ximos pasos<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/#Agradecimientos\" >Agradecimientos<\/a><\/li><\/ul><\/nav><\/div>\n<p><\/p>\n<div>\n<header class=\"w-article-header\">\n<p class=\"w-article-header__subhead w-mb--non\">\n<p>          Acceso al portapapeles m\u00e1s seguro y desbloqueado para texto e im\u00e1genes\n        <\/p>\n<p>\n          <time>31 de julio de 2020<\/time><br \/>\n            Actualizado <time>31 de julio de 2020<\/time>\n        <\/p>\n<\/header>\n<p>En los \u00faltimos a\u00f1os, los navegadores han utilizado<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/updates\/2015\/04\/cut-and-copy-commands\"><code>document.execCommand()<\/code><\/a><\/p>\n<p>para interacciones con el portapapeles.  A\u00fan cuando es ampliamente compatible, este m\u00e9todo de cortar y pegar ten\u00eda un costo: el acceso al portapapeles era sincr\u00f3nico y solo pod\u00eda leer y escribir en el DOM.<\/p>\n<p>Eso est\u00e1 bien para peque\u00f1os fragmentos de texto, pero hay muchos casos en los que bloquear la p\u00e1gina para la transferencia del portapapeles es una mala experiencia.  Es viable que se necesite una desinfecci\u00f3n o decodificaci\u00f3n de im\u00e1genes que requiera mucho tiempo antes de que el contenido se pueda pegar de forma segura.  Es viable que el navegador necesite cargar o incorporar recursos vinculados desde un documento pegado.  Eso bloquear\u00eda la p\u00e1gina mientras espera en el disco o la red.  Imagine agregar permisos a la mezcla, requiriendo que el navegador bloquee la p\u00e1gina mientras solicita acceso al portapapeles.  A la vez, los permisos establecidos alrededor<br \/>\n<code>document.execCommand()<\/code> para la interacci\u00f3n del portapapeles est\u00e1n vagamente definidos y var\u00edan entre los navegadores.<\/p>\n<p>los<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.w3.org\/TR\/clipboard-apis\/#async-clipboard-api\">API Async Clipboard<\/a><br \/>\naborda estos problemas, proporcionando un modelo de permisos bien definido que no bloquea la p\u00e1gina.  Safari anunciado recientemente  <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/webkit.org\/blog\/10855\/\">soporte para \u00e9l en la versi\u00f3n 13.1<\/a>.  Con eso, los principales navegadores disponen un nivel b\u00e1sico de soporte.  A la hora de escribir estas l\u00edneas, Firefox solo admite texto;  y el soporte de im\u00e1genes est\u00e1 limitado a PNG en algunos navegadores.  Si est\u00e1 interesado en usar la API,<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Clipboard#Browser_compatibility\">consultar una tabla de soporte del navegador<\/a><br \/>\nantes de continuar.<\/p>\n<p>Este post explica c\u00f3mo escribir texto e im\u00e1genes y c\u00f3mo leerlos desde el portapapeles.  Este post no cubre <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.chromestatus.com\/features\/5767075295395840\">Pol\u00edtica de funciones para el portapapeles<\/a> que aterriz\u00f3 en Chrome 85.<\/p>\n<div class=\"w-aside w-aside--note\">\n<p>La API Async Clipboard se limita a manejar texto e im\u00e1genes.  Chrome 84 introduce una funci\u00f3n experimental que posibilita que el portapapeles maneje cualquier tipo de datos arbitrario.<\/p>\n<\/div>\n<h2 id=\"copy:-writing-data-to-the-clipboard\"><span class=\"ez-toc-section\" id=\"Copiar-escribir-datos-en-el-portapapeles\"><\/span>Copiar: escribir datos en el portapapeles <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3 id=\"writetext()\"><span class=\"ez-toc-section\" id=\"writeText\"><\/span>writeText () <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Para copiar texto a la llamada del portapapeles <code>writeText()<\/code>.  Puesto que esta API es asincr\u00f3nica, la <code>writeText()<\/code> La funci\u00f3n devuelve una Promesa que se resuelve o rechaza dependiendo de si el texto pasado se copia correctamente:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">async<\/span> <span class=\"token keyword\">function<\/span> <span class=\"token function\">copyPageUrl<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">try<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">writeText<\/span><span class=\"token punctuation\">(<\/span>location<span class=\"token punctuation\">.<\/span>href<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Page URL copied to clipboard'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">catch<\/span> <span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">error<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Failed to copy: '<\/span><span class=\"token punctuation\">,<\/span> err<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token punctuation\">}<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h3 id=\"write()\"><span class=\"ez-toc-section\" id=\"escribir\"><\/span>escribir() <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Verdaderamente, <code>writeText()<\/code> es solo un m\u00e9todo de conveniencia para el gen\u00e9rico <code>write()<\/code><br \/>\nm\u00e9todo, que adem\u00e1s le posibilita copiar im\u00e1genes al portapapeles.  Me gusta <code>writeText()<\/code>, es asincr\u00f3nico y devuelve una Promesa.<\/p>\n<p>Para escribir una imagen en el portapapeles, requiere la imagen como<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/blob\"><code>blob<\/code><\/a>.  Una forma de hacer esto es solicitando la imagen de un servidor utilizando <code>fetch()<\/code>, despu\u00e9s llamando<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Body\/blob\"><code>blob()<\/code><\/a>  en la soluci\u00f3n.<\/p>\n<p>Solicitar una imagen del servidor puede no ser deseable o viable por una gama de razones.  Por suerte, adem\u00e1s puede dibujar la imagen en un lienzo y llamar al lienzo &#8216;<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/HTMLCanvasElement\/toBlob\"><code>toBlob()<\/code><\/a><\/p>\n<p>m\u00e9todo.<\/p>\n<p>A continuaci\u00f3n, pase una matriz de <code>ClipboardItem<\/code> objetos como un par\u00e1metro para el <code>write()<\/code><br \/>\nm\u00e9todo.  Hoy en d\u00eda, solo puede pasar una imagen al mismo tiempo, pero esperamos agregar soporte para diversos im\u00e1genes en el futuro. <code>ClipboardItem<\/code> toma un objeto con el tipo MIME de la imagen como clave y el blob como valor.  Para objetos Blob obtenidos de <code>fetch()<\/code> o <code>canvas.toBlob()<\/code>, el <code>blob.type<\/code> La propiedad contiene de forma autom\u00e1tica el tipo MIME correcto para una imagen.<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">try<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">const<\/span> imgURL <span class=\"token operator\">=<\/span> <span class=\"token string\">'\/images\/generic\/file.png'<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">const<\/span> data <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> <span class=\"token function\">fetch<\/span><span class=\"token punctuation\">(<\/span>imgURL<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">const<\/span> blob <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> data<span class=\"token punctuation\">.<\/span><span class=\"token function\">blob<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">write<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">[<\/span><br><span class=\"token keyword\">new<\/span> <span class=\"token class-name\">ClipboardItem<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span><br><span class=\"token punctuation\">[<\/span>blob<span class=\"token punctuation\">.<\/span>type<span class=\"token punctuation\">]<\/span><span class=\"token operator\">:<\/span> blob<br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br><span class=\"token punctuation\">]<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Image copied.'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">catch<\/span> <span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">error<\/span><span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">.<\/span>name<span class=\"token punctuation\">,<\/span> err<span class=\"token punctuation\">.<\/span>message<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h3 id=\"the-copy-event\"><span class=\"ez-toc-section\" id=\"El-evento-de-copia\"><\/span>El evento de copia <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>En el caso de que un usuario inicie una copia del portapapeles, se le proporcionar\u00e1n datos no textuales como un blob.  los<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Document\/copy_event\"><code>copy<\/code>  evento<\/a><br \/>\nincluye una <code>clipboardData<\/code> con los \u00edtems que ya est\u00e1n en el formato correcto, eliminando la necesidad de crear manualmente un Blob.  Llamada <code>preventDefault()<\/code> para evitar el comportamiento predeterminado a favor de su propia l\u00f3gica, despu\u00e9s copie el contenido en el portapapeles.  Lo que no se cubre en este ejemplo es c\u00f3mo recurrir a API anteriores cuando la API del Portapapeles no es compatible.  Cubrir\u00e9 eso en Detecci\u00f3n de caracter\u00edsticas, m\u00e1s adelante en este post.<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\">document<span class=\"token punctuation\">.<\/span><span class=\"token function\">addEventListener<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'copy'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token keyword\">async<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\">e<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span><br>e<span class=\"token punctuation\">.<\/span><span class=\"token function\">preventDefault<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">try<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">let<\/span> clipboardItems <span class=\"token operator\">=<\/span> <span class=\"token punctuation\">[<\/span><span class=\"token punctuation\">]<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">for<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token keyword\">const<\/span> item <span class=\"token keyword\">of<\/span> e<span class=\"token punctuation\">.<\/span>clipboardData<span class=\"token punctuation\">.<\/span>items<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token operator\">!<\/span>item<span class=\"token punctuation\">.<\/span>type<span class=\"token punctuation\">.<\/span><span class=\"token function\">startsWith<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'image\/'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">continue<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br>clipboardItems<span class=\"token punctuation\">.<\/span><span class=\"token function\">push<\/span><span class=\"token punctuation\">(<\/span><br><span class=\"token keyword\">new<\/span> <span class=\"token class-name\">ClipboardItem<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span><br><span class=\"token punctuation\">[<\/span>item<span class=\"token punctuation\">.<\/span>type<span class=\"token punctuation\">]<\/span><span class=\"token operator\">:<\/span> item<span class=\"token punctuation\">,<\/span><br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><br><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">write<\/span><span class=\"token punctuation\">(<\/span>clipboardItems<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Image copied.'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">catch<\/span> <span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">error<\/span><span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">.<\/span>name<span class=\"token punctuation\">,<\/span> err<span class=\"token punctuation\">.<\/span>message<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h2 id=\"paste:-reading-data-from-clipboard\"><span class=\"ez-toc-section\" id=\"Pegar-leer-datos-del-portapapeles\"><\/span>Pegar: leer datos del portapapeles <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3 id=\"readtext()\"><span class=\"ez-toc-section\" id=\"Lea-el-texto\"><\/span>Lea el texto() <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Para leer texto del portapapeles, llame <code>navigator.clipboard.readText()<\/code> y espere a que se resuelva la Promesa devuelta:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">async<\/span> <span class=\"token keyword\">function<\/span> <span class=\"token function\">getClipboardContents<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">try<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">const<\/span> text <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">readText<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Pasted content: '<\/span><span class=\"token punctuation\">,<\/span> text<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">catch<\/span> <span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">error<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Failed to read clipboard contents: '<\/span><span class=\"token punctuation\">,<\/span> err<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token punctuation\">}<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h3 id=\"read()\"><span class=\"ez-toc-section\" id=\"leer\"><\/span>leer() <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>los <code>navigator.clipboard.read()<\/code> El m\u00e9todo adem\u00e1s es asincr\u00f3nico y devuelve una Promesa.  Para leer una imagen del portapapeles, obtenga una lista de<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/ClipboardItem\"><code>ClipboardItem<\/code><\/a><\/p>\n<p>objetos, despu\u00e9s iterar sobre ellos.<\/p>\n<p>Cada <code>ClipboardItem<\/code> puede contener su contenido en diferentes tipos, por lo que deber\u00e1 iterar sobre el listado de tipos, nuevamente utilizando un <code>for...of<\/code> lazo.  Para cada tipo, llame al <code>getType()<\/code> con el tipo actual como argumento para conseguir el Blob respectivo.  Como antes, este c\u00f3digo no est\u00e1 vinculado a im\u00e1genes y funcionar\u00e1 con otros tipos de archivos futuros.<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">async<\/span> <span class=\"token keyword\">function<\/span> <span class=\"token function\">getClipboardContents<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">try<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">const<\/span> clipboardItems <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">read<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">for<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token keyword\">const<\/span> clipboardItem <span class=\"token keyword\">of<\/span> clipboardItems<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">for<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token keyword\">const<\/span> type <span class=\"token keyword\">of<\/span> clipboardItem<span class=\"token punctuation\">.<\/span>types<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">const<\/span> blob <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> clipboardItem<span class=\"token punctuation\">.<\/span><span class=\"token function\">getType<\/span><span class=\"token punctuation\">(<\/span>type<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span><span class=\"token constant\">URL<\/span><span class=\"token punctuation\">.<\/span><span class=\"token function\">createObjectURL<\/span><span class=\"token punctuation\">(<\/span>blob<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token punctuation\">}<\/span> <span class=\"token keyword\">catch<\/span> <span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">error<\/span><span class=\"token punctuation\">(<\/span>err<span class=\"token punctuation\">.<\/span>name<span class=\"token punctuation\">,<\/span> err<span class=\"token punctuation\">.<\/span>message<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token punctuation\">}<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h3 id=\"the-paste-event\"><span class=\"ez-toc-section\" id=\"El-evento-de-pegar\"><\/span>El evento de pegar <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Como se se\u00f1al\u00f3 previamente, hay planes para introducir eventos para que funcionen con la API del Portapapeles, pero por ahora puede utilizar el existente <code>paste<\/code> evento.  Funciona muy bien con los nuevos m\u00e9todos asincr\u00f3nicos para leer el texto del portapapeles.  Como con el <code>copy<\/code> evento, no olvides llamar <code>preventDefault()<\/code>.<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\">document<span class=\"token punctuation\">.<\/span><span class=\"token function\">addEventListener<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'paste'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token keyword\">async<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\">e<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span><br>e<span class=\"token punctuation\">.<\/span><span class=\"token function\">preventDefault<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">const<\/span> text <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">readText<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Pasted text: '<\/span><span class=\"token punctuation\">,<\/span> text<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<p>Como con el <code>copy<\/code> evento, recurrir a API anteriores cuando la API del Portapapeles no es compatible se tratar\u00e1 en Detecci\u00f3n de funciones.<\/p>\n<h2 id=\"handling-multiple-file-types\"><span class=\"ez-toc-section\" id=\"Manejo-de-diversos-tipos-de-archivos\"><\/span>Manejo de diversos tipos de archivos <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>La mayor\u00eda de las implementaciones colocan diversos formatos de datos en el portapapeles para una sola operaci\u00f3n de corte o copia.  Hay dos razones para ello: como desarrollador de aplicaciones, no tiene forma de conocer las capacidades de la aplicaci\u00f3n en la que un usuario desea copiar texto o im\u00e1genes, y muchas aplicaciones admiten pegar datos estructurados como texto sin formato.  Esto se presenta a los usuarios con un <strong>Editar<\/strong> elemento de men\u00fa con un nombre como <strong>Pegar y combinar estilo<\/strong> o <strong>Pegar sin formatear<\/strong>.<\/p>\n<p>El siguiente ejemplo muestra c\u00f3mo hacer esto.  Este ejemplo utiliza <code>fetch()<\/code> para conseguir datos de imagen, pero adem\u00e1s podr\u00eda provenir de un<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/HTML\/Element\/canvas\"><code>&lt;canvas&gt;<\/code><\/a><\/p>\n<p>o la API del sistema de archivos nativo.<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">function<\/span> <span class=\"token function\">copy<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">const<\/span> image <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> <span class=\"token function\">fetch<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'kitten.png'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">const<\/span> text <span class=\"token operator\">=<\/span> <span class=\"token keyword\">new<\/span> <span class=\"token class-name\">Blob<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">[<\/span><span class=\"token string\">'Cute sleeping kitten'<\/span><span class=\"token punctuation\">]<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{<\/span>type<span class=\"token operator\">:<\/span> <span class=\"token string\">'text\/plain'<\/span><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">const<\/span> item <span class=\"token operator\">=<\/span> <span class=\"token keyword\">new<\/span> <span class=\"token class-name\">ClipboardItem<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span><br><span class=\"token string\">'text\/plain'<\/span><span class=\"token operator\">:<\/span> text<span class=\"token punctuation\">,<\/span><br><span class=\"token string\">'image\/png'<\/span><span class=\"token operator\">:<\/span> image<br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">write<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">[<\/span>item<span class=\"token punctuation\">]<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h2 id=\"security-and-permissions\"><span class=\"ez-toc-section\" id=\"Seguridad-y-permisos\"><\/span>Seguridad y permisos <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>El acceso al portapapeles siempre ha supuesto un obst\u00e1culo de seguridad para los navegadores.  Sin los permisos adecuados, una p\u00e1gina podr\u00eda copiar silenciosamente todo tipo de contenido malicioso en el portapapeles de un usuario que producir\u00eda resultados catastr\u00f3ficos al pegarlo.  Imagina una p\u00e1gina web que copia silenciosamente <code>rm -rf \/<\/code> o un<br \/>\nimagen de bomba de descompresi\u00f3n<br \/>\na su portapapeles.<\/p>\n<figure class=\"w-figure\">\n  <img alt='prompt-5760362' class=\"w-screenshot\" src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/prompt-5760362.png' alt=\"Indicaci\u00f3n del navegador que solicita al usuario el permiso del portapapeles.\"><figcaption class=\"w-figcaption\">\n<p>    La solicitud de permiso para la API del Portapapeles.<br \/>\n  <\/figcaption><\/figure>\n<p>Dar a las p\u00e1ginas web acceso de lectura sin restricciones al portapapeles es todav\u00eda m\u00e1s problem\u00e1tico.  Los usuarios copian rutinariamente informaci\u00f3n confidencial como contrase\u00f1as y datos personales al portapapeles, que despu\u00e9s puede ser le\u00eddo por cualquier p\u00e1gina sin el conocimiento del usuario.<\/p>\n<p>Como ocurre con muchas API nuevas, la API del Portapapeles solo es compatible con las p\u00e1ginas publicadas mediante HTTPS.  Para ayudar a prevenir el abuso, el acceso al portapapeles solo est\u00e1 permitido cuando una p\u00e1gina es la pesta\u00f1a activa.  Las p\u00e1ginas en pesta\u00f1as activas pueden escribir en el portapapeles sin solicitar permiso, pero leer desde el portapapeles siempre necesita permiso.<\/p>\n<p>Se han incorporado permisos para copiar y pegar al<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/updates\/2015\/04\/permissions-api-for-the-web\">API de permisos<\/a>.  los <code>clipboard-write<\/code> el permiso se otorga de forma autom\u00e1tica a las p\u00e1ginas cuando son la pesta\u00f1a activa.  los <code>clipboard-read<\/code> Se debe solicitar permiso, lo que puede hacer intentando leer datos del portapapeles.  El siguiente c\u00f3digo muestra lo \u00faltimo:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">const<\/span> queryOpts <span class=\"token operator\">=<\/span> <span class=\"token punctuation\">{<\/span> name<span class=\"token operator\">:<\/span> <span class=\"token string\">'clipboard-read'<\/span><span class=\"token punctuation\">,<\/span> allowWithoutGesture<span class=\"token operator\">:<\/span> <span class=\"token boolean\">false<\/span> <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">const<\/span> permissionStatus <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>permissions<span class=\"token punctuation\">.<\/span><span class=\"token function\">query<\/span><span class=\"token punctuation\">(<\/span>queryOpts<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span>permissionStatus<span class=\"token punctuation\">.<\/span>state<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><p><br>permissionStatus<span class=\"token punctuation\">.<\/span><span class=\"token function-variable function\">onchange<\/span> <span class=\"token operator\">=<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span>permissionStatus<span class=\"token punctuation\">.<\/span>state<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span><\/p><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<p>Adem\u00e1s puede controlar si se necesita un gesto de usuario para invocar cortar o pegar utilizando el <code>allowWithoutGesture<\/code> opci\u00f3n.  El valor predeterminado de este valor var\u00eda seg\u00fan el navegador, por lo que siempre debe incorporarlo.<\/p>\n<p>Aqu\u00ed es donde la naturaleza asincr\u00f3nica de la API del Portapapeles es verdaderamente \u00fatil: intentar leer o escribir datos del portapapeles de forma autom\u00e1tica solicita al usuario permiso si todav\u00eda no se ha otorgado.  Puesto que la API se basa en promesas, esto es totalmente transparente, y un usuario que niega el permiso del portapapeles hace que la promesa se rechace para que la p\u00e1gina pueda responder adecuadamente.<\/p>\n<p>Porque Chrome solo posibilita el acceso al portapapeles cuando una p\u00e1gina es la pesta\u00f1a activa, encontrar\u00e1 que algunos de los ejemplos aqu\u00ed no se ejecutan si se pegan de forma directa en DevTools, puesto que DevTools en s\u00ed es la pesta\u00f1a activa.  Hay un truco: diferir el acceso al portapapeles utilizando <code>setTimeout()<\/code>, despu\u00e9s haga clic r\u00e1pidamente dentro de la p\u00e1gina para enfocarla antes de llamar a las funciones:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token function\">setTimeout<\/span><span class=\"token punctuation\">(<\/span><span class=\"token keyword\">async<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">const<\/span> text <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">readText<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span>text<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token number\">2000<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h2 id=\"feature-detection\"><span class=\"ez-toc-section\" id=\"Deteccion-de-caracteristicas\"><\/span>Detecci\u00f3n de caracter\u00edsticas <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Para utilizar la API Async Clipboard mientras es compatible con todos los navegadores, pruebe<br \/>\n<code>navigator.clipboard<\/code> y recurrir a m\u00e9todos anteriores.  A modo de ejemplo, as\u00ed es como puede poner en pr\u00e1ctica el pegado para incluir otros navegadores.<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\">document<span class=\"token punctuation\">.<\/span><span class=\"token function\">addEventListener<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'paste'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token keyword\">async<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\">e<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span><br>e<span class=\"token punctuation\">.<\/span><span class=\"token function\">preventDefault<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">let<\/span> text<span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br>text <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>clipboard<span class=\"token punctuation\">.<\/span><span class=\"token function\">readText<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token keyword\">else<\/span> <span class=\"token punctuation\">{<\/span><br>text <span class=\"token operator\">=<\/span> e<span class=\"token punctuation\">.<\/span>clipboardData<span class=\"token punctuation\">.<\/span><span class=\"token function\">getData<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'text\/plain'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">log<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Got pasted text: '<\/span><span class=\"token punctuation\">,<\/span> text<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<p>Esa no es toda la historia.  Antes de la API Async Clipboard, exist\u00eda una combinaci\u00f3n de diferentes implementaciones de copiar y pegar en los navegadores web.  En la mayor\u00eda de los navegadores, la funci\u00f3n de copiar y pegar del navegador se puede activar a trav\u00e9s de<br \/>\n<code>document.execCommand('copy')<\/code> y <code>document.execCommand('paste')<\/code>.  Si el texto que se va a copiar es una cadena que no est\u00e1 presente en el DOM, debe inyectarse en el DOM y seleccionarse:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\">button<span class=\"token punctuation\">.<\/span><span class=\"token function\">addEventListener<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'click'<\/span><span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\">e<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token keyword\">const<\/span> input <span class=\"token operator\">=<\/span> document<span class=\"token punctuation\">.<\/span><span class=\"token function\">createElement<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'input'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>document<span class=\"token punctuation\">.<\/span>body<span class=\"token punctuation\">.<\/span><span class=\"token function\">appendChild<\/span><span class=\"token punctuation\">(<\/span>input<span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>input<span class=\"token punctuation\">.<\/span>value <span class=\"token operator\">=<\/span> text<span class=\"token punctuation\">;<\/span><br>input<span class=\"token punctuation\">.<\/span><span class=\"token function\">focus<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br>input<span class=\"token punctuation\">.<\/span><span class=\"token function\">select<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">const<\/span> result <span class=\"token operator\">=<\/span> document<span class=\"token punctuation\">.<\/span><span class=\"token function\">execCommand<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'copy'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span>result <span class=\"token operator\">===<\/span> <span class=\"token string\">'unsuccessful'<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br>console<span class=\"token punctuation\">.<\/span><span class=\"token function\">error<\/span><span class=\"token punctuation\">(<\/span><span class=\"token string\">'Failed to copy text.'<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><br><span class=\"token punctuation\">}<\/span><br><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<p>En Internet Explorer, adem\u00e1s puede entrar al portapapeles mediante<br \/>\n<code>window.clipboardData<\/code>.  Si se accede dentro de un gesto de usuario, como un evento de clic, que forma parte de pedir permiso de manera responsable, no se muestra ning\u00fan mensaje de permiso.<\/p>\n<h2 id=\"demos\"><span class=\"ez-toc-section\" id=\"Poblacion\"><\/span>Poblaci\u00f3n <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Puede jugar con la API Async Clipboard en las demostraciones a continuaci\u00f3n.  Podr\u00edas obtener un<br \/>\n<code>NotAllowedError<\/code> si se ejecuta en un iframe, eso es provocado por el reci\u00e9n implementado<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.chromestatus.com\/feature\/5767075295395840\"><code>clipboard<\/code>  Pol\u00edtica de funciones<\/a>.  Para este caso, ejecute la demostraci\u00f3n. <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/async-clipboard-api.glitch.me\/\">de forma directa en Glitch<\/a>.<\/p>\n<p>El primer ejemplo muestra c\u00f3mo mover texto dentro y fuera del portapapeles.<\/p>\n<p>\n  <iframe src=\"https:\/\/glitch.com\/embed\/#!\/embed\/async-clipboard-text?previewSize=100\" title=\"async-clipboard-text on Glitch\" allow=\"geolocation; microphone; camera; midi; vr; encrypted-media;\nclipboard; clipboard-read; clipboard-write\" style=\"height: 100%; width: 100%; border: 0;\"><br \/>\n  <\/iframe>\n<\/p>\n<p>Para probar la API con im\u00e1genes, use esta demostraci\u00f3n.  Recuerde que solo se admiten PNG y solo en<br \/>\n[a few browsers](<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Clipboard_API\">https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Clipboard_API<\/a>.<\/p>\n<p>\n  <iframe src=\"https:\/\/glitch.com\/embed\/#!\/embed\/async-clipboard-api?previewSize=100\" title=\"async-clipboard-api on Glitch\" allow=\"geolocation; microphone; camera; midi; vr; encrypted-media;\nclipboard; clipboard-read; clipboard-write\" style=\"height: 100%; width: 100%; border: 0;\"><br \/>\n  <\/iframe>\n<\/p>\n<h2 id=\"next-steps\"><span class=\"ez-toc-section\" id=\"Proximos-pasos\"><\/span>Pr\u00f3ximos pasos <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Chrome est\u00e1 trabajando activamente para expandir la API del Portapapeles as\u00edncrono con eventos simplificados alineados con la<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/HTML_Drag_and_Drop_API\">API de arrastrar y soltar<\/a>.  Debido a los riesgos potenciales, Chrome est\u00e1 pisando con cuidado.  Para mantenerse actualizado sobre el progreso de Chrome, mire este post y nuestro blog para conseguir actualizaciones.<\/p>\n<p>Por ahora, la compatibilidad con la API del portapapeles se encuentra disponible en<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/Clipboard#Browser_compatibility\">varios navegadores<\/a>.<\/p>\n<p>\u00a1Feliz copiando y pegando!<\/p>\n<h2 id=\"acknowledgements\"><span class=\"ez-toc-section\" id=\"Agradecimientos\"><\/span>Agradecimientos <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>La API Asynchronous Clipboard fue implementada por <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.linkedin.com\/in\/darwinhuang\/\">Darwin Huang<\/a> y <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.linkedin.com\/in\/garykac\/\">Gary Ka\u010dmar\u010d\u00edk<\/a>.  Darwin adem\u00e1s proporcion\u00f3 la demostraci\u00f3n.  Gracias a <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/kyarik\">Kyarik<\/a> y nuevamente a Gary Ka\u010dmar\u010d\u00edk por revisar partes de este post.<\/p>\n<p>Imagen de h\u00e9roe de <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/unsplash.com\/@markuswinkler\">Markus Winkler<\/a> en<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/unsplash.com\/photos\/7iSEHWsxPLw\">Unsplash<\/a>.<\/p>\n<p>    <web-feedback additional-questions=\"api\"><\/web-feedback>\n  <\/div>\n","protected":false},"excerpt":{"rendered":"<p>Acceso al portapapeles m\u00e1s seguro y desbloqueado para texto e im\u00e1genes 31 de julio de 2020 Actualizado 31 de julio de 2020 En los \u00faltimos a\u00f1os, los navegadores han utilizado&#8230;<\/p>","protected":false},"author":1,"featured_media":81748,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1356],"tags":[],"class_list":["post-81747","post","type-post","status-publish","format-standard","has-post-thumbnail","category-dev"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.0 (Yoast SEO v28.2) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Desbloqueo del acceso al portapapeles - R Marketing Digital<\/title>\n<meta name=\"description\" content=\"Acceso al portapapeles m\u00e1s seguro y desbloqueado para texto e im\u00e1genes 31 de julio de 2020 Actualizado 31 de julio de 2020 En los \u00faltimos a\u00f1os, los\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Desbloqueo del acceso al portapapeles\" \/>\n<meta property=\"og:description\" content=\"Acceso al portapapeles m\u00e1s seguro y desbloqueado para texto e im\u00e1genes 31 de julio de 2020 Actualizado 31 de julio de 2020 En los \u00faltimos a\u00f1os, los\" \/>\n<meta property=\"og:url\" content=\"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/\" \/>\n<meta property=\"og:site_name\" content=\"R Marketing Digital\" \/>\n<meta property=\"article:published_time\" content=\"2022-09-15T03:09:15+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-4463815.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"345\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"R Marketing Digital\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/\"},\"author\":{\"name\":\"R Marketing Digital\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\"},\"headline\":\"Desbloqueo del acceso al portapapeles\",\"datePublished\":\"2022-09-15T03:09:15+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/\"},\"wordCount\":1787,\"image\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/hero-4463815.jpg\",\"articleSection\":[\"Dev\"],\"inLanguage\":\"de\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/\",\"name\":\"Desbloqueo del acceso al portapapeles - R Marketing Digital\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/hero-4463815.jpg\",\"datePublished\":\"2022-09-15T03:09:15+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\"},\"description\":\"Acceso al portapapeles m\u00e1s seguro y desbloqueado para texto e im\u00e1genes 31 de julio de 2020 Actualizado 31 de julio de 2020 En los \u00faltimos a\u00f1os, los\",\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/dev\\\/desbloqueo-del-acceso-al-portapapeles\\\/#primaryimage\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/hero-4463815.jpg\",\"contentUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/hero-4463815.jpg\",\"width\":1200,\"height\":345,\"caption\":\"hero-4463815-3927406-jpg\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#website\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/\",\"name\":\"R Marketing Digital\",\"description\":\"Agencia SEO | Publicidad redes sociales | Community Management\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/rmarketingdigital.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\",\"name\":\"R Marketing Digital\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"caption\":\"R Marketing Digital\"}}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Desbloqueo del acceso al portapapeles - R Marketing Digital","description":"Sichererer und entsperrter Zugriff auf die Zwischenablage f\u00fcr Text und Bilder 31. Juli 2020 Aktualisiert 31. Juli 2020 In den letzten Jahren","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/","og_locale":"de_DE","og_type":"article","og_title":"Desbloqueo del acceso al portapapeles","og_description":"Acceso al portapapeles m\u00e1s seguro y desbloqueado para texto e im\u00e1genes 31 de julio de 2020 Actualizado 31 de julio de 2020 En los \u00faltimos a\u00f1os, los","og_url":"https:\/\/rmarketingdigital.com\/de\/dev\/desbloqueo-del-acceso-al-portapapeles\/","og_site_name":"R Marketing Digital","article_published_time":"2022-09-15T03:09:15+00:00","og_image":[{"width":1200,"height":345,"url":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-4463815.jpg","type":"image\/jpeg"}],"author":"R Marketing Digital","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/#article","isPartOf":{"@id":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/"},"author":{"name":"R Marketing Digital","@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e"},"headline":"Desbloqueo del acceso al portapapeles","datePublished":"2022-09-15T03:09:15+00:00","mainEntityOfPage":{"@id":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/"},"wordCount":1787,"image":{"@id":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/#primaryimage"},"thumbnailUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-4463815.jpg","articleSection":["Dev"],"inLanguage":"de"},{"@type":"WebPage","@id":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/","url":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/","name":"Desbloqueo del acceso al portapapeles - R Marketing Digital","isPartOf":{"@id":"https:\/\/rmarketingdigital.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/#primaryimage"},"image":{"@id":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/#primaryimage"},"thumbnailUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-4463815.jpg","datePublished":"2022-09-15T03:09:15+00:00","author":{"@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e"},"description":"Sichererer und entsperrter Zugriff auf die Zwischenablage f\u00fcr Text und Bilder 31. Juli 2020 Aktualisiert 31. Juli 2020 In den letzten Jahren","inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/"]}]},{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/rmarketingdigital.com\/dev\/desbloqueo-del-acceso-al-portapapeles\/#primaryimage","url":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-4463815.jpg","contentUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-4463815.jpg","width":1200,"height":345,"caption":"hero-4463815-3927406-jpg"},{"@type":"WebSite","@id":"https:\/\/rmarketingdigital.com\/#website","url":"https:\/\/rmarketingdigital.com\/","name":"R Digitales Marketing","description":"SEO Agentur | Werbung f\u00fcr soziale Netzwerke | Community Management","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/rmarketingdigital.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Person","@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e","name":"R Digitales Marketing","image":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","caption":"R Marketing Digital"}}]}},"_links":{"self":[{"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/posts\/81747","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/comments?post=81747"}],"version-history":[{"count":0,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/posts\/81747\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/media\/81748"}],"wp:attachment":[{"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/media?parent=81747"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/categories?post=81747"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rmarketingdigital.com\/de\/wp-json\/wp\/v2\/tags?post=81747"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}