Tạo một ứng dụng upload hình ảnh lên Flickr bằng PHP

Flickr có giao diện lập trình ứng dụng mở (viết tắt là API). Điều này có nghĩa là ai cũng có thể viết chương trình của riêng mình để trộn lại dữ liệu Flickr (như ảnh, video, từ khóa, hồ sơ hoặc nhóm) theo những cách khác nhau.

Xem Demo

Có rất nhiều trường hợp mà bạn cần phải tạo ra một ứng dụng nhỏ cho trang web của bạn để bất cứ ai cũng có thể tải hình ảnh của họ lên để chèn vào bài viết. Trong bài này, tôi sẽ hướng dẫn cho bạn làm thế nào để có thể tạo ra một trang upload hình ảnh đơn giản lên server của FLickr bằng cách sử dụng thư viện phpFlickr. Với dung lượng lên tới 1Terabyle bạn có thể upload lên mà không phải lo lắn về dung lượng lưu trữ.

Đầu tiên, tạo một tài khoản Flickr

Bạn có thể đăng nhập vào Flickr qua Yahoo! hay Google hay Facebook. Bạn có thể đăng ký với flickr bằng cách click vào Tạo tài khoản Flickr. Bạn nên sử dụng bằng tài khoản của Yahoo! vì Flickr thuộc sở hữu của Yahoo!.

Tạo một ứng dụng Flickr

Bạn có thể xem các ứng dụng Flickr của bạn tại Flickr Apps . Thực hiện theo các bước dưới đây để tạo ra một ứng dụng flickr mới:

• Để tạo một ứng dụng mới bạn vào địa chỉ: http://www.flickr.com/services/apps/create/noncommercial/
• Điền vào tên của ứng dụng và mô tả ứng dụng của bạn.
• Sau khi hoàn thành, bạn sẽ nhận được "API Key" và "Secret" cho ứng dụng của bạn. Lưu ý rằng API Key và Secret là cái mà chúng ta cần tìm.

Bạn có thể xem tài liệu hướng dẫn Flickr API tại http://www.flickr.com/services/api/ . Hoặc bạn có thể sử dụng API Flickr trực tiếp để xây dựng ứng dụng upload hoặc bạn có thể sử dụng thư viện phpFlickr một wrapper php trên Flickr API. Ở đây ta sử dụng thư viện phpFlickr để truy cập vào Flickr API.

Bạn có thể tải về thư viện phpFlickr tại https://github.com/dan-coulter/phpflickr.

Upload tất cả các tập tin trong thư viện phpFlickr lên host của bạn. Bước tiếp theo là phần quan trọng nhất của việc tải lên hình ảnh lên server Flickr

Tạo API token

Trong thư mục phpFlickr, bạn sẽ tìm thấy file getToken.php có nội dung như sau: 

<?php
    /* Last updated with phpFlickr 1.4
     *
     * If you need your app to always login with the same user (to see your private
     * photos or photosets, for example), you can use this file to login and get a
     * token assigned so that you can hard code the token to be used.  To use this
     * use the phpFlickr::setToken() function whenever you create an instance of 
     * the class.
     */

    require_once("phpFlickr.php");
    $apiKey = "3852cb4ed22186257f37ac0317a18b13";
    $secret = "4372fb4c075f7ef2";
    $perms = "write";
    $f = new phpFlickr($apiKey, $secret);
    
    if(!$_GET['frob']){
        $f->auth($perms);
    }else {
        $tokenArgs = $f->auth_getToken($_GET['frob']);
        echo "<pre>"; var_dump($tokenArgs); echo "</pre>";
    }
    
?>

Trước khi bạn chạy file getToken.php để lấy API Token thì trước tiên bạn phải sửa lại địa chỉ Callback URL trong ứng dụng của bạn (địa chỉ xác thực):

• Tại App Type chọn Web Aplication
• Tại Callback URL Gõ đường dẫn đến địa chỉ host mà bạn upload code của ứng dụng.
• Ví dụ: http://example.com/_path_/getToken.php Đây là địa chỉ trang web mà flickr sẽ chuyển hướng sau khi bạn thực hiện xác thực.
• Bấm SAVE CHANGES

Bây giờ, trong trình duyệt, chạy đường dẫn tới file getToken.php.

Ví dụ: http://example.com/_path_/getToken.php . Nếu bạn chưa đăng nhập vào tài khoản thì nó sẻ chuyển bạn đến trang đăng nhập. Sau khi đăng nhập, trang web sẽ được chuyển đến địa chỉ giống hình dưới, và bạn nhấn vào nút OK., I'LL AUTHORIZE IT như trong hình.

