Objetivo
Queríamos descobrir a maneira mais fácil de usar OAuth para obter a lista de arquivos do Dropbox em nome de um usuário do Dropbox usando Javascript. Aqui está como fizemos com OAuth.io .
Fragmento de código
Experimente este trecho. Depois de fazer login com sua conta do Dropbox, ele obterá a lista de arquivos da sua conta. Sinta-se à vontade para ajustá-lo para obter uma lista de arquivos de diferentes pastas, etc.
https://jsfiddle.net/p187m5ur/6/
Explicação do código
HTML
<a id="dropbox-button" class="btn btn-block btn-social btn-dropbox">
<i class="fa"></i> Get file list
</a>CSS
NoneJavascript
var params = {
"path": ""
};
$('#dropbox-button').on('click', function() {
// Initialize with your OAuth.io app public key
OAuth.initialize('OAUTH_IO_PUBLIC_KEY');
// Use popup for oauth
// Alternative is redirect
OAuth.popup('dropbox').then(provider => {
console.log('provider:', provider);
alert("You can check Dropbox provider object in browser console.");
provider.post({
url: "/files/list_folder",
data: JSON.stringify(params),
headers: {
"Content-Type": "application/json"
}
}).then(data => {
console.log('Files:', data);
alert("You can find file list in browser console");
});
});
})Requisitos Externos
Este código Javascript possui requisitos externos:
- jQuery – manipulação de elemento HTML
- bootstrap, font-awesome – aparência de botões e ícones sociais
- Biblioteca javascript oauth-io – Simplifica o uso de OAuth, ocultando as nuances na implementação de OAuth de vários provedores de OAuth, por exemplo, LinkedIn, Twitter, etc. por trás da interface OAuth2 padrão ratificada
Guia passo a passo
Aqui está um resumo das etapas para criar este botão social para obter a lista de arquivos do Dropbox em nome de um usuário usando OAuth2.
- Crie uma conta do Dropbox , se ainda não tiver uma
- Crie um aplicativo no Dropbox usando este guia passo a passo simples
- Copie o ID e o segredo do cliente do aplicativo Dropbox
- Inscreva-se para uma conta OAuth.io
- Vincule seu aplicativo Dropbox ao OAuth.io colando o ID e o segredo do cliente do aplicativo Dropbox em OAuth.io
- Copie o snippet javascript OAuth ( https://jsfiddle.net/p187m5ur/6/ ) em sua página da web
Referências
Use OAuth para obter a lista de arquivos do Dropbox: https://tome.oauth.io/providers/dropbox/get-file-list