Dropbox API logout url is not working properly

Question

I am using php sdk provided by dropbox to import images from user's account after the authorization. All is working perfectly. But the logout url (Which I have created) is not working properly.

Below is my code:

<!-- Bootstrap -->
<link href='https://www.picpixa.com/wp-content/plugins/create-own-object/plugin-dropbox/css/bootstrap.css' rel='stylesheet'>
<link href='https://www.picpixa.com/wp-content/plugins/create-own-object/plugin-dropbox/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");
    });
</script>
<script>
    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>

<?php
/***********************************************************************
 * Plugin Name: Dropbox Plugin
 * Plugin URI: http://www.picpixa.com/
 * Version: 1.0
 * Author: Ashish Shah
 * Description: Plugin To Import Images From User's Dropbox Account
 **********************************************************************/

session_start();
include_once '/home/picpixa/wp-config.php';
//ini_set("display_errors",0);
if(isset($_POST['copy']) && $_POST['dropbox'])
{
    $imgArray = $_POST['dropbox'];

    $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.'/';
    }

    foreach ($imgArray as $img)
    {
        $fileName=basename($img);
        // Read file content
        $file_content = file_get_contents($img);
        file_put_contents('/home/picpixa/server/php/files/'.$extraSessionStr.$fileName, $file_content);
        //file_put_contents('/home/picpixa/server/php/thumbnails/'.$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="";'>
            <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 Images' class='btn btn-primary' onclick='loader();window.location.href="";'>
                <input type='button' name='closeWindow' value='Close' class='btn btn-primary' onClick="window.close();">
            </div>
        <?php
            die();
        }

require_once __DIR__.'/dropbox-sdk/Dropbox/strict.php';

$appInfoFile = __DIR__."/AppInfo.json";

// NOTE: You should be using Composer's global autoloader. But just so these examples
// work for people who don't have Composer, we'll use the library's "autoload.php".
require_once __DIR__.'/dropbox-sdk/Dropbox/autoload.php';

use \Dropbox as dbx;
$requestPath = init();

