Select a file from OneDrive on phone - mobile web site

Question

Edit - title was previously

OneDrive Web picker SDK (Javascript) cannot choose/open file on mobile device

Auto email from SO suggests I change title as bounty period expired.

I have created a OneDrive picker in a mobile friendly website according to these instructions https://dev.onedrive.com/sdk/javascript-picker-saver.htm and it works fine on a Windows desktop.

However on a mobile browser (Android Browser & Chrome on Android 4.2, and Safari on iOS 7) the picker launches and logs me in OK, I can see the files, but when I tap to select a file the "Open" button remains disabled.

Edit, just to clarify : I do not want to upload a file to OneDrive. I want to pick a file already in my OneDrive account and pass its URL back to the page. So that I can send that URL to my server and have the server fetch the file

If I long press on my selected file a content (by that I mean like a right click menu in Windows) menu appears, with an "Open" option - choosing this just seems to make Onedrive re-load.

My code is:

<script type="text/javascript" src="https://js.live.net/v5.0/OneDrive.js" id="onedrive-js" client-id="0000000011111111"></script>

    <script type="text/javascript">
        var pickerOptions = {
        success: function(files) {
        console.log(files);
        document.getElementById("cloud_cv_source_input").value = "onedrive" ;
        document.getElementById("cloud_cv_file_url_input").value = files.values[0].link ;                
        document.getElementById("cloud_cv_file_name_input").value = files.values[0].fileName;
        document.getElementById("cloud_cv_file_size_input").value = files.values[0].size;

  },

  cancel: function() {
      // handle when the user cancels picking a file
  },

  linkType: "downloadLink", // or "downloadLink",
  multiSelect: false // or true
}

    function launchOneDrive()
        {
        OneDrive.open(pickerOptions);
        }


    </script>

I did see this at the end of the docs:

The OneDrive picker and saver supports the following web browsers:

    Internet Explorer 9+
    Latest version of Chrome
    Latest version of Firefox
    Latest version of Safari

So assume this SDK is just for desktop sites, is this correct, and if so, what should I use for a mobile site? I know there are SDK's for Android and iOS but I'm not making a native app.

Thanks.

"what should I use for a mobile site?" I'm sorry but I trully think you won't be able to do that if the SDK is not compatible with mobile devices... — n00dl3, Jun 24 '15 at 11:04
Initially, I am going to say this is not possible on mobile devices. Choosing/Opening a file requires a native file manager tool provided by the OS itself. Since iOS or Android do not have this, have you considered using an "alternative" solution. Perhaps triggering the mobile device to pick an item via a share bar for example? — Stephen Rodriguez, Jun 24 '15 at 13:54
Junius Rendel / Stephn_R - thanks for your replies. I do understand that, either intentionally, or in error, the SDK I'm using does not work on a phone. However, I have got similar SDKs for Google Drive and Dropbox to work. Since these are competitors to OneDrive, I'd expect Microsoft to also cater for the mobile web, so I can assume I'm doing somethign wrong, or using the wrong SDK. Also, a similar site to mine allows me to choose a OneDrive file on my phones. — KevInSol, Jun 24 '15 at 14:45
Stephn_R - I think you misunderstand the issue - the OneDrive picker does not browse the device - it browses a OneDrive account - picks a file from the 'cloud' — KevInSol, Jun 24 '15 at 14:51

score 0 · Answer 1 · answered Nov 08 '15 at 02:33

I spent some time looking into this and doing some tests, and without having a URL to your app online (so I can test it directly and on a server) here are my initial thoughts:

Will this work on mobile devices? In theory it should if the user is browsing on their mobile with the supported devices. But when I tried viewing the reference URI you provided for OneDrive Dev Center to the JS Web Picker SDK...the page would not display the example which lets me choose the files on my Android using: Chrome, Firefox, or my wife's iPhone with Safari. Apparently, Micro$oft has chosen not to test the documentation page code on mobile versions of the browsers they state they support.

You might want to add a sanity check around your execution code (to make sure that a file was available in the response). Additionally, I see in the documentation code, they're clearing the results of the picker on cancel and selection (for viewing and saving). If you have a URI where I could test your code, I'd be happy to help more on this.

<script type="text/javascript" src="https://js.live.net/v5.0/OneDrive.js" id="onedrive-js" client-id="0000000011111111"></script>
<script type="text/javascript">
var pickerOptions = {
    success: function(file) {
        // Sanity check
        if( !file  ) {
            // Handle no file being returned
        } else {
            var f = file.values[0];
            document.getElementById("cloud_cv_source_input").value = "onedrive" ;
            document.getElementById("cloud_cv_file_url_input").value = f.link ;                
            document.getElementById("cloud_cv_file_name_input").value = f.fileName;
            document.getElementById("cloud_cv_file_size_input").value = f.size;
        } // end if
    },
    cancel: function() {
        // handle when the user cancels picking a file
    },
    linkType: "downloadLink",
    multiSelect: false
}

function launchOneDrive() {
    OneDrive.open(pickerOptions);
}
</script>

Select a file from OneDrive on phone - mobile web site

1 Answers1