Menu
<!DOCTYPE html>
<html>
<head>
<title>DropBox Chooser Example</title>
</head>
<body>
<div id="main">
<input type="dropbox-chooser" name="selected-files" data-link-type="direct" id="db-chooser"/>
<div id="content"></div>
</div>
<script type="text/javascript" src="https://www.dropbox.com/static/api/1/dropins.js" id="dropboxjs" data-app-key="YOUR-APP-KEY"></script>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery.tools.min.js"></script>
<script type="text/javascript" src="jquery-layout.js"></script>
<script type="text/javascript">
$(function(){
var dbChooser = $("#db-chooser");
dbChooser.on("DbxChooserSuccess", function(e) {
// Here we will listen when a file is
// chosen from dropbox, insert it into the page
// and initialize the Jcrop plugin
e = e.originalEvent;
var name = e.files[0].name;
});
});
</script>
</body>
</html>
This is my example code in which i am trying to implement the dropbox chooser. I have created an app and i do pass the app key. The errors i encounter are,
Initially on page load, i get the error that $(...).on is not a function.
When i click on the dropbox chooser button, i get {"error": "Invalid origin"}.
I am not getting where i am going wrong. Any help will be appreciated.
315
I ran into, and was able to resolve, this same issue today. The Dropbox Chooser functionality does not support file browsing unless the script is running on a web server. If you are testing your web app locally and are accessing it via a file:// link, you will get the 'invalid origin' error. Instead, run a web server (either locally or hosted somewhere else) with your web app on it, and that should eliminate the error.
118
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