if ($requestPath === "/") {
    $dbxClient = getClient();

    if ($dbxClient === false) {
        header("Location: ".getPath("dropbox-auth-start"));
        exit;
    }

    $path = "/";
    if (isset($_GET['path'])) $path = $_GET['path'];

    $entry = $dbxClient->getMetadataWithChildren($path);
    if ($entry['is_dir']) {
        echo renderFolder($entry);
    }
    else {
        echo renderFile($entry);
    }
}
else if ($requestPath == "/download") {
    $dbxClient = getClient();

    if ($dbxClient === false) {
        header("Location: ".getPath("dropbox-auth-start"));
        exit;
    }

    if (!isset($_GET['path'])) {
        header("Location: ".getPath(""));
        exit;
    }
    $path = $_GET['path'];

    $fd = tmpfile();
    $metadata = $dbxClient->getFile($path, $fd);

    header("Content-Type: $metadata[mime_type]");
    fseek($fd, 0);
    fpassthru($fd);
    fclose($fd);
}
else if ($requestPath === "/upload") {
    if (empty($_FILES['file']['name'])) {
        echo renderHtmlPage("Error", "Please choose a file to upload");
        exit;
    }

    if (!empty($_FILES['file']['error'])) {
        echo renderHtmlPage("Error", "Error ".$_FILES['file']['error']." uploading file. See <a href='http://php.net/manual/en/features.file-upload.errors.php'>the docs</a> for details");
        exit;
    }

    $dbxClient = getClient();

    $remoteDir = "/";
    if (isset($_POST['folder'])) $remoteDir = $_POST['folder'];

    $remotePath = rtrim($remoteDir, "/")."/".$_FILES['file']['name'];

    $fp = fopen($_FILES['file']['tmp_name'], "rb");
    $result = $dbxClient->uploadFile($remotePath, dbx\WriteMode::add(), $fp);
    fclose($fp);
    $str = print_r($result, TRUE);
    echo renderHtmlPage("Uploading File", "Result: <pre>$str</pre>");
}
else if ($requestPath === "/dropbox-auth-start") {
    $authorizeUrl = getWebAuth()->start();
    header("Location: $authorizeUrl");
}
else if ($requestPath === "/dropbox-auth-finish") {
    try {
        list($accessToken, $userId, $urlState) = getWebAuth()->finish($_GET);
        // We didn't pass in $urlState to finish, and we're assuming the session can't be
        // tampered with, so this should be null.
        assert($urlState === null);
    }
    catch (dbx\WebAuthException_BadRequest $ex) {
        respondWithError(400, "Bad Request");
        // Write full details to server error log.
        // IMPORTANT: Never show the $ex->getMessage() string to the user -- it could contain
        // sensitive information.
        error_log("/dropbox-auth-finish: bad request: " . $ex->getMessage());
        exit;
    }
    catch (dbx\WebAuthException_BadState $ex) {
        // Auth session expired. Restart the auth process.
        header("Location: ".getPath("dropbox-auth-start"));
        exit;
    }
    catch (dbx\WebAuthException_Csrf $ex) {
        respondWithError(403, "Unauthorized", "CSRF mismatch");
        // Write full details to server error log.
        // IMPORTANT: Never show the $ex->getMessage() string to the user -- it contains
        // sensitive information that could be used to bypass the CSRF check.
        error_log("/dropbox-auth-finish: CSRF mismatch: " . $ex->getMessage());
        exit;
    }
    catch (dbx\WebAuthException_NotApproved $ex) {
        echo renderHtmlPage("Not Authorized?", "Why not?");
        exit;
    }
    catch (dbx\WebAuthException_Provider $ex) {
        error_log("/dropbox-auth-finish: unknown error: " . $ex->getMessage());
        respondWithError(500, "Internal Server Error");
        exit;
    }
    catch (dbx\Exception $ex) {
        error_log("/dropbox-auth-finish: error communicating with Dropbox API: " . $ex->getMessage());
        respondWithError(500, "Internal Server Error");
        exit;
    }

    // NOTE: A real web app would store the access token in a database.
    $_SESSION['access-token'] = $accessToken;

    echo renderHtmlPage("Authorized!",
        "Authorization complete, <a href='".htmlspecialchars(getPath(""))."' onclick='loader()'>click here</a> to browse.");
}
else if ($requestPath === "/dropbox-auth-unlink") {
    // "Forget" the access token.
    unset($_SESSION['access-token']);
    //$_SESSION = array();

    echo renderHtmlPage("Logged Out",
        "<div class='modal-footer'>
            You have been logged out.<br>To Login Again click \"Login To Dropbox\"
            OR Click on the \"Proceed With Uploaded Images\" Button to upload more images.<br>
            <input type='button' name='login' value='Login To Dropbox' class='btn btn-primary' onClick='location.href = \"https://www.picpixa.com/wp-content/plugins/create-own-object/plugin-dropbox/index.php\";'>
            <input type='button' name='closeWindow' value='Close' class='btn btn-primary' onClick='window.close();'>
        </div>"
    );
}
else {
    echo renderHtmlPage("Bad URL", "No handler for $requestPath");
    exit;
}

