dropboxdropbox-apidropbox-sdk-js

How to open popup with dropbox-api dropbox-js V2


I'm trying to migrate to dropbox-api v2 in my web application. Currently I have implementation of opening popup window where user connects to his/her dropbox and I get token. Which I use to get access to files user selected in Dropbox.chooser in later steps.

But I'm having hard time to find the solution for this. I have link to all migration documents dropbox has, but there is not any word about what is the equivalent of client.authenticate() and Dropbox.AuthDriver.Popup() ?


Solution

  • Common Dropbox!!! I just found this issue posted in GitHub for dropbox-sdk-js, and the answer that they don't have this functionality in V2 :( it is really disappointing, i need to implement all staff myself:

    https://github.com/dropbox/dropbox-sdk-js/issues/73#issuecomment-247382634

    Updated

    I have implemented my solution and would like to share if someone will need.

    To open a popup window I use following code:

    window.open(dropbox.getAuthenticationUrl("MY REDIRECT URL"), 'DropboxAuthPopup', 'dialog=yes,dependent=yes,scrollbars=yes,location=yes')
            
    window.addEventListener('message',function(e) {
       if (window.location.origin !== e.origin) {
           // Throw error
       } else {
           // e.data Is what was sent from redirectUrl
           // e.data.access_token is the token I needed from dropbox
       }
    },false);
    

    Then on my page, which I specify dropbox to redirect, i put:

    window.addEventListener('load', function() {
        var message = parseQueryString(window.location.hash)
        window.location.hash = '';
        
        opener = window.opener
        if (window.parent != window.top) {
            opener =  opener || window.parent
        }
        
        opener.postMessage(message, window.location.origin);
        window.close();
    
    })
    

    Example of parseQueryString can be found from dropbox-sdk-js examples