2. Algorithm
  3. javascript - "error": "Invalid origin" using dropbox chooser - Stack Overflow

javascript - "error": "Invalid origin" using dropbox chooser - Stack Overflow

admin2025-04-26  2
<!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=".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,

  1. Initially on page load, i get the error that $(...).on is not a function.

  2. 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.

<!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./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,

  1. Initially on page load, i get the error that $(...).on is not a function.

  2. 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.

  • javascript
  • jquery
  • dropbox
Share Improve this question edited Sep 11, 2013 at 14:52 tim peterson 24.4k63 gold badges186 silver badges303 bronze badges asked May 7, 2013 at 5:47 Swanand PhadkeSwanand Phadke 777 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 7

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.

转载请注明原文地址:http://conceptsofalgorithm.com/Algorithm/1745630029a310956.html

javascriptquoterrorquot quotInvalid originquot using dropbox chooserStack Overflow

最新回复(0)