function renderFolder($entry)
{
    /*echo "entry:<pre>";
    print_r($entry);
    echo "</pre>entry end.<br>Session:<pre>";
    print_r($_SESSION);
    echo "</pre>Session end.";
    die;*/
    $dbxClient = getClient();//Using to use the createTemporaryDirectLink() function

    // TODO: Add a token to counter CSRF attacks.
   // $upload_path = htmlspecialchars(getPath('upload'));
    //$path = htmlspecialchars($entry['path']);
    //$form = <<<HTML <form action='$upload_path' method='post' enctype='multipart/form-data'> <label for='file'>Upload file:</label> <input name='file' type='file'/> <input type='submit' value='Upload'/> <input name='folder' type='hidden' value='$path'/> </form> HTML;
    //$form =   <<<HTML HTML;
    $listing = "<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'>";
                if(isset($entry['contents']) && $entry['contents']){
                    $listing .= "<div class='modal-footer'>
                        <script>
                            function goDirect(){
                                alert(window.location);
                                window.location.href='dropbox-auth-unlink';
                            }
                        </script>
                        <input type='button' name='logout' value='Logout' class='btn btn-primary' onclick='goDirect()'>
                    </div>";
                }
                $listing .= "<form method='POST' action=''>
                    <div class='modal-body'>";
                        $i=0;
                        $showBtn=False;
                        foreach($entry['contents'] as $child) {
                            $type='Folder';
                            $cp = $child['path'];
                            $cn = basename($cp);
                            if (!$child['is_dir']){
                                $type=$child['mime_type'];
                            }
                            $cp = htmlspecialchars($cp);
                            $link = getPath("?path=".htmlspecialchars($cp));
                            if ($child['is_dir']){
                                $listing .= "<div class='baby_img'>Folder: <a style='text-decoration: none' href='$link'>$cn</a></div>";
                                $cn .= '/';
                            }
                            else{
                                if(strcmp($type,'image/*')==1){
                                    $img = $dbxClient->createTemporaryDirectLink($cp);
                                    $listing .= "<div class='baby_img'>
                                        <input type='checkbox' id='dropbox_".$i."' name='dropbox[]'  value='".$img[0]."' class='styled' />";
                                        $listing .= "<img src='".$img[0]."' height = '100px' width = '100px' class='img-responsive'/>";
                                    $listing .= '</div>';
                                    $i++;
                                    $showBtn=true;
                                }
                            }
                        }
                    $listing .= '<div class="clearfix"></div>
                    <div class="modal-footer">';
                        if($showBtn){
                            $listing .= "<input type='submit' name='copy' value='Copy Selected Files' class='btn btn-primary' onclick='loader()'>";
                        }
                        $listing .= "<input type='button' name='closeWindow' value='Close This Window' class='btn btn-primary' onClick='window.close();'>";
                    $listing .= '</div>';
                $listing .= "</form>
            </div>
        </div>
    </div>";
    return renderHtmlPage("App/picpixa$entry[path]", $listing);
}

function getAppConfig()
{
    global $appInfoFile;

    try {
        $appInfo = dbx\AppInfo::loadFromJsonFile($appInfoFile);
    }
    catch (dbx\AppInfoLoadException $ex) {
        throw new Exception("Unable to load \"$appInfoFile\": " . $ex->getMessage());
    }

    $clientIdentifier = "examples-web-file-browser";
    $userLocale = null;

    return array($appInfo, $clientIdentifier, $userLocale);
}

function getClient()
{
    if(!isset($_SESSION['access-token'])) {
        return false;
    }

    list($appInfo, $clientIdentifier, $userLocale) = getAppConfig();
    $accessToken = $_SESSION['access-token'];
    return new dbx\Client($accessToken, $clientIdentifier, $userLocale, $appInfo->getHost());
}

function getWebAuth()
{
    list($appInfo, $clientIdentifier, $userLocale) = getAppConfig();
    $redirectUri = getUrl("dropbox-auth-finish");
    $csrfTokenStore = new dbx\ArrayEntryStore($_SESSION, 'dropbox-auth-csrf-token');
    return new dbx\WebAuth($appInfo, $clientIdentifier, $redirectUri, $csrfTokenStore, $userLocale);
}

function renderFile($entry)
{
    $metadataStr = htmlspecialchars(print_r($entry, true));
    $downloadPath = getPath("download?path=".htmlspecialchars($entry['path']));
    $body = <<<HTML
<pre>$metadataStr</pre>
<a href="$downloadPath">Download this file</a>
HTML;

    return renderHtmlPage("File: ".$entry['path'], $body);
}

function renderHtmlPage($title, $body)
{
    return <<<HTML
        <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>$title</title>

                <!-- Bootstrap -->
                <link href='https://www.picpixa.com/wp-content/plugins/create-own-object/plugin-dropbox/css/bootstrap.css' rel='stylesheet'>
                <link href='https://www.picpixa.com/wp-content/plugins/create-own-object/plugin-dropbox/css/style.css' rel='stylesheet'>
            </head>
            <body>
                $body
            </body>
        </html>
HTML;
}