Sau khi thực hiện xong các thao tác trên, bạn sẽ thấy được cái mã xác thực API Token mà ta cần như hình dưới đây. Nó là phần quan trọng nhất mà ta cần, bạn copy và lưu lại ở chổ nào đó để chúc nửa ta sử dụng.

Bây giờ ta đả có API Token

Tiếp theo tạo 1 file có tên index.php ta sử lý các sự kiện upload lên như: chỉ cho upload file ảnh, file ảnh không quá 512 kb...

<?php
//Include phpFlickr
require_once("phpFlickr/phpFlickr.php");

$error=0;
$f = null;
if($_POST){
    /* Kiem tra hinh anh va ten hinh anh duoc goi  */
    if(!$_POST['name'] || !$_FILES["file"]["name"]){
        $error=1;
    }else{
        /* Kiem cac tra loi khi upload hinh anh */
        if ($_FILES["file"]["error"] > 0){
            echo "Error: " . $_FILES["file"]["error"] . "<br />";
        }else if($_FILES["file"]["type"] != "image/jpg" && $_FILES["file"]["type"] != "image/jpeg" && $_FILES["file"]["type"] != "image/png" && $_FILES["file"]["type"] != "image/gif"){
            /* Kiem tra loai dinh dang tap tin */
            $error = 3;
        }else if(intval($_FILES["file"]["size"]) > 525000){
            /* Cac tap tin lon hon 512 KB se bao loi*/
            $error = 4;
        }else{
            $dir= dirname($_FILES["file"]["tmp_name"]);
            $newpath=$dir."/".$_FILES["file"]["name"];
            rename($_FILES["file"]["tmp_name"],$newpath);
            /* Gọi hàm uploadPhoto */
            $status = uploadPhoto($newpath, $_POST["name"]);
            if(!$status) {
                $error = 2;
            }
         }
     }
} 

function uploadPhoto($path, $title) {
    $apiKey = "3852cb4ed22186257f37ac0317a18b13";
    $apiSecret = "4372fb4c075f7ef2";
    $permissions  = "write";
    $token        = "72157645610485491-15d46a8296f212ce";

    $f = new phpFlickr($apiKey, $apiSecret, false);
    $f->setToken($token);
    return $f->sync_upload($path, $title);
}
?>

Tạo 1 Form Upload cho người dùng tải hình ảnh lên. và 1 số hàm sử lý lỗi cơ bản như sau:

<body>
<div id="doc" class="yui-t7">
   <div id="hd" role="banner"><h1>Photo Uploader by www.nhatchanh.info</h1></div>
   <div id="bd" role="main">
   <div id="mainbar" class="yui-b">  

<?php
if (isset($_POST['name']) && $error==0) {
    echo "<h4>Hình ảnh của bạn vừa được tải lên <a href='https://www.flickr.com/photos/nhatchanh/' target='_blank'>dòng ảnh</a> của tôi.</h4>";

}else {
    if($error == 1){
        echo "  <font color='red'>Vui lòng cung cấp cả tên và một tập tin cần tải lên</font>";
    }else if($error == 2) {
        echo "  <font color='red'>Không thể tải ảnh của bạn, hãy thử lại</font>";
    }else if($error == 3){
        echo "  <font color='red'>Chỉ hỗ trợ các định dạng JPG, JPEG, PNG hoặc GIF</font>";
    }else if($error == 4){
        echo "  <font color='red'>Kích thước hình ảnh lớn hơn 512KB, xin vui lòng tải lên một hình ảnh dưới 512KB</font>";
    }
?>
  <h2>Tải hình ảnh lên Server Flickr!</h2>
  <form  method="post" accept-charset="utf-8" enctype='multipart/form-data'>
    <p>Tên ảnh:   <input type="text" name="name" value="" ></p>
    <p>Hình ảnh: <input type="file" name="file"/></p>
   <p><input type="submit" value="Tải lên" class="btn-primary"></p>
  </form>
  <?php
}
?>
     </div>
    </div>
</div>
</body>

Source code đầy đủ của file index.php

<?php
//Include phpFlickr
require_once("phpFlickr/phpFlickr.php");

$error=0;
$f = null;
if($_POST){
    /* Kiem tra hinh anh va ten hinh anh duoc goi  */
    if(!$_POST['name'] || !$_FILES["file"]["name"]){
        $error=1;
    }else{
        /* Kiem cac tra loi khi upload hinh anh */
        if ($_FILES["file"]["error"] > 0){
            echo "Error: " . $_FILES["file"]["error"] . "<br />";
        }else if($_FILES["file"]["type"] != "image/jpg" && $_FILES["file"]["type"] != "image/jpeg" && $_FILES["file"]["type"] != "image/png" && $_FILES["file"]["type"] != "image/gif"){
            /* Kiem tra loai dinh dang tap tin */
            $error = 3;
        }else if(intval($_FILES["file"]["size"]) > 525000){
            /* Cac tap tin lon hon 512 KB se bao loi*/
            $error = 4;
        }else{
            $dir= dirname($_FILES["file"]["tmp_name"]);
            $newpath=$dir."/".$_FILES["file"]["name"];
            rename($_FILES["file"]["tmp_name"],$newpath);
            /* Gọi hàm uploadPhoto */
            $status = uploadPhoto($newpath, $_POST["name"]);
            if(!$status) {
                $error = 2;
            }
         }
     }
} 

function uploadPhoto($path, $title) {
    $apiKey = "3852cb4ed22186257f37ac0317a18b13";
    $apiSecret = "4372fb4c075f7ef2";
    $permissions  = "write";
    $token        = "72157645610485491-15d46a8296f212ce";

    $f = new phpFlickr($apiKey, $apiSecret, false);
    $f->setToken($token);
    return $f->sync_upload($path, $title);
}
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
   <title>Photo Uploader by www.nhatchanh.info</title>
   <meta content='text/html; charset=utf-8' http-equiv='Content-Type'/>
   <link rel="stylesheet" href="http://yui.yahooapis.com/2.7.0/build/reset-fonts-grids/reset-fonts-grids.css" type="text/css">
   <link rel="stylesheet" href="style.css" type="text/css">
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
  
</head>
<body>
<div id="doc" class="yui-t7">
   <div id="hd" role="banner"><h1>Photo Uploader by www.nhatchanh.info</h1></div>
   <div id="bd" role="main">
   <div id="mainbar" class="yui-b">      

<?php
if (isset($_POST['name']) && $error==0) {
    echo "<h4>Hình ảnh của bạn vừa được tải lên <a href='https://www.flickr.com/photos/nhatchanh/' target='_blank'>dòng ảnh</a> của tôi.<br /><br /> Bấm <a href='https://www.flickr.com/photos/nhatchanh/".$status."'>vào đây xem hình ảnh vừa tải lên</a>.</h4>";
    
    // Lấy hình ảnh vừa upload
    $apiKey = "3852cb4ed22186257f37ac0317a18b13";
    $apiSecret = "4372fb4c075f7ef2";
    $f = new phpFlickr($apiKey, $apiSecret, false);
    $photo = $f->photos_getInfo($status,$secret = NULL );  
    $photoUrl = $f->buildPhotoURL($photo['photo']); 
    echo '<b>Link URL:</b>   <a href="'.$photoUrl.'" target="_blank">'.$photoUrl.'</a>';
    
}else {
    if($error == 1){
        echo "  <font color='red'>Vui lòng cung cấp cả tên và một tập tin cần tải lên</font>";
    }else if($error == 2) {
        echo "  <font color='red'>Không thể tải ảnh của bạn, hãy thử lại</font>";
    }else if($error == 3){
        echo "  <font color='red'>Chỉ hỗ trợ các định dạng JPG, JPEG, PNG hoặc GIF</font>";
    }else if($error == 4){
        echo "  <font color='red'>Kích thước hình ảnh lớn hơn 512KB, xin vui lòng tải lên một hình ảnh dưới 512KB</font>";
    }
?>
  <h2>Tải hình ảnh lên Server Flickr!</h2>
  <form  method="post" accept-charset="utf-8" enctype='multipart/form-data'>
    <p>Tên ảnh:   <input type="text" name="name" value="" ></p>
    <p>Hình ảnh: <input type="file" name="file"/></p>
   <p><input type="submit" value="Tải lên" class="btn-primary"></p>
  </form>
  <?php
}
?>
        </div>
    </div>
</div>
</body>
</html>

Xem DEMO Download Source

Lưu ý:

Với ví dụ trên tôi sử dụng api key, secret và token của tôi, bạn cần thay đổi api key, secret và token của bạn để hình ảnh được tải lên trên Photostream của bạn.

Tham khảo thêm:

• Flickr Services
• phpFlickr Library