You might see that the Dropbox Community team have been busy working on some major updates to the Community itself! So, here is some info on what’s changed, what’s staying the same and what you can expect from the Dropbox Community overall.
Forum Discussion
Chrome Extension "Download to Dropbox"
I have a Chrome extension developed using Angular JS and High Charts. I need a functionality to be added to upload files to dropbox from this chrome based app. I have written a code to authorize ...
2. Regardless of the type of app, the redirect URI would be the URI where you want to send the user back to after they approve your app to access their account. I can't offer guidance on how to build a Chrome extension in particular, but I know Chrome extensions sometimes use "chrome-extension://" URLs for their option pages, so you may want to look into that. I recommend reading the OAuth guide for context on how the flow works.
(Also, if you use the "code" flow, the redirect URI isn't strictly required. If you omit it, the user just needs to copy/paste the authorization code into your app.)
4. No, the user does not need to register their own API app. Your app uses its own app key to send them though the OAuth app authorization flow. I recommend trying the example to see how it works.
Production status just removes the limit on the number of users that can connect to your app.
In your code, you're attempting to make a GET request to the /oauth2/authorize page. You instead need to send the user to that page as a normal navigation operation. E.g., have them click on the link as shown in the example, or redirect them via JavaScript, such as using window.location.replace(url) or window.location.href.
Greg-DB
Dropbox Staff
Dropbox Staff1. We don't have any specific resources for Chrome extensions/Angular JS in particular, but the API itself can be used anywhere you can make HTTPS calls.
2. The redirect URI for your app is specific to your app, and would depend on your app's setup, so I can't say off hand what it should be for your app.
3. While we don't have anything specifically for Chrome extensions/Angular JS apps, I do recommend using the official Dropbox API v2 JavaScript SDK if you can.
4. The API was designed with the intention that each user would link their own Dropbox account, in order to interact with their own files. To do so, the app should send each user through the OAuth app authorization flow in their browser. The result is an access token that the app can store and re-use to make further API calls for the user.
Looking at the error in your screenshot, it looks like you may trying to call https://www.dropbox.com/oauth2/authorize directly in your JavaScript code (e.g., via an AJAX call). That's actually a web page that the user should be directed to though, not an API endpoint.
You can find more information on how the OAuth app authorization flow works in the OAuth guide, and the documentation can be found here. There's an example implementation with the API v2 JavaScript SDK here.
2. Our app is not a hosted web application but a chrome extension based app and does not have the url of its own. In that case, what would be the redirect url or the domain?
4. I would like to rephrase my question. Currently I have used my own dropbox account to register the app onto dropbox. Do my all users will also have to register /create an app on to dropbox? What is Production status used for?
My code to connect to dropbox looks like this:
Please let me know what I am doing wrong here.
Regards,
Bijal
- Greg-DB
2. Regardless of the type of app, the redirect URI would be the URI where you want to send the user back to after they approve your app to access their account. I can't offer guidance on how to build a Chrome extension in particular, but I know Chrome extensions sometimes use "chrome-extension://" URLs for their option pages, so you may want to look into that. I recommend reading the OAuth guide for context on how the flow works.
(Also, if you use the "code" flow, the redirect URI isn't strictly required. If you omit it, the user just needs to copy/paste the authorization code into your app.)
4. No, the user does not need to register their own API app. Your app uses its own app key to send them though the OAuth app authorization flow. I recommend trying the example to see how it works.
Production status just removes the limit on the number of users that can connect to your app.
In your code, you're attempting to make a GET request to the /oauth2/authorize page. You instead need to send the user to that page as a normal navigation operation. E.g., have them click on the link as shown in the example, or redirect them via JavaScript, such as using window.location.replace(url) or window.location.href.
Based on reply, I have done changes to my code and It is redirecting me to the dropbox login page. After I login, It prompts me to allow the app. Once I allow the app, It shows the authorization code on screen since I have used the code flow.
I wanted to use the token flow for authorization so that I can directly get the token. This is how I am building my url for the token flow:
var redirectUri = encodeURIComponent('chrome-extension://sdfsdsdfbohbmkkjdhmdhokipgllnasdfdsfsdfdsfipnfopjnng.chromiumapp.org');
console.log(redirectUri);
var auth_url = "https://www.dropbox.com/oauth2/authorize?client_id=" + client_id + "&redirect_uri=" + redirectUri + "&response_type=token";
When I allow the app, i get following message
When I click on 'Allow' on the above screen, I get another message "you will need a new app to open this chrome extension"
Is there a way to get the token back to the calling app which is a chrome extension?
About Dropbox API Support & Feedback
Find help with the Dropbox API from other developers.
