{"id":27568,"date":"2021-05-09T15:07:00","date_gmt":"2021-05-09T12:07:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=27568"},"modified":"2021-10-17T05:06:51","modified_gmt":"2021-10-17T02:06:51","slug":"hur-man-laddar-upp-bilder-med-php-i-molnet-en-kostnadsfri-webbhotellstjanst","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/sv\/hur-man-laddar-upp-bilder-med-php-i-molnet-en-kostnadsfri-webbhotellstjanst\/","title":{"rendered":"Hur man laddar upp bilder med PHP i molnet – En kostnadsfri webbhotellstj\u00e4nst"},"content":{"rendered":"

CDN \u00e4r inte ett nytt ord f\u00f6r webbutvecklare. CDN betyder inneh\u00e5llsleveransn\u00e4tverk eller inneh\u00e5llsdistributionsn\u00e4tverk. Genom att vara v\u00e4rd f\u00f6r v\u00e5r CSS, JS och bilder p\u00e5 molnet och \u00e5tkomst via CDN minskar belastningen p\u00e5 v\u00e5r egen server vilket i slut\u00e4ndan hj\u00e4lper till med webbplatsens prestanda.<\/p>\n

N\u00e4r vi \u00e4r v\u00e4rd f\u00f6r v\u00e5ra filer i molnet och kommer \u00e5t dem via CDN levereras dessa filer fr\u00e5n tredjepartsservrar till v\u00e5r server. Denna process sparar ett extra samtal f\u00f6r filer och som en belastning p\u00e5 v\u00e5r egen server.<\/p>\n

Cloudinary<\/a> \u00e4r en bildtj\u00e4nst som l\u00e5ter oss hantera v\u00e5ra bilder och videor. De tillhandah\u00e5ller b\u00e5de kostnadsfria och betalda planer. Molnfri plan \u00e4r ganska bra. Nedan visas sk\u00e4rmdumpen av deras kostnadsfria plan.<\/p>\n

\"Hur<\/a><\/p>\n

I den h\u00e4r artikeln studerar vi hur man laddar upp bilder p\u00e5 Cloudinary, visar bilder fr\u00e5n Cloudinary med PHP.<\/p>\n

F\u00e5 API-nyckel och API-hemlighet<\/h3>\n

V\u00e5r applikation kommer att interagera med Cloudinary. F\u00f6r att kommunicera med Cloudinary m\u00e5ste vi skapa API-nycklar. F\u00f6r det m\u00e5ste du skapa ett konto<\/a> p\u00e5 Cloudinary och f\u00e5 dina API-nycklar. I v\u00e5rt fall kr\u00e4ver vi tre saker – molnnamn, API-nyckel och API-hemlighet. Du kommer att f\u00e5 alla dessa detaljer fr\u00e5n Cloudinary-instrumentpanelen.<\/p>\n

\"Hur<\/a><\/p>\n

N\u00e4sta sak du beh\u00f6ver g\u00f6ra \u00e4r att installera det officiella PHP-biblioteket i en Cloudinary<\/a>. Du b\u00f6r ha Composer<\/a> installerat p\u00e5 ditt system.<\/p>\n

\u00d6ppna terminalen i din projektkatalog och k\u00f6r kommandot nedan.<\/p>\n

composer require cloudinary\/cloudinary_php<\/code><\/pre>\n
Ladda upp bild p\u00e5 moln<\/h3>\n
Vi har skapat ett konto p\u00e5 Cloudinary och f\u00e5r v\u00e5ra API-referenser. Vi installerade ocks\u00e5 PHP-biblioteket. Nu \u00e4r vi redo att forts\u00e4tta och skriva en kod som laddar upp bilden p\u00e5 Cloudinary.<\/p>\n
<?php\nrequire_once \"vendor\/autoload.php\";\n\u00a0\nCloudinary::config(array( \n\u00a0\u00a0\u00a0\u00a0\"cloud_name\" => 'YOUR_CLOUD_NAME', \n\u00a0\u00a0\u00a0\u00a0\"api_key\" => 'YOUR_API_KEY', \n\u00a0\u00a0\u00a0\u00a0\"api_secret\" => 'YOUR_API_SECRET'\n));\n\u00a0\n$arr_result = CloudinaryUploader::upload(__DIR__. \"\/images\/sample.png\");\nprint_r($arr_result);\n?><\/code><\/pre>\n
I ovanst\u00e5ende kod m\u00e5ste du ers\u00e4tta platsh\u00e5llare med de faktiska v\u00e4rdena. Du b\u00f6r ocks\u00e5 ange en s\u00f6kv\u00e4g f\u00f6r din bild. I v\u00e5rt fall s\u00e4tter vi det till __DIR__. \"\/images\/sample.png\"<\/code>.<\/p>\n
N\u00e4r vi skriver ut svaret f\u00e5r vi utdata som nedan.<\/p>\n
Array ([public_id] => sample\n    [version] => 1312461204\n    [width] => 864\n    [height] => 576\n    [format] => jpg\n    [bytes] => 120253\n    [url] => https:\/\/res.cloudinary.com\/demo\/image\/upload\/v1371281596\/sample.jpg\n    [secure_url] => https:\/\/res.cloudinary.com\/demo\/image\/upload\/v1371281596\/sample.jpg\n)<\/code><\/pre>\n
H\u00e4r m\u00e5ste du lagra public_id eller secure_url (eller URL) i din databas. Genom att lagra secure_url kan du direkt skicka denna URL till HTML img-tagg och visa bilden. Vid public_id, f\u00f6r att visa bilden m\u00e5ste du skriva kod enligt nedan.<\/p>\n
<?php\necho cl_image_tag('PASTE_PUBLID_ID_HERE');\n?><\/code><\/pre>\n
Dessutom kan du st\u00e4lla in bredd, h\u00f6jd, alt-attribut med samma metod.<\/p>\n
<?php\necho cl_image_tag('PASTE_PUBLID_ID_HERE', ['alt' => 'test', 'width' => 100, 'height' => 150]);\n?><\/code><\/pre>\n
Du kanske ocks\u00e5 vill l\u00e4sa officiell Cloud-integrationsdokumentation<\/a> f\u00f6r Cloudinary .<\/p>\n
Vi hoppas att du f\u00f6rst\u00e5r hur du arbetar med Clodinary API: er. Vi rekommenderar att du anv\u00e4nder denna bildtj\u00e4nst som hj\u00e4lper dig att f\u00f6rb\u00e4ttra webbplatsens prestanda.<\/p>\n
Inspelningsk\u00e4lla:  artisansweb.net<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Cloudinary \u00e4r en gratis webbhotellstj\u00e4nst d\u00e4r vi kan lagra v\u00e5ra applikationsbilder och videor. I denna handledning studerar vi hur man laddar upp bilder p\u00e5<\/p>\n","protected":false},"author":1,"featured_media":22048,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[279],"tags":[850],"class_list":["post-27568","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-php-10","tag-affiai-sv"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/posts\/27568","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/comments?post=27568"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/posts\/27568\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/media\/22048"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/media?parent=27568"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/categories?post=27568"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/sv\/wp-json\/wp\/v2\/tags?post=27568"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}