如何设置Google云端硬盘客户端ID以在没有本地服务器的情况下进行访问？

Question

I'm wondering if it's possible to, say, open up a jsfiddle on a random computer and log in and authenticate and use the drive API, without having to have a local server running all the time? And how exactly does one go about setting this up? I'm sorry if this is a simple question but I'm just sorta lost because the instructions that I've found so far are unclear.

Edit:

So far I have, following from here and here :

1. Created a project via the Google Developers Console .
2. Opened up that project there, navigated to APIs under APIs & auth, and ensured that Drive API was enabled
3. Went into credentials, and clicked on "Create a new Client ID"
   • Selected "Web Application"
   • Set authorized javascript origins to http://localhost:4567
   • Deleted any contents in Redirect URI's and left it blank, then pressed "Create Client ID."
4. Took a sample like this , this , or this , and stored it in a local file named named index.html.
   • This wouldn't run by simply opening in a brower, so I had to host a local server
   • I navigated into that directory in the command line and then typed "python -m SimpleHTTPServer 4567" (without the quotes) and this hosted a local server
   • Opened http://localhost:4567 in my web brower, and all of these samples work fine, after copying the newly created client ID into these files where they ask for it.

I also have made a python application, to use pydrive I:

1. Clicked on "Create a new Client ID", then "Installed Application" and "Other", then "Create Client ID."
2. Next I went to the Old Google APIs Console , clicked on API Access, found that client ID, and clicked Download JSON.
3. I placed this client_secrets.json next to my python application, and this allowed pydrive to authenticate successfully and I could access and modify my google drive files anywhere using that client ID. Though of course I deleted this client_secrets.json before giving the application to another person, and showed them how to do this process as well.

However, beyond this, I'm a little unsure about, specifically:

• How one can use the drive api in web applications without having to set up a local server, say simply by running code in jsfiddle and having requests sent through my project via using a Client ID, and
• If a local server is set up that can be accessed by anyone on the web, how one can modify the above steps to allow any client to open that server's webpage to use the google drive API?

I know that I most likely need to set up a Public API access in the developers console, but am not entirely sure what Referers I should use as well. So is there a simple way to do any of this?

I also know that gspread can open google excell spreadsheets only using the client's username and password, so I'm suspecting that what I'm looking for is possible, but I'm not sure.

Answer 1

Okay, so I found a solution that works pretty well:

1. Make an OAuth.io account (It's free).
2. Once you're logged in, go to your oauth.io dashboard .
3. You should be looking at a Default App, or you can make another one it doesn't really matter.
4. Under "Domains & URLs whitelist", you'll see a little box that says "localhost." Type in " http://fiddle.jshell.net/ " (without the quotes) and press enter. This allows any jsfiddle to authenticate with your application
5. Next, we need to enable Google Drive support
   • Go to the Google Developers Console
   • Like before, navigate to Credentials under APIs and Auth.
   • Click "Create new Client ID"
   • Select Web Application
   • Under "Redirect URIs" put " https://oauth.io/auth " and " http://oauth.io/auth " (without quotes, on separate lines)
   • Under "Javascript Origins" put " https://oauth.io " and " http://oauth.io "
   • Press "Create Client ID"
6. Now go to your Oauth.io key manager . Click on Google Drive in the list to the left. Press next, and enter your client_id and client_secret that you created in the previous step (via the Google Developers Console)
   7. Select online (at least online is preferred since offline should be for server side only)
   8. Click on the Scope text book, and select " https://www.googleapis.com/auth/drive (View and manage the files in your google Drive)."
   9. Press finish. Now click on the Try Auth button, and hopefully you should get some output like

{
  "access_token": "ya29.AwH-1N_gnstLBuZfOR4W9CCcggKrQpMyKYV4QVEtCiIzHozNU5AfUJoYQzukALfjdiw2iOCUve7JbQ",
  "token_type": "Bearer",
  "expires_in": 3600,
  "provider": "google_drive"
}

To use this, you can do something like:

// This only works because we're set to "No wrap - in <head>"
function ShowDriveFileList() {
    var accessToken;
    // Initialize OAuth with our key
    OAuth.initialize('lmGlb8BaftfF4Y5en_c8XYOSq2A');

   // Connect to google drive, and print out file list
    OAuth.popup('google_drive').done(function (result) {
    var xmlHttp = null;
        xmlHttp = new XMLHttpRequest();
        xmlHttp.open("GET", "https://www.googleapis.com/drive/v2/files", false);
        xmlHttp.setRequestHeader("Authorization", "Bearer " + result.access_token);
        xmlHttp.send(null);
        alert(xmlHttp.responseText);
    }).fail(function (err) {
        alert(err);
    });;
}

Which you can find at http://jsfiddle.net/JMTVz/41/ . This uses my oauth.io client id, but you can replace it with yours and it should work as well.

Answer 2

You can do the same thing using the OAuth Playground.

See How do I authorise an app (web or installed) without user intervention? (canonical ?)

Step 11 will be different. Instead of pasting the refresh token into your server app (which you don't have), you'll paste the access token into your JS in the same way as you are doing in your answer.