function respondWithError($code, $title, $body = "")
{
    $proto = $_SERVER['SERVER_PROTOCOL'];
    header("$proto $code $title", true, $code);
    echo renderHtmlPage($title, $body);
}

function getUrl($relative_path)
{
    if (isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off') {
        $scheme = "https";
    } else {
        $scheme = "http";
    }
    $host = $_SERVER['HTTP_HOST'];
    $path = getPath($relative_path);
    return $scheme."://".$host.$path;
}

function getPath($relative_path)
{
    if (PHP_SAPI === 'cli-server') {
        return "/".$relative_path;
    } else {
        return $_SERVER["SCRIPT_NAME"]."/".$relative_path;
    }
}

function init()
{
    global $argv;

    // If we were run as a command-line script, launch the PHP built-in web server.
    if (PHP_SAPI === 'cli') {
        launchBuiltInWebServer($argv);
        assert(false);
    }

    if (PHP_SAPI === 'cli-server') {
        // For when we're running under PHP's built-in web server, do the routing here.
        return $_SERVER['SCRIPT_NAME'];
    }
    else {
        // For when we're running under CGI or mod_php.
        if (isset($_SERVER['PATH_INFO'])) {
            return $_SERVER['PATH_INFO'];
        } else {
            return "/";
        }
    }
}

function launchBuiltInWebServer($argv)
{
    // The built-in web server is only available in PHP 5.4+.
    if (version_compare(PHP_VERSION, '5.4.0', '<')) {
        fprintf(STDERR,
            "Unable to run example. The version of PHP you used to run this script (".PHP_VERSION.")<br>".
            "doesn't have a built-in web server. You need PHP 5.4 or newer.<br>".
            "<br>".
            "You can still run this example if you have a web server that supports PHP 5.3.<br>".
            "Copy the Dropbox PHP SDK into your web server's document path and access it there.<br>");
        exit(2);
    }

    $php_file = $argv[0];
    if (count($argv) === 1) {
        $port = 5000;
    } else if (count($argv) === 2) {
        $port = intval($argv[1]);
    } else {
        fprintf(STDERR,
            "Too many arguments.<br>".
            "Usage: php $argv[0] [server-port]<br>");
        exit(1);
    }

    $host = "localhost:$port";
    $cmd = escapeshellarg(PHP_BINARY)." -S ".$host." ".escapeshellarg($php_file);
    $descriptors = array(
        0 => array("pipe", "r"), // Process' stdin. We'll just close this right away.
        1 => STDOUT, // Relay process' stdout to ours.
        2 => STDERR, // Relay process' stderr to ours.
    );
    $proc = proc_open($cmd, $descriptors, $pipes);
    if ($proc === false) {
        fprintf(STDERR,
            "Unable to launch PHP's built-in web server. Used command:<br>".
            " $cmd<br>");
        exit(2);
    }
    fclose($pipes[0]); // Close the process' stdin.
    $exitCode = proc_close($proc); // Wait for process to exit.
    exit($exitCode);
}
?>

Can anyone please help me?

My Observation: when the url in the address bar is "/index.php/" , then the logout button is working fine. But when the url in the address bar is "/index.php" , then the logout button is not working.

I tried to give if condition in the script but failed. Please help me out.

Answer 1

You have this code:

function goDirect(){
    alert(window.location);
    window.location.href='dropbox-auth-unlink';
}

Setting window.location.href to a relative path will replace the last segment of the URL. So if the URL is .../plugin-dropbox/index.php, you'll end up browsing to .../plugin-dropbox/dropbox-auth-unlink. If, on the other hand, you have .../plugin-dropbox/index.php/ (note the extra, empty, segment at the end of the URL), you'll end up browsing to .../plugin-dropbox/index.php/dropbox-auth-unlink.

Apparently the latter is the URL you want. So you could drop the trailing slash (just use index.php) and try one of these:

function goDirect() {
    // Simple but doesn't work well with query string parameters:
    // window.location.href += '/dropbox-auth-unlink';

    // An alternative that requires hardcoding the 'index.php' part:
    window.location.href = 'index.php/dropbox-auth-unlink';
}