WebSdk and variable issues.

[shinomikko8888]

Hello! This is my first time using the dependency (and asking for help, in general) and I stumbled into some issues that I cannot resolve that well even when looking at the other issues from #4, #13, #27, and #33. I'm using React.js and most of the examples that were given used Angular, which for me a not-so-experienced dev, cannot find a way to fix the issues that pop-up.

My biometric device is a DigitalPersona U.are.U 4500 Fingerprint Reader and I downloaded the SDK along with the Local Agent from the tutorial page in the documentation. I followed the documentation yet I came up with these errors. The things that popped up an error were:

1. WebSdk is not defined

   WebSdk is not defined
   ReferenceError: WebSdk is not defined
   at new Channel (http://localhost:3000/static/js/bundle.js:26526:29)
   at new FingerprintReader (http://localhost:3000/static/js/bundle.js:27010:23)
   at FingerprintModal (http://localhost:3000/main.f679d5df578319e64c29.hot-update.js:43:29)
   at renderWithHooks (http://localhost:3000/static/js/bundle.js:66757:22)
   at mountIndeterminateComponent (http://localhost:3000/static/js/bundle.js:70043:17)
   at beginWork (http://localhost:3000/static/js/bundle.js:71339:20)
   at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:56349:18)
   at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:56393:20)
   at invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:56450:35)
   at beginWork$1 (http://localhost:3000/static/js/bundle.js:76324:11)

2. Can't resolve WebSdk

   ERROR in ./node_modules/@digitalpersona/devices/dist/es5.bundles/index.umd.js 2:115-132
   Module not found: Error: Can't resolve 'WebSdk' in 'E:\xampp\htdocs\project\frontend\node_modules\@digitalpersona\devices\dist\es5.bundles'

3. Various variable errors

   ERROR in [eslint]
   src\modules\WebSdk\index.js
   Line 28:23:     Unexpected use of 'self'     no-restricted-globals
   Line 28:44:     Unexpected use of 'self'     no-restricted-globals
   Line 28:58:     Unexpected use of 'self'     no-restricted-globals
   Line 28:66:     Unexpected use of 'self'     no-restricted-globals
   Line 2955:40:   'DV' is not defined          no-undef
   Line 4227:36:   'sha1' is not defined        no-undef
   Line 4227:42:   'sjcl' is not defined        no-undef
   Line 4227:48:   'BigInteger' is not defined  no-undef
   Line 4588:21:   'a' is not defined           no-undef
   Line 4591:21:   'two' is not defined         no-undef
   Line 4677:13:   'i' is not defined           no-undef
   Line 4678:13:   'ascii' is not defined       no-undef
   Line 4680:20:   'i' is not defined           no-undef
   Line 4681:17:   'ascii' is not defined       no-undef
   Line 4681:25:   'ascii' is not defined       no-undef
   Line 4682:41:   'i' is not defined           no-undef
   Line 4683:17:   'i' is not defined           no-undef
   Line 4686:20:   'ascii' is not defined       no-undef
   Line 5827:25:   Unexpected use of 'self'     no-restricted-globals
   Line 5828:19:   Unexpected use of 'self'     no-restricted-globals
   Line 6530:44:   'value' is not defined       no-undef
   Line 6568:65:   'async' is not defined       no-undef
   Line 6568:72:   'sjcl' is not defined        no-undef
   Line 6568:78:   'BigInteger' is not defined  no-undef
   Line 6568:90:   'SRPClient' is not defined   no-undef
   Line 6568:101:  'ES6Promise' is not defined  no-undef

4. Crypto and Vertx (though this one doesn't make an error message pop-up in the environment)

   
   WARNING in ./src/modules/WebSdk/index.js 2445:15-32
   Module not found: Error: Can't resolve 'crypto' in 'E:\xampp\htdocs\bjmp\frontend\src\modules\WebSdk'

BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.

If you want to include a polyfill, you need to:

• add a fallback 'resolve.fallback: { "crypto": require.resolve("crypto-browserify") }'
• install 'crypto-browserify' If you don't want to include a polyfill, you can use an empty module like this: resolve.fallback: { "crypto": false }

WARNING in ./src/modules/WebSdk/index.js 4602:18-28 Module not found: Error: Can't resolve 'vertx' in 'E:\xampp\htdocs\bjmp\frontend\src\modules\WebSdk'

Again, I read most of the issues from other threads and tried doing them but to no avail. If anyone could help I'd appreciate it! Thanks.

[a-bronx]

Based on the error messages (missing crypto, Webpack polyfills for node.js etc), you attempt to use the library in Node.js code. The library is for browsers only.

[shinomikko8888]

The library is for browsers only.

Sorry, but I'm still confused about this part. Do I have to call the <script> that calls the WebSdk and the @digitalpersona/devices script in the index.html file that is located inside the public folder and program there using JavaScript instead of programming inside of the component? Or do I have to call the <script> tag inside the return statement in the component since inside of the return statement you can also call the <script> tag, and continue as normal? My scenario is the user entering an entry that contains data from a person which includes their fingerprint data.

What I want is to get the fingerprint raw file (or anything that could get a unique ID) and compile the data with the other data that has been inputted such as the name, age, etc. When the user clicks on this button:

This would pop-up:

So, in this scenario, where should I call the <script> tag that calls the WebSdk?

[a-bronx]

Or do I have to call the Githubissues.

Githubissues is a development platform for aggregating issues.