Facebook和Google Plus API在我的网站上选择图像

时间:2014-05-06 05:12:19

标签: facebook api google-plus instagram

我是API新手。我正在一个允许个性化产品的网站上工作。我的意思是您可以根据需要个性化产品,从而可以从计算机中选择图像。但现在我的问题是我想允许用户从他们的社交网站(如Facebook,Google +,Instagram)中选择图像,以及他们也可以从他们的谷歌驱动器和保管箱中选择图像。

以下是我的测试索引文件。它只是通过链接显示图像。它不是动态的。我也想让它变得动态。

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <title>Display Facebook Page Photos On Your Website</title>

        <!-- Just adding some style -->
        <style type='text/css'>
        body{
            font-family: "Proxima Nova Regular","Helvetica Neue",Arial,Helvetica,sans-serif;
        }

        .fbAlbumImage, 
        .fbAlbum{
            float: left;
            height: 170px;
            padding: 10px; 
            width: 150px; 
        }
        </style>

    </head>
<body>

<!-- Just some heading -->
<div style='font-size: 16px; font-weight: bold; margin: 0 0 10px 0;'>
    This album is synchronized with this
    <a target="_blank" href='https://www.facebook.com/pages/COAN-Dummy-Page/221167777906963?sk=photos'>
        Dummy Page Album
    </a>
</div>
<?php
//include the fb php sdk
require 'fb-sdk/src/facebook.php';

$facebook = new Facebook(array(
    'appId'  => 'changeToYourAppId',
    'secret' => 'changeToYourAppSecret',
    'cookie' => true, // enable optional cookie support
));

//defining action index
isset( $_REQUEST['action'] ) ? $action = $_REQUEST['action'] : $action = "";

/*
 * This will show 
 */
if( $action == ''){
    echo "<p>COAN Dummy Page Albums</p>";

    // select albums from our dummy page
    $fql    =   "SELECT 
                    aid, cover_pid, name 
                FROM 
                    album 
                WHERE owner=221167777906963";

    $param  =   array(
        'method'    => 'fql.query',
        'query'     => $fql,
        'callback'  => ''
    );

    $fqlResult   =   $facebook->api($param);

    foreach( $fqlResult as $keys => $values ){

        //to get album cover
        $fql2    =   "select src from photo where pid = '" . $values['cover_pid'] . "'";
        $param2  =   array(
            'method'    => 'fql.query',
            'query'     => $fql2,
            'callback'  => ''
        );
        $fqlResult2   =   $facebook->api($param2);

        foreach( $fqlResult2 as $keys2 => $values2){
            $album_cover = $values2['src'];
        }

        //show the album
        echo "<div class='fbAlbum'>";
            echo "<a href='index.php?action=list_pics&aid=" . $values['aid'] . "&name=" . $values['name'] . "'>";
                echo "<img src='$album_cover' border='1'>";
            echo "</a>";
            echo "<div>{$values['name']}</div>";
        echo "</div>";

    }
}

/*
 * This will show the photo(s) on the clicked album.
 */
if( $action == 'list_pics'){

    isset( $_GET['name'] ) ? $album_name = $_GET['name'] : $album_name = "";

    echo "<div><a href='index.php'>Back To Albums</a> | Album Name: <b>" . $album_name . "</b></div>";

    // query all the images in the album
    $fql = "SELECT 
                pid, src, src_small, src_big, caption 
            FROM 
                photo 
            WHERE 
                aid = '" . $_REQUEST['aid'] ."' ORDER BY created DESC";

    $param  =   array(
        'method'    => 'fql.query',
        'query'     => $fql,
        'callback'  => ''
    );

    $fqlResult   =   $facebook->api($param);

    echo "<div id='gallery'>";

    foreach( $fqlResult as $keys => $values ){

        if( $values['caption'] == '' ){
            $caption = "";
        }else{
            $caption = $values['caption'];
        }   

        echo "<div class='fbAlbumImage'>";
            echo "<a href=\"" . $values['src_big'] . "\" title=\"" . $caption . "\">";
                echo "<img src='" . $values['src'] . "' />";
            echo "</a>"; 
        echo "</div>";
    }

    echo "</div>";
}
?>


<!-- activate jQuery lightbox -->
<script type="text/javascript" src="jQuery-lightbox/js/jquery.js"></script>
<script type="text/javascript" src="jQuery-lightbox/js/jquery.lightbox-0.5.js"></script>
<link rel="stylesheet" type="text/css" href="jQuery-lightbox/css/jquery.lightbox-0.5.css" media="screen" />

<script type="text/javascript">
$(function() {
    $('#gallery a').lightBox();
});
</script>

    </body>
</html>

enter code here

请帮我解决这个问题。

谢谢,

Ashish Shah

0 个答案:

没有答案