Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

t.buffer is not a function #172

Closed
nicoduj opened this issue Jan 29, 2018 · 16 comments
Closed

t.buffer is not a function #172

nicoduj opened this issue Jan 29, 2018 · 16 comments

Comments

@nicoduj
Copy link
Contributor

nicoduj commented Jan 29, 2018

Hi all,

I am trying to evaluate dropbox sdk in a cordova project (base on Framework 7 template / vue.js). Uploading files works fine, but I get an error in download it
My code that cause an error is the following :

dbxt
          .filesDownload({
            path: "/easysubstest.data"
          })
          .then(function(data) {
            console.log(data);
            /*var reader = new FileReader();
            reader.readAsText(response.fileBlob);
            reader.onloadend = function() {
              alert("data restored successfully!");
              updateImage(this.result);
            };*/
          })
          .catch(function(error) {
            console.error(error.message);
          });

The trace of the error

[Error] t.buffer is not a function. (In 't.buffer()', 't.buffer' is undefined)
(fonction anonyme) (cordova.js:1731)
(fonction anonyme) (41382e06b346faf19af6.main.js:34467)
promiseReactionJob

Am I missing something ? I am new to this environment .

Thanks !

@greg-db
Copy link
Contributor

greg-db commented Jan 29, 2018

The stack you provided does not seem to include any Dropbox library file. Can you double check that this is the right code and right stack?

We don't have any specific support for Framework 7/vue.js in particular, but if this is happening in Dropbox code, if you can supply a sample project that reproduces the issue we can take a look.

@nicoduj
Copy link
Contributor Author

nicoduj commented Jan 30, 2018

Hi,

the error is triggered inside dropbox-sdk.min-js, which is embed by webpack in a file autogenerated name 41382e06b346faf19af6.main.js in the stack provided, in the following code :
return function (t) { return t.ok ? e() ? t.blob() : t.buffer() : t.text() }
I attached a generated file to the post.
e99ae33dafffa575143b.main.js.zip

@greg-db
Copy link
Contributor

greg-db commented Jan 30, 2018

Thanks! I think I see what's going on here. It sounds like you're including the Dropbox library as node dependency in your project, which is getting bundled up for use in the browser by webpack. The library isn't meant to run to run like this though, so it's failing on that buffer. (This is somewhat similar to #82.)

Instead, you can include the Dropbox library via a normal <script> tag, which will let you use it in browser JavaScript.

I'll send this along as a request for better support for this though.

@greg-db greg-db closed this as completed Jan 30, 2018
@nicoduj
Copy link
Contributor Author

nicoduj commented Jan 31, 2018

Hi,

I tried your way but it is not working in my project (or maybe I did it the wrong way). It is strange since this is the only method that doesn't work. Like it was suggested in another post, I managed to download a file previoulsy uploaded however by using a combination of filesGetTemporaryLink and cordova fileTransfer.download .

@greg-db
Copy link
Contributor

greg-db commented Jan 31, 2018

What error do you get with that technique?

I was able to reproduce the original buffer error in the framework7-template-vue-webpack sample. It then worked for me when I switched to adding the library via a <script> tag instead of node dependency.

@nicoduj
Copy link
Contributor Author

nicoduj commented Jan 31, 2018

Hi,
I think I did it the wrong way, but as soon as I include dropbox with the <script> tag I get a compilation error from webpack.

Do you have any idea why it is not working through webpack ?

@greg-db
Copy link
Contributor

greg-db commented Jan 31, 2018

What error are you getting? I can't offer support for webpack, but I can take a look in case it's related to Dropbox in particular.

@nicoduj
Copy link
Contributor Author

nicoduj commented Jan 31, 2018

It was a webpack error, I have modified the project so I can't produce it quickly, but since I have a workaround for now It is not a problem anymore. Thanks for your help

@nicoduj
Copy link
Contributor Author

nicoduj commented Jan 31, 2018

just an update : I tried to debug without the minified version : the error occurs on this line in Dropbox-sdk.js:

return isWindowOrWorker() ? res.blob() : res.buffer();

isWindowOrWorker returns false, but on res blobl() returns my blob, buffer is undefined.

In function :

isWindowOrWorker() {
  return typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope || typeof module === 'undefined';
}

typeof WorkerGlobalScope -> undefined
but typeof module is not undefined

if i modify it to return true like the following, it works, but I don't know if there is any other impact .

function isWindowOrWorker() {
  return (typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope) || typeof module !== 'undefined';
}

@mkirkland4874
Copy link
Contributor

The problem with the above fix is that it won't work on nodejs since module will not be undefined and thus it will try to execute res.blob(), which causes an error on node since it should use res.buffer(). The below solution solves the issue and allows the same code to run on either the browser or nodejs. I tested this on Browserify (which had the same T.buffer error) and it worked, but have not tested with webpack.

return (typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope) || (typeof module === 'undefined' || typeof window !== 'undefined');

BenjaminListwon added a commit to BenjaminListwon/dropbox-sdk-js that referenced this issue Mar 8, 2018
@elsigh
Copy link

elsigh commented Mar 11, 2018

The fact that the code doesn't also try to detect the existence of t.buffer feels like a bug.

@ponkin
Copy link
Contributor

ponkin commented Mar 16, 2018

Are there any workarounds on this issue?

@greg-db
Copy link
Contributor

greg-db commented Mar 16, 2018

@ponkin This may depend on the particular environment you're running in. Please refer to my earlier comment here for a potential solution:

#172 (comment)

@elsigh
Copy link

elsigh commented Mar 16, 2018

Loading in a script tag doesn't work when running in a next.js environment, fwiw - so I had to hack the source and use my hacked version instead

@greg-db
Copy link
Contributor

greg-db commented Apr 17, 2018

The original t.buffer is not a function issue should be fixed in the latest version of the library, currently v4.0.3.

@elsigh
Copy link

elsigh commented Apr 20, 2018

I can confirm that this version (4.0.3) works in nextjs apps now.

I had to fix references to response.fileBinary which are now response.fileBlob (which makes good sense).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants