-1
facebook에서 제공하는 그래프 -API를 사용하고 있습니다. 버전은 3.1.0입니다. 내 코드는 정상적으로 작동하지만 앨범과 관계없이 사용자의 모든 이미지를 표시합니다.Facebook Graph API : 사용자 이미지를 현명하게 표시하고 싶습니다. [해결]
사용자가 선택한 앨범의 이미지 만 볼 수 있도록 코드를 변경하고 싶습니다.
이미지를 앨범으로 표시해야합니다. 아래
내 코드 :
index.php를
<?php
/**********************************************************************
* Plugin Name: Facebook Plugin *
* Plugin URI: http://www.picpixa.com/ *
* Version: 1.0 *
* Author: Ashish Shah *
* Description: Plugin To Import Images From User's Facebook Account *
* as well as post the image of personalized product to *
* his/her facebook account *
**********************************************************************/
session_start();
include_once '/home/picpixa/wp-config.php';
include_once "fbmain.php";
ini_set("display_errors",1);
?>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Facebook Images</title>
<!-- Bootstrap -->
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<style>
.loader {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
background: url('Images/page-loader.gif') 50% 50% no-repeat rgb(249,249,249);
}
</style>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function() {
$(".loader").fadeOut("slow");
});
function loader(){
$('#load').show();
}
function loadExistingImages(){
window.opener.$('#loader_img').show();
result=null;
window.opener.$('#fileupload').each(function() {
var that = this;
$.getJSON(this.action, function (result) {
if (result && result.length) {
window.opener.$(that).fileupload('option', 'done')
.call(that, null, {result: result});
//console.log('ss='+$('.table-striped tbody').find('.btn-danger').length);
if(window.opener.$('.table-striped tbody').find('.btn-danger').length>0){
window.opener.$('.coo-images-other-buttons').show();
}else{
window.opener.$('.coo-images-other-buttons').hide();
}
}
window.opener.$('#loader_img').hide();
if (window.opener.$('.table-striped tbody tr').length > 0)
{
window.opener.$('.table_tagline').show();
}
});
});
}
</script>
<script type="text/javascript">$('#load').hide();</script>
</head>
<?php
if(isset($_POST['copy']) && $_POST['facebook'])
{
$imgArray = $_POST['facebook'];
$current_user = wp_get_current_user();
if(isset($current_user->ID) && trim($current_user->ID)!='' && trim($current_user->ID)!=0){
$extraSessionStr = 'usr-'.md5($current_user->ID).'/';
$user = $current_user->ID;
}else{
$sesstionId = session_id();
$user = $sesstionId;
$extraSessionStr = $sesstionId.'/';
}
$i=1;
foreach ($imgArray as $img)
{
//$fileName=basename($img);
$imgExt = pathinfo($img); //This will become an array with keys ('dirname','basename','extension','filename')
$imageName = "FB-image";
$fileName=$imageName.".".$imgExt['extension'];
// Read file content
$file_content = file_get_contents($img);
//Check wether the file is exists or not rename the file if exists
if(!file_exists('/home/picpixa/server/php/files/'.$extraSessionStr.$fileName)){
file_put_contents('/home/picpixa/server/php/files/'.$extraSessionStr.$fileName, $file_content);
//file_put_contents('/home/picpixa/server/php/thumbnails/'.$extraSessionStr.$fileName, $file_content);
$i++;
}
else{
//echo "Entered in else part";
while(file_exists('/home/picpixa/server/php/files/'.$extraSessionStr.$fileName)){
$fileName = (string) $imageName.$i.".".$imgExt['extension'];
//echo "Value of i: $i<br>Image name: $fileName<br>";
$i++;
}
file_put_contents('/home/picpixa/server/php/files/'.$extraSessionStr.$fileName, $file_content);
}
//Get the image size
$imgsize=get_headers($img,1);
$imgsize = number_format(($imgsize["Content-Length"]/1024),2);
/* To create thumbnail */
// Max vert or horiz resolution
$maxsize=80;
// create new Imagick object
$image = new Imagick($img); //"input_image_filename_and_location"
// Resizes to whichever is larger, width or height
if($image->getImageHeight() <= $image->getImageWidth())
{
// Resize image using the lanczos resampling algorithm based on width
$image->resizeImage($maxsize,0,Imagick::FILTER_LANCZOS,1);
}
else
{
// Resize image using the lanczos resampling algorithm based on height
$image->resizeImage(0,$maxsize,Imagick::FILTER_LANCZOS,1);
}
// Set to use jpeg compression
$image->setImageCompression(Imagick::COMPRESSION_JPEG);
// Set compression level (1 lowest quality, 100 highest quality)
$image->setImageCompressionQuality(75);
// Strip out unneeded meta data
$image->stripImage();
// Writes resultant image to output directory
$image->writeImage('/home/picpixa/server/php/thumbnails/'.$extraSessionStr.$fileName); //"output_image_filename_and_location"
// Destroys Imagick object, freeing allocated resources in the process
$image->destroy();
}
?>
<script type="text/javascript">
//window.opener.$("#fileupload").append(div);
window.opener.$('tbody.files').find('tr').remove();
loadExistingImages();
</script>
<?php
echo "<h2>The selected images have been moved.<br></h2>";
echo "<h3>Please click on \"Proceed With Uploaded Images\" button to Proceed OR ";
echo "Click on the \"Upload More Images\" Button to upload more images.</h3>";
?>
<div class="modal-footer">
<input type='button' name='continue' value='Upload More Images' class='btn btn-primary' onclick='loader(); window.location.href="index.php";'>
<input type='button' name='closeWindow' value='Proceed With Uploaded Images' class='btn btn-primary' onClick="window.close();">
</div>
<?php
die();
}
elseif (isset($_POST['copy']))
{
echo "<h2>You have not selected any image(s) to move.</h2><br><br>";
echo "<h3>Please click on \"Close\" button to Close the window OR ";
echo "Click on the \"Upload Images\" Button to upload images.</h3>";
?>
<div class="modal-footer">
<input type='button' name='continue' value='Upload More Images' class='btn btn-primary' onclick='loader(); window.location.href="index.php";'>
<input type='button' name='closeWindow' value='Close' class='btn btn-primary' onClick="window.close();">
</div>
<?php
die();
}
?>
<script type="text/javascript">
function streamPublish(name, description, hrefTitle, hrefLink, userPrompt) {
FB.ui({method: 'feed',
message: userPrompt,
link: hrefLink,
caption: hrefTitle,
picture: ''
});
//http://developers.facebook.com/docs/reference/dialogs/feed/
}
function publishStream() {
streamPublish("Stream Publish", 'Checkout personalized products at www.picpixa.com. I found some of them are just awesome!', 'Checkout www.picpixa.com', 'http://www.picpixa.com', "Personalized Products");
}
</script>
<style type="text/css">
.box{
margin: 5px;
border: 1px solid #60729b;
padding: 5px;
width: 500px;
height: 200px;
overflow:auto;
background-color: #e6ebf8;
}
</style>
<div id="fb-root"></div>
<script type="text/javascript" src="http://connect.facebook.net/en_US/all.js"></script>
<script type="text/javascript">
FB.init({
appId: '',
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true // parse XFBML
});
</script>
<body>
<div id="load" class="loader"></div>
<div class="container">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="modal-footer">
<?php
echo "User: $user";
if (!$user) { ?>
<h1>You have to login using Facebook Login Button to see your uploaded images.</h1>
<a class='btn btn-primary' href="<?= $loginUrl ?>" onClick='loader()'><img src="Images/login.png"></a>
<?php } //else { ?>
<!-- <a class='btn btn-primary' href="<?= $logoutUrl ?>" onClick='loader()'><img src="Images/logout.png"></a>-->
<?php //} ?>
</div>
<!-- all time check if user session is valid or not -->
<?php if ($user) { ?>
<form method="post" action="index.php">
<div class="modal-body">
<!-- Data retrived from user profile are shown here -->
<?php
$i=0;
$showBtn=false;
$albums = $facebook->api("/me/albums");
foreach($albums['data'] as $album){
// get all photos for album
$photos = $facebook->api("/{$album['id']}/photos");
foreach($photos['data'] as $photo){
/* if($i%5 == 0)
{
echo "</tr>";
echo "<tr>";
}*/
?>
<div class="baby_img">
<input type="checkbox" id="facebook_<?=$i;?>" name="facebook[]" value="<?php echo $photo['source']?>" class="styled" />
<img src="<?php echo $photo['source']?>" width = "150px" height = "150px" class="img-responsive"/>
</div>
<?php
$i++;
$showBtn=true;
}
}
?>
</div>
<div class="clearfix"></div>
<div class="modal-footer">
<?php
if($showBtn){
echo"<input type='submit' name='copy' value='Copy Selected Files' class='btn btn-primary' onclick='loader()'>";
}
?>
<input type='button' name='closeWindow' value='Close This Window' class='btn btn-primary' onClick="window.close();">
</div>
</form>
<?php } ?>
</div>
</div>
</div>
</body>
</html>
사람이 제발 도와 드릴까요?
참고 :
: FB ({ "업데이트 FB.init을 정의되지 않은 : ReferenceError가이 http://connect.facebook.net/en_US/all.js"차단 로딩 액티브 콘텐츠를 혼합 ""및 "는 또한 같은의 스크립트 오류를 제공합니다
나는 태그를 닫기 전에 내 코드에 하나 개의 기능을 추가 한 말해서 능은 다음과 같습니다.
<script type="text/javascript">
function showAlbum(albumId){
alert('Album Id'+albumId);
var fbhtml = '';
<?php
$albmId = albumId;
// get all photos for album
$i=0;
$photos = $facebook->api("/".$albmId."/photos");
foreach($photos['data'] as $photo){ ?>
fbhtml += '<div class="baby_img">';
fbhtml += '<input type="checkbox" id="facebook_<?php echo $i; ?>" name="facebook[]" value="<?php echo $photo["source"]; ?>" class="styled" />';
fbhtml += '<img src="<?php echo $photo["source"]; ?>" class="img-responsive" style="width:100px !important; height:100px !important;" />';
fbhtml += '</div>';
<?php
$i++;
$showBtn=true;
}
?>
$('#fbhtmlImage').html(fbhtml);
}
</script>
함수가 작동하지만 원하는 출력을 얻지 못하고 있습니다. 내 앨범에없는 이미지가 나타납니다. 앨범에있는 이미지를 가져 오지 못합니다.
당신이 머리 사이에 HTML 코드의 대부분이를 사용하여 해결 : 여기
은 자바 스크립트 기능입니다 몸, 뭐하고 있니? 적절한 HTML 문서를 구조화하는 방법을 읽으십시오. 또한 fb가 문제를 일으키고, javascript API를 사용하여 개발자가 페이스 북에서 제공하는 코드를 모방합니다. –ok 그러면 fb 초기화를 사용하지 않고 "http : //connect.facebook .net/en_US/all.js "에 있습니다. 권리? 코드에서 제거해야합니까? andcource 나는 코드를 재구성 할 것이다. 제안 해 주셔서 감사합니다 .... –
@SyedQarib 당신이 내 목표를 달성하도록 도와 주시겠습니까? 한 번에 하나의 앨범 만 사진을 표시하고 싶습니다. 사진을 표시 할 앨범을 선택할 수 있습니다. –