Error importing Braintree NPM

Ask the community
,
1

Hi all,

I am wondering if any expert could help me with the following issue as I’m quite a beginner. I’m trying to implement a custom braintree payment into my web using the available NPM Braintree file. However, as soon as I import that file into my page, I get the following error when previewing:

822×138 4.32 KB

The code of my page is simply the following:

import braintree from "braintree";

I’ve read the post on how to install NPM packages (Velo: Working with npm Packages | Help Center | Wix.com) and also checked the Braintree NPM documentation regarding what to import (https://www.npmjs .com/package/braintree), but I cannot figure it out where the problem could be.
I would appreciate any help cause I’m stuck at this point since a while.

Thanks in advance!

2

There are a few answers to this question.

Firstly, you can just use the install method shown in the npm doc info:

var braintree =require('braintree');

Require might be shown as an error, however it does work.

If you install the npm called dateformat and use the same code:

var dateFormat = require('dateformat');

You won’t get any error message on your preview.

When you get - Uncaught ReferenceError: process is not defined, it means that your Node.js code must be run by the node process, not the browser (the code must run in the server).

If you had access to the code in the actual npm then you could alter the code for it and change it to suit, however as you don’t have access to the code within any npm you can’t do this option.

Also note that the version in Wix Package Manager is only v2.11.0 which is two years out of date and you can see on the Braintree docs that the latest version is now v2.23.0,

Therefore I think that the actual issue here is the npm itself, as if you look on the Braintree docs it states…
The Payment Card Industry (PCI) Council has mandated that early versions of TLS be retired from service. All organizations that handle credit card information are required to comply with this standard. As part of this obligation, Braintree is updating its services to require TLS 1.2 for all HTTPS connections. Braintree will also require HTTP/1.1 for all connections. Please see our technical documentation for more information.

Which means that the version that Wix currently have installed might be one of these versions that are retired from service.

You can read more about it here if you want.

Therefore, all you can do is to go to your installed packages and click on request the latest version to put in a request for Wix to update it to v2.23.0, or at least to a version that is workable in Wix.

3

The workaround for you, if you still need to use Braintree, is to look at using their own API instead.
https://developers.braintreepayments.com/

Unfortunately this will involve more work and code for you to do.:disappointed:

You can use Wix Fetch and Wix HTTP Functions to expose your site to their API and you can find out about them here.

https://www.wix.com/corvid/new-reference/wix-fetch
https://support.wix.com/en/article/corvid-accessing-third-party-services-with-the-fetch-api

https://www.wix.com/corvid/new-reference/wix-http-functions#top
https://support.wix.com/en/article/corvid-exposing-a-site-api-with-http-functions

Examples.
https://www.wix.com/corvid/example/exposing-apis
https://www.wix.com/corvid/forum/tips-tutorials-examples/example-myapi-and-myapiclient

4

@givemeawhisky I was thinking on doing something like this, but I wanted to try the proper way first. I’ll start coding with Fetch and HTTP. Meanwhile, I’ll request the update. Thank you very much!!

5

@gorkaplata

Yes you are not to know that the npm would bring up this error.

Also, before I head out the door, I have also put in a request to get the latest version and I have bumped the issue up to Wix so that they can look into it as soon as possible so that it gets this issue cleared up sooner rather than later.

If you are getting this error, then it means that anybody else who wants to use Braintree will get the same issue as well, so it needs sorting out.

6

@givemeawhisky

Hi again! First of all, thank you for pushing it up to Wix, as they have now updated the Braintree NPM to v2.23!!

However, I’ve been working on what you mentioned. First, and as you suggested in your first reply, the V2.11 worked if importing the package as “var braintree = request(“braintree”);” in backend and running the code from there. Therefore, I just started working on creating the code to use it when the updated NPM was available. Hence, I made the forms and coded everything. For curiosity, I tried to run a sandbox trial with the old NPM version (v2.11), and when calling the braintree NPM to proceed with the payment, I got the following error:

1916×58 3.45 KB

“Error: (node 1) [DEP0005] DeprecationWarning: Buffer() is deprecated due to security and usability issues. Please use the Buffer.alloc()…”

I imagined it was because of the old v2.11 NPM version that could be deprecated. I checked if the NPM update was already available and for my luck, Wix did update it. Consequently, I changed the coding differences between v2.11 and v2.23 and run the code again, but the same error appeared. I uninstalled and installed again the NPM package just in case the Upload wasn’t right, but still shows the same error. Any idea of how can it be fixed? I imagine it is from the NPM package itself, but I’m a noob in terms of coding knowledge… sorry for that!

Thanks in advance!

7

Yes this has been brought up before and try running it with the error message telling you about it.
https://www.wix.com/corvid/forum/community-discussion/mongo-db-buffer-is-deprecated-bug

There are many pages online that you can look at about it…
https://nodejs.org/api/deprecations.html#deprecations_dep0005_buffer_constructor
https://nodejs.org/api/buffer.html#buffer_new_buffer_string_encoding
https://nodesource.com/blog/understanding-the-buffer-deprecation-in-node-js-10/
https://nodejs.org/en/docs/guides/buffer-constructor-deprecation/
https://discourse.nodered.org/t/deprecationwarning-buffer-is-deprecated-due-to-security-and-usability-issues-please-use-the-buffer-alloc-buffer-allocunsafe-or-buffer-from-methods-instead/9987/2
https://github.com/nodejs/node/blob/master/doc/api/deprecations.md#dep0005-buffer-constructor
https://stackoverflow.com/questions/52165333/deprecationwarning-buffer-is-deprecated-due-to-security-and-usability-issues

Finally, it bears repeating that the message you listed is not an error but only a warning . Consequently, it is not causing any different behavior. In other words, fixing it will only make the message go away; it will not significantly change the behavior of your program. Of course, you should still strive to address it as the warning is telling you that in a future version of node the code you have right now will stop working.

However, that would be whenever Braintree update their own npm themselves and you would then need to request the latest version from Wix again if it is not updated and your current setup does not work anymore etc.