{"id":29167,"date":"2021-06-09T16:01:00","date_gmt":"2021-06-09T13:01:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=29167"},"modified":"2021-10-17T16:24:18","modified_gmt":"2021-10-17T13:24:18","slug":"cargar-y-comprimir-varias-imagenes-en-php","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/es\/cargar-y-comprimir-varias-imagenes-en-php\/","title":{"rendered":"Cargar y comprimir varias im\u00e1genes en PHP"},"content":{"rendered":"<p>Recientemente, uno de nuestros lectores pregunt\u00f3 c\u00f3mo cargar y comprimir varias im\u00e1genes en PHP. Hay ciertos escenarios en los que debemos permitir que los usuarios carguen varias im\u00e1genes. Siempre es una buena pr\u00e1ctica optimizar las im\u00e1genes en el momento de la carga. En este art\u00edculo, estudiamos la carga de varias im\u00e1genes y c\u00f3mo comprimir im\u00e1genes durante el proceso de carga.<\/p>\n<h3>\u00bfPor qu\u00e9 necesitamos reducir el tama\u00f1o del archivo de imagen?<\/h3>\n<p>Sin duda, las im\u00e1genes juegan un papel importante en su sitio web. Las im\u00e1genes llamativas atraen la atenci\u00f3n de los lectores y pasar\u00edan m\u00e1s tiempo en el sitio web. Pero al mismo tiempo, las im\u00e1genes de gran tama\u00f1o ralentizan su sitio web. Como se necesita m\u00e1s ancho de banda, su sitio web tarda m\u00e1s en cargar las p\u00e1ginas web. Los propietarios del sitio deben prestar atenci\u00f3n para reducir el tama\u00f1o del archivo de imagen y utilizar la mejor herramienta de compresi\u00f3n de im\u00e1genes para ello.<\/p>\n<p>Le mostrar\u00e9 dos formas de comprimir im\u00e1genes: TinyPNG y el paquete <a href=\"https:\/\/github.com\/artisansweb\/image-optimizer\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">artisansweb \/ image-optimizer<\/a>.<\/p>\n<p><a href=\"https:\/\/tinypng.com\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">TinyPNG<\/a> es uno de los servicios de compresi\u00f3n de im\u00e1genes m\u00e1s populares en la web. Este servicio permite comprimir 500 im\u00e1genes al mes de forma gratuita a trav\u00e9s de sus API. Por m\u00e1s de 500 im\u00e1genes, debes pagarlas.<\/p>\n<p>Si tiene que optimizar m\u00e1s de 500 im\u00e1genes por mes y no quiere pagar, utilice el paquete &#8216;artisansweb \/ image-optimizer&#8217;. Este paquete utiliza el servicio <a href=\"https:\/\/resmush.it\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">reSmush.it<\/a> para optimizar la imagen.<\/p>\n<p>Recomendar\u00eda probar ambas soluciones, comparar el resultado y elegir la que sea adecuada para usted.<\/p>\n<p>Habiendo dicho eso, echemos un vistazo a c\u00f3mo comprimir im\u00e1genes despu\u00e9s de cargarlas.<\/p>\n<h3>Empezando con TinyPNG<\/h3>\n<p>Para comenzar, debe obtener una clave API de TinyPNG. <a href=\"https:\/\/tinypng.com\/developers\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Haga clic aqu\u00ed<\/a> para obtener su clave API. Solo necesita ingresar su nombre y direcci\u00f3n de correo electr\u00f3nico y recibir\u00e1 el correo electr\u00f3nico de su clave.<\/p>\n<p><a href=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20292-6081d911e6af9.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/04\/post-20292-6081d911e6af9.png\" alt=\"Cargar y comprimir varias im\u00e1genes en PHP\" ><\/a><\/p>\n<p>Una vez que obtenga su clave de desarrollador, instale una biblioteca PHP proporcionada por TinyPNG. Debe tener <a href=\"https:\/\/getcomposer.org\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Composer<\/a> instalado en el sistema para instalar la biblioteca. Abra la terminal en el directorio ra\u00edz de su proyecto y ejecute el comando:<\/p>\n<pre><code>composer require tinify\/tinify<\/code><\/pre>\n<h3>C\u00f3mo comprimir im\u00e1genes usando TinyPNG<\/h3>\n<p>Como se menciona en el t\u00edtulo de este art\u00edculo, veremos c\u00f3mo cargar y comprimir varias im\u00e1genes. Para esto, necesitamos crear un formulario HTML que tenga entrada de archivo para buscar m\u00faltiples im\u00e1genes. Cree <code>index.php<\/code>y coloque el siguiente c\u00f3digo en \u00e9l.<\/p>\n<p><strong>index.php<\/strong><\/p>\n<pre><code>&lt;form method=\"post\" enctype=\"multipart\/form-data\" action=\"process_images.php\"&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;p&gt;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;label&gt;Upload Images&lt;\/label&gt;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0&lt;input type=\"file\" name=\"images[]\" accept=\"image\/*\" multiple&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;\/p&gt;\n\u00a0\u00a0\u00a0\u00a0&lt;button type=\"submit\" name=\"submit\"&gt;Submit&lt;\/button&gt;\n&lt;\/form&gt;<\/code><\/pre>\n<p>A la entrada del archivo le di un nombre como im\u00e1genes []. Esto se debe a que en el lado del servidor necesitamos una serie de archivos, ya que el usuario buscar\u00e1 varias im\u00e1genes.<\/p>\n<p>Una vez que examinemos las im\u00e1genes y presionemos el bot\u00f3n de enviar, se enviar\u00e1n los datos del formulario al archivo <code>process_images.php<\/code>. Este es el archivo donde necesitamos escribir un c\u00f3digo para cargar y comprimir im\u00e1genes.<\/p>\n<p><strong>process_images.php<\/strong><\/p>\n<pre><code>&lt;?php\n\/\/ Increase PHP execution time\nset_time_limit(0);\n\u00a0\nrequire_once(\"vendor\/autoload.php\");\nTinifysetKey(\"YOUR_API_KEY\");\n\u00a0\nif (isset($_POST['submit'])) {\n\u00a0\u00a0\u00a0\u00a0$supported_images = array('image\/gif', 'image\/jpg', 'image\/jpeg', 'image\/png');\n\u00a0\n\u00a0\u00a0\u00a0\u00a0if (!file_exists(getcwd(). '\/uploads')) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0mkdir(getcwd(). '\/uploads', 0777);\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0foreach($_FILES['images']['name'] as $key=&gt;$val) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$file_name = $_FILES['images']['name'][$key];\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ get file extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$ext = strtolower(pathinfo($file_name, PATHINFO_EXTENSION));\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ get filename without extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filenamewithoutextension = pathinfo($file_name, PATHINFO_FILENAME);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (in_array($_FILES['images']['type'][$key], $supported_images)) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filename_to_store = $filenamewithoutextension.'_'.time().'.' .$ext;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0move_uploaded_file($_FILES['images']['tmp_name'][$key], getcwd().'\/uploads\/'.$filename_to_store);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ optimize image using TinyPNG\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0try {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$source = TinifyfromFile(getcwd().'\/uploads\/'.$filename_to_store);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$source-&gt;toFile(getcwd().'\/uploads\/'.$filename_to_store);\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} catch(Exception $e) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo $e-&gt;getMessage();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0exit;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0echo \"Files uploaded successfully.\";\n}<\/code><\/pre>\n<p>Aseg\u00farese de reemplazar el marcador de posici\u00f3n con su clave API real. En el c\u00f3digo anterior, estamos generando un nombre de archivo \u00fanico agregando tiempo. Una vez que se carga una imagen en el servidor, enviamos la imagen a la API de TinyPNG para su optimizaci\u00f3n. A cambio, obtenemos la versi\u00f3n comprimida de la imagen que almacenamos en el mismo lugar y con el mismo nombre de archivo.<\/p>\n<h3>Comprimir im\u00e1genes usando el paquete artisansweb \/ image-optimizer<\/h3>\n<p>He desarrollado el paquete <a href=\"https:\/\/github.com\/artisansweb\/image-optimizer\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Image Optimizer<\/a>. Este paquete utiliza el servicio <a href=\"https:\/\/resmush.it\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">reSmush.it<\/a> bajo el cap\u00f3 para optimizar im\u00e1genes. Si est\u00e1 buscando un servicio gratuito, pruebe este paquete. El reSmush.it ha optimizado miles de millones de im\u00e1genes hasta ahora. Este paquete no requiere proporcionar ninguna clave o registro. Simplemente con\u00e9ctelo y listo.<\/p>\n<p>Para comenzar con el paquete Image Optimizer, inst\u00e1lelo usando el comando:<\/p>\n<pre><code>composer require artisansweb\/image-optimizer<\/code><\/pre>\n<p>A continuaci\u00f3n, el c\u00f3digo en el <code>process_image.php<\/code>se modificar\u00e1 de la siguiente manera.<\/p>\n<pre><code>&lt;?php\n\/\/ Increase PHP execution time\nset_time_limit(0);\n\u00a0\nrequire_once(\"vendor\/autoload.php\");\n\u00a0\nuse ArtisansWebOptimizer;\n\u00a0\nif (isset($_POST['submit'])) {\n\u00a0\u00a0\u00a0\u00a0$supported_images = array('image\/gif', 'image\/jpg', 'image\/jpeg', 'image\/png');\n\u00a0\n\u00a0\u00a0\u00a0\u00a0if (!file_exists(getcwd(). '\/uploads')) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0mkdir(getcwd(). '\/uploads', 0777);\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0foreach($_FILES['images']['name'] as $key=&gt;$val) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$file_name = $_FILES['images']['name'][$key];\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ get file extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$ext = strtolower(pathinfo($file_name, PATHINFO_EXTENSION));\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ get filename without extension\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filenamewithoutextension = pathinfo($file_name, PATHINFO_FILENAME);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0if (in_array($_FILES['images']['type'][$key], $supported_images)) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$filename_to_store = $filenamewithoutextension.'_'.time().'.' .$ext;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0move_uploaded_file($_FILES['images']['tmp_name'][$key], getcwd().'\/uploads\/'.$filename_to_store);\n\u00a0\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\/\/ optimize image\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0try {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$img = new Optimizer();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$source = getcwd().'\/uploads\/'.$filename_to_store;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0$img-&gt;optimize($source);\n\u00a0\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0} catch(Exception $e) {\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0echo $e-&gt;getMessage();\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0exit;\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0}\n\u00a0\u00a0\u00a0\u00a0echo \"Files uploaded successfully.\";\n}<\/code><\/pre>\n<p>Espero que comprenda c\u00f3mo cargar y comprimir varias im\u00e1genes en PHP. Me gustar\u00eda escuchar sus pensamientos y sugerencias en la secci\u00f3n de comentarios a continuaci\u00f3n.<\/p>\n<h4>Art\u00edculos relacionados<\/h4>\n<ul>\n<li><a href=\"https:\/\/themewp.inform.click\/es\/arrastrar-y-soltar-carga-de-archivos-usando-javascript-y-php\/\" title=\"Arrastrar y soltar carga de archivos usando JavaScript y PHP\">Arrastrar y soltar carga de archivos usando JavaScript y PHP<\/a><\/li>\n<li><a href=\"https:\/\/themewp.inform.click\/es\/cambiar-el-tamano-de-la-imagen-en-php-usando-la-biblioteca-de-imagenes-de-intervencion\/\" title=\"Cambiar el tama\u00f1o de la imagen en PHP usando la biblioteca de im\u00e1genes de intervenci\u00f3n\">Cambiar el tama\u00f1o de la imagen en PHP usando la biblioteca de im\u00e1genes de intervenci\u00f3n<\/a><\/li>\n<li><a href=\"https:\/\/themewp.inform.click\/es\/cargar-imagen-usando-la-biblioteca-bulletproof-en-php\/\" title=\"Cargar imagen usando la biblioteca a prueba de balas en PHP\">Cargar imagen usando la biblioteca a prueba de balas en PHP<\/a><\/li>\n<\/ul>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fuente de grabaci\u00f3n:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/artisansweb.net\" class=\"external external_icon\">artisansweb.net<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00bfEst\u00e1 buscando cargar y comprimir varias im\u00e1genes en PHP? En este art\u00edculo mostramos c\u00f3mo comprimir im\u00e1genes despu\u00e9s de subirlas al servidor.<\/p>\n","protected":false},"author":1,"featured_media":21612,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[271],"tags":[849],"class_list":["post-29167","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-php-2","tag-affiai-es"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts\/29167","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/comments?post=29167"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/posts\/29167\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/media\/21612"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/media?parent=29167"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/categories?post=29167"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/es\/wp-json\/wp\/v2\/tags?post=29167"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}