{"id":1608,"date":"2012-12-20T06:30:03","date_gmt":"2012-12-20T05:30:03","guid":{"rendered":"http:\/\/www.manuelmarangoni.it\/sir-bit\/?p=1608"},"modified":"2013-05-26T14:03:18","modified_gmt":"2013-05-26T13:03:18","slug":"php-form-e-controlli-per-lupload-di-immagini-da-parte-dellutente","status":"publish","type":"post","link":"https:\/\/www.manuelmarangoni.it\/sir-bit\/1608\/php-form-e-controlli-per-lupload-di-immagini-da-parte-dellutente\/","title":{"rendered":"PHP &#8211; Form e controlli per l&#8217;upload di immagini da parte dell&#8217;utente"},"content":{"rendered":"<div id=\"attachment_1612\" style=\"width: 291px\" class=\"wp-caption aligncenter\"><a class=\"lightbox\" title=\"Quando si lascia all'utente la possibilit\u00e0 di caricare un'immagine, \u00e8 sempre bene approntare pi\u00f9 livelli di controllo: peso, dimensioni, estensione del file\" href=\"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-content\/uploads\/2012\/12\/Piani-di-luce-nella-mente.jpg\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-1612\" class=\"size-medium wp-image-1612 \" style=\"margin-bottom: 5px;\" title=\"Piani di luce nella mente\" alt=\"Piani di luce azzurra su sagoma di testa umana\" src=\"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-content\/uploads\/2012\/12\/Piani-di-luce-nella-mente-281x300.jpg\" width=\"281\" height=\"300\" srcset=\"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-content\/uploads\/2012\/12\/Piani-di-luce-nella-mente-281x300.jpg 281w, https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-content\/uploads\/2012\/12\/Piani-di-luce-nella-mente.jpg 750w\" sizes=\"(max-width: 281px) 100vw, 281px\" \/><\/a><p id=\"caption-attachment-1612\" class=\"wp-caption-text\">Quando si lascia all&#8217;utente la possibilit\u00e0 di caricare un&#8217;immagine, \u00e8 sempre bene approntare pi\u00f9 livelli di controllo: peso, dimensioni, estensione del file (1)<\/p><\/div>\n<p>In questo tutorial di base vedremo come realizzare un semplice form per il caricamento di immagini da parte dell&#8217;utente, comprensivo di controlli.<\/p>\n<p>Una volta inviato il form, <strong>il php si occuper\u00e0 di controllare:<\/strong><br \/>\n&#8211; che il file rientri entro certe dimensioni di peso<br \/>\n&#8211; che il file sia entro determinate dimensioni di larghezza e altezza (in pixel)<br \/>\n&#8211; che il file inviato sia di tipo immagine e cio\u00e8 che abbia l&#8217;estensione gif, jpg o png<\/p>\n<p>Lo<strong> script \u00e8 liberamente scaricabile<\/strong> e gi\u00e0 pronto per essere integrato nel vostro sito, con le dovute modifiche alle variabili numeriche e all&#8217;aspetto della pagina (che qui \u00e8 lasciata volutamente spartana).<\/p>\n<div style=\"float: left; width: 100%; margin-top: 60px; margin-bottom: 40px;\">\n<div style=\"float: left; width: 100px;\"><img decoding=\"async\" title=\"PHP - Form e controlli per l'upload di immagini da parte dell'utente\" alt=\"PHP - Form e controlli per l'upload di immagini da parte dell'utente\" src=\"https:\/\/www.manuelmarangoni.it\/images\/zip_logo-80x80.png\" \/><\/div>\n<div style=\"float: left; width: 350px; padding-top: 30px; font-size: 14px;\"><strong><a title=\"PHP - Form e controlli per l'upload di immagini da parte dell'utente\" href=\"https:\/\/www.manuelmarangoni.it\/download_script.php?idfile=32&amp;link=https:\/\/www.manuelmarangoni.it\/sir-bit\/?p=1608\" target=\"_blank\">Scarica gli script di questo articolo in formato zip<\/a><\/strong><\/div>\n<\/div>\n<h3 style=\"margin-top: 50px; margin-bottom: 20px; color: #c00;\">Form di invio<\/h3>\n<p>Il form non ha niente di particolare.<br \/>\nL&#8217;input sar\u00e0 di tipo file. Ricordatevi, inoltre, di <strong>inserire il parametro &#8220;enctype&#8221;<\/strong> nel tag del form.<\/p>\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"line_numbers\">\n<pre>1\r\n2\r\n3\r\n4\r\n5<\/pre>\n<\/td>\n<td class=\"code\">\n<pre class=\"html4strict\" style=\"font-family: monospace;\"><span style=\"color: #009900;\">&lt;<span style=\"color: #000000; font-weight: bold;\">form<\/span> <span style=\"color: #000066;\">action<\/span><span style=\"color: #66cc66;\">=<\/span><span style=\"color: #ff0000;\">\"\"<\/span> <span style=\"color: #000066;\">method<\/span><span style=\"color: #66cc66;\">=<\/span><span style=\"color: #ff0000;\">\"post\"<\/span> <span style=\"color: #000066;\">enctype<\/span><span style=\"color: #66cc66;\">=<\/span><span style=\"color: #ff0000;\">\"multipart\/form-data\"<\/span>&gt;<\/span>\r\n\t<span style=\"color: #009900;\">&lt;<span style=\"color: #000000; font-weight: bold;\">input<\/span> <span style=\"color: #000066;\">name<\/span><span style=\"color: #66cc66;\">=<\/span><span style=\"color: #ff0000;\">\"image\"<\/span> <span style=\"color: #000066;\">type<\/span><span style=\"color: #66cc66;\">=<\/span><span style=\"color: #ff0000;\">\"file\"<\/span> <span style=\"color: #66cc66;\">\/<\/span>&gt;<\/span>\r\n\t<span style=\"color: #009900;\">&lt;<span style=\"color: #000000; font-weight: bold;\">br<\/span> <span style=\"color: #66cc66;\">\/<\/span>&gt;&lt;<span style=\"color: #000000; font-weight: bold;\">br<\/span> <span style=\"color: #66cc66;\">\/<\/span>&gt;<\/span>\r\n\t<span style=\"color: #009900;\">&lt;<span style=\"color: #000000; font-weight: bold;\">input<\/span> <span style=\"color: #000066;\">name<\/span><span style=\"color: #66cc66;\">=<\/span><span style=\"color: #ff0000;\">\"invia\"<\/span> <span style=\"color: #000066;\">type<\/span><span style=\"color: #66cc66;\">=<\/span><span style=\"color: #ff0000;\">\"submit\"<\/span> <span style=\"color: #000066;\">value<\/span><span style=\"color: #66cc66;\">=<\/span><span style=\"color: #ff0000;\">\"Carica immagine\"<\/span> <span style=\"color: #66cc66;\">\/<\/span>&gt;<\/span>\r\n<span style=\"color: #009900;\">&lt;<span style=\"color: #66cc66;\">\/<\/span><span style=\"color: #000000; font-weight: bold;\">form<\/span>&gt;<\/span><\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p><!--more--><\/p>\n<h3 style=\"margin-top: 50px; margin-bottom: 20px; color: #c00;\">I controlli dopo l&#8217;invio<\/h3>\n<p>Adesso diamo una rapida occhiata ai <strong>controlli da effettuare una volta inviato<\/strong> il form.<br \/>\nAnche in questo caso lo script dovrebbe essere molto chiaro: prima di tutto si controlla se il file sia stato uploadato, quindi saranno effettuati (in ordine) le verifiche su peso, dimensioni e tipologia. Da notare che il peso del file \u00e8 caricato in bytes (1 kilobyte = 1024 byte).<br \/>\nInoltre, se esiste gi\u00e0 un file con il nome del file caricato, l&#8217;upload sar\u00e0 bloccato per impedire una sovrascrizione.<\/p>\n<p><script type=\"text\/javascript\">\/\/ <![CDATA[\ngoogle_ad_client = \"ca-pub-9984963620559913\"; \/* Sir Bit - post singolo rettangolare *\/ google_ad_slot = \"5334366715\"; google_ad_width = 336; google_ad_height = 280;\n\/\/ ]]><\/script><br \/>\n<script type=\"text\/javascript\" src=\"http:\/\/pagead2.googlesyndication.com\/pagead\/show_ads.js\">\/\/ <![CDATA[\n\n\/\/ ]]><\/script><\/p>\n<p>L&#8217;unica cosa che dovete fare, \u00e8 <strong>cambiare i parametri numerici<\/strong> delle dimensioni.<\/p>\n<div class=\"wp_syntax\">\n<table>\n<tbody>\n<tr>\n<td class=\"line_numbers\">\n<pre>1\r\n2\r\n3\r\n4\r\n5\r\n6\r\n7\r\n8\r\n9\r\n10\r\n11\r\n12\r\n13\r\n14\r\n15\r\n16\r\n17\r\n18\r\n19\r\n20\r\n21\r\n22\r\n23\r\n24\r\n25\r\n26\r\n27<\/pre>\n<\/td>\n<td class=\"code\">\n<pre class=\"php\" style=\"font-family: monospace;\"><span style=\"color: #b1b100;\">if<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #990000;\">is_uploaded_file<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$_FILES<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'image'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'tmp_name'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">)<\/span><span style=\"color: #009900;\">)<\/span> <span style=\"color: #009900;\">{<\/span>\r\n\r\n\t<span style=\"color: #666666; font-style: italic;\">\/\/controllo che il file non superi i 100 KB (1 kilobyte = 1024 byte)<\/span>\r\n\t<span style=\"color: #b1b100;\">if<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$_FILES<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'image'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'size'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #339933;\">&gt;<\/span><span style=\"color: #cc66cc;\">102400<\/span><span style=\"color: #009900;\">)<\/span>\r\n\t\t<span style=\"color: #000088;\">$messaggio<\/span><span style=\"color: #339933;\">.=<\/span><span style=\"color: #0000ff;\">\"Il file ha dimensioni che superano i 100 KB&lt;br \/&gt;\"<\/span><span style=\"color: #339933;\">;<\/span>\r\n\r\n\t<span style=\"color: #666666; font-style: italic;\">\/\/recupero le informazioni sull'immagine<\/span>\r\n\t<span style=\"color: #990000;\">list<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$width<\/span><span style=\"color: #339933;\">,<\/span> <span style=\"color: #000088;\">$height<\/span><span style=\"color: #339933;\">,<\/span> <span style=\"color: #000088;\">$type<\/span><span style=\"color: #339933;\">,<\/span> <span style=\"color: #000088;\">$attr<\/span><span style=\"color: #009900;\">)<\/span><span style=\"color: #339933;\">=<\/span><span style=\"color: #990000;\">getimagesize<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$_FILES<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'image'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'tmp_name'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">)<\/span><span style=\"color: #339933;\">;<\/span>\r\n\r\n\t<span style=\"color: #666666; font-style: italic;\">\/\/controllo che le dimensioni (in pixel) non superino 800x600<\/span>\r\n\t<span style=\"color: #b1b100;\">if<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$width<\/span><span style=\"color: #339933;\">&gt;<\/span><span style=\"color: #cc66cc;\">800<\/span><span style=\"color: #009900;\">)<\/span> or <span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$height<\/span><span style=\"color: #339933;\">&gt;<\/span><span style=\"color: #cc66cc;\">600<\/span><span style=\"color: #009900;\">)<\/span><span style=\"color: #009900;\">)<\/span>\r\n\t\t<span style=\"color: #000088;\">$messaggio<\/span><span style=\"color: #339933;\">.=<\/span><span style=\"color: #0000ff;\">\"Il file non deve superare le dimensioni di 800x600&lt;br \/&gt;\"<\/span><span style=\"color: #339933;\">;<\/span>\r\n\r\n\t<span style=\"color: #666666; font-style: italic;\">\/\/controllo che il file sia in uno dei formati GIF, JPG o PNG<\/span>\r\n\t<span style=\"color: #b1b100;\">if<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$type<\/span><span style=\"color: #339933;\">!=<\/span><span style=\"color: #cc66cc;\">1<\/span><span style=\"color: #009900;\">)<\/span> and <span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$type<\/span><span style=\"color: #339933;\">!=<\/span><span style=\"color: #cc66cc;\">2<\/span><span style=\"color: #009900;\">)<\/span> and <span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$type<\/span><span style=\"color: #339933;\">!=<\/span><span style=\"color: #cc66cc;\">3<\/span><span style=\"color: #009900;\">)<\/span><span style=\"color: #009900;\">)<\/span>\r\n\t\t<span style=\"color: #000088;\">$messaggio<\/span><span style=\"color: #339933;\">.=<\/span><span style=\"color: #0000ff;\">\"Il file caricato deve essere un'immagine&lt;br \/&gt;\"<\/span><span style=\"color: #339933;\">;<\/span>\r\n\r\n\t<span style=\"color: #666666; font-style: italic;\">\/\/controllo che non esiste gi\u00e0 un file con lo stesso nome<\/span>\r\n\t<span style=\"color: #b1b100;\">if<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #990000;\">file_exists<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #0000ff;\">'upload_img\/'<\/span><span style=\"color: #339933;\">.<\/span><span style=\"color: #000088;\">$_FILES<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'image'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'name'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">)<\/span><span style=\"color: #009900;\">)<\/span>\r\n\t\t<span style=\"color: #000088;\">$messaggio<\/span><span style=\"color: #339933;\">.=<\/span><span style=\"color: #0000ff;\">\"Esiste gi\u00e0 un file con lo stesso nome. Rinominare l'immagine prima di caricarla&lt;br \/&gt;\"<\/span><span style=\"color: #339933;\">;<\/span>\r\n\r\n\t<span style=\"color: #666666; font-style: italic;\">\/\/salvo il file nella cartella di destinazione<\/span>\r\n\t<span style=\"color: #b1b100;\">if<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #339933;\">!<\/span><span style=\"color: #990000;\">move_uploaded_file<\/span><span style=\"color: #009900;\">(<\/span><span style=\"color: #000088;\">$_FILES<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'image'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'tmp_name'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #339933;\">,<\/span> <span style=\"color: #0000ff;\">'upload_img\/'<\/span><span style=\"color: #339933;\">.<\/span><span style=\"color: #000088;\">$_FILES<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'image'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">[<\/span><span style=\"color: #0000ff;\">'name'<\/span><span style=\"color: #009900;\">]<\/span><span style=\"color: #009900;\">)<\/span><span style=\"color: #009900;\">)<\/span>\r\n\t\t<span style=\"color: #000088;\">$messaggio<\/span><span style=\"color: #339933;\">.=<\/span><span style=\"color: #0000ff;\">\"Errore imprevisto nel caricamento del file. Controllare i permessi della cartella di destinazione\"<\/span><span style=\"color: #339933;\">;<\/span>\r\n\r\n<span style=\"color: #009900;\">}<\/span><\/pre>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div style=\"margin-top: 100px; margin-bottom: 20px;\"><strong><em>Copyright immagini<\/em><\/strong><\/div>\n<p>(1) http:\/\/www.futuretimeline.net\/22ndcentury\/2100-2149.htm<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Un tutorial di base che mostra come creare un form per permettere l&#8217;upload di un&#8217;immagine all&#8217;utente. Saranno controllati con php dimensioni, peso ed estensione.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[78],"tags":[31,4,6,46],"class_list":["post-1608","post","type-post","status-publish","format-standard","hentry","category-php-mysql","tag-file","tag-php","tag-script","tag-tutorial","cat-78-id"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/posts\/1608"}],"collection":[{"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/comments?post=1608"}],"version-history":[{"count":9,"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/posts\/1608\/revisions"}],"predecessor-version":[{"id":1879,"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/posts\/1608\/revisions\/1879"}],"wp:attachment":[{"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/media?parent=1608"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/categories?post=1608"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.manuelmarangoni.it\/sir-bit\/wp-json\/wp\/v2\/tags?post=1608"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}