No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Keytar

    Framework
    2
    20
    851
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • A
      amoss last edited by

      Hi
      I’m trying to figure out how to integrate keytar. In the code I tried both

      const keytar = require("keytar");
      

      and

      import {keytar} from "keytar".
      

      Both resulted with the following error:

      Module parse failed: Unexpected character '�' (1:2)
      You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
      (Source code omitted for this binary file)
      

      I searched for it and got here: https://stackoverflow.com/questions/59205156/unable-to-use-keytar-in-main-js-of-electron-project but I didn’t understand how/where should I integrate it into quasar.conf.js also I’m not sure which of the 2 suggested solutions is correct. Maybe both of them?

      Moreover, originally I develop for the web and only when building, I (also) build in electron mode so do I need to distinguish the “import” to happen only in electron mode? I’m a bit confused.
      Any advice will be appreciated, thanks.

      1 Reply Last reply Reply Quote 0
      • A
        amoss last edited by

        In other words, where should I put this code
        // vue.config.js
        configureWebpack: {
        devtool: ‘source-map’,
        module: {
        rules: [
        { test: /.node$/, loader: ‘node-loader’ }
        ]
        }
        }

        1 Reply Last reply Reply Quote 0
        • A
          amoss last edited by

          I made some progress but now encountered a new issue. From the docs I realized that I should put the above code, under build -> extendWebpack.

          extendWebpack(cfg) {
                          cfg.module.rules.push({
                              enforce: "pre",
                              test: /.node$/,
                              loader: "node-loader",
                              //exclude: /(node_modules|quasar)/,
                          });
                      },
          

          So now it is compiled and the web opens up but empty. Looking in the console I see the following

          Cannot open C:\Users\user\Downloads\portable\vscode\Projects\project\node_modules\keytar\build\Release\keytar.node: TypeError: Cannot read property 'dlopen' of undefined
              at Object.eval (keytar.node?3002:1)
          

          and the line itself is

          try {global.process.dlopen(module, "C:\\Users\\user\\Downloads\\portable\\vscode\\Projects\\project\\node_modules\\keytar\\build\\Release\\keytar.node"); } catch(e) {throw new Error('Cannot open ' + "C:\\Users\\user\\Downloads\\portable\\vscode\\Projects\\project\\node_modules\\keytar\\build\\Release\\keytar.node" + ': ' + e);}
          

          The above was taken from Chrome. Firefox says the same but from a different angle:

          global.process is undefined
          

          I wonder if it’s because keytar should only be loaded in electron mode?
          If so, how can I set it? If not, what am I doing wrong?
          Thanks

          1 Reply Last reply Reply Quote 0
          • A
            amoss last edited by

            The error is because global.process is undefined. What is global.process and who owns it?
            Is it related to quasar? electron? keytar?
            Thanks

            1 Reply Last reply Reply Quote 0
            • A
              amoss last edited by

              I know global.process is coming from node-loader but there’s one thing I still don’t understand:
              I’m developing in quasar/vue and when building, I “tell” it to build it in electron mode.
              How can I import something only in electron mode?

              At the moment I have this, after adding the relevant code to extendWebpack (see previous message in this thread)
              import { keytar } from “keytar”;
              and it compiles and executed but fails to run because global.process is undefined.
              My guess is because I’m not in electron mode, but this is just a guess and I want to test it.

              I tried the following but obviously it does not compile
              import { Platform } from “quasar”;
              if ($q.platform.is.electron) import { keytar } from “keytar”;
              ‘import’ and ‘export’ may only appear at the top level

              Any kind of help will be appreciated.
              Thanks

              dobbel 1 Reply Last reply Reply Quote 0
              • dobbel
                dobbel @amoss last edited by dobbel

                @amoss

                you could maybe replace import with require?

                let foobar
                
                if ($q.platform.is.electron) {
                    foobar= require('something');
                }
                

                Or you can do something dirty in the index.template.html:

                conditionaly including the cdn url of keytar in index.template.html

                <% if ($q.platform.is.electron) ...
                
                

                https://cdn.jsdelivr.net/npm/keytar@6.0.1/lib/keytar.min.js

                1 Reply Last reply Reply Quote 0
                • A
                  amoss last edited by

                  Thank you very much for the tip. I tried to do the following:

                  try {
                      let keyt = require("keytar");
                  } catch (e) {
                      this.errorMessage = e;
                      this.showError = true;
                  }
                  

                  When running as “web”, I got the same error as before with global.process undefined.
                  When running as “electron”, I got the following:

                  Error: node-loader: Error: C:\Users\user\AppData\Local\Temp\e6425528-a110-43aa-a474-41723fc46383.tmp.node is not a valid Win32 application. C:\Users\user\AppData\Local\Temp\e6425528-a110-43aa-a474-41723fc46383.tmp.node
                  

                  Building as electron generates a portable executable that I run. My guess is that when running, it extracts the inside to the temp folder.

                  dobbel 2 Replies Last reply Reply Quote 0
                  • dobbel
                    dobbel @amoss last edited by dobbel

                    @amoss

                    Here is someone with the same error:

                    https://github.com/MyCryptoHQ/MyCrypto/issues/2064

                    looks like node/windows/version stuff.

                    Possible solutions:

                    • Switch node versions. ( Version & 32/64 bit) . Use nvm to do this
                      https://github.com/coreybutler/nvm-windows

                    • Does it run on linux? (ubuntu or something)

                    1 Reply Last reply Reply Quote 0
                    • dobbel
                      dobbel @amoss last edited by dobbel

                      @amoss Btw if you have a github repo( or something) with the code. I could see if I can get it running.

                      1 Reply Last reply Reply Quote 0
                      • A
                        amoss last edited by

                        I changed node-loader’s index.js code from global.process.dlopen to process.dlopen and it passed this line of code but now fails of something else.
                        alt text

                        Even though it recognized the function, it fails as if it’s not a function.
                        I posted a question on node-loader’s github.
                        Also made a MVP demo but before the latest changes if you want to play with it: https://gofile.io/d/HDsLoV
                        type quasar dev to run it 🙂

                        dobbel 1 Reply Last reply Reply Quote 0
                        • A
                          amoss last edited by

                          Any idea how come keyt is recognized correctly with the relevant functions (getPassword in this case) but still will fail when calling that function?
                          I mean generally, what can cause such error, any tip or hint might help me to go forward.
                          Thanks

                          1 Reply Last reply Reply Quote 0
                          • dobbel
                            dobbel @amoss last edited by dobbel

                            @amoss I don’t get the demo. Keytar is not used anywhere and there’s no electron project in quasar defined.

                            Each release of keytar includes prebuilt binaries for the versions of Node and Electron that are actively supported by these projects. Please refer to the release documentation for Node and Electron to see what is supported currently.

                            It will only work in electron and in nodejs.

                            1 Reply Last reply Reply Quote 0
                            • A
                              amoss last edited by amoss

                              Well, when running as web, it fails with: Keytar,getPassword is not a function.
                              When running as electron (executable), it fails with:
                              Error: node-loader: Error: C:\Users\user\AppData\Local\Temp\07e92995-d4c3-47dc-8b61-d882691c2e86.tmp.node is not a valid Win32 application. C:\Users\user\AppData\Local\Temp\07e92995-d4c3-47dc-8b61-d882691c2e86.tmp.node

                              I’m kinda lost 🙂 The application itself is running ok, only that line specifically fails.
                              I don’t understand why it fails with “is not a valid Win32 application” - in github, the person told me that I must be doing something wrong and closed the ticket.
                              I guess I’m the only one ever to try to use Keytar or to add a “remember me” feature to his login window.
                              If not, I wonder how other people managed to do it.

                              The demo is from the very first/initial try to use Keytar before I tested deeper, not that it made me any progress 🙂

                              dobbel 1 Reply Last reply Reply Quote 0
                              • dobbel
                                dobbel @amoss last edited by dobbel

                                @amoss It will not run on the web ever.

                                As for the error:

                                • try linux
                                • try other 32 bit/64bit nodejs versions. Use nvm

                                Or give me a real demo where you actually get the error for electron.

                                1 Reply Last reply Reply Quote 0
                                • A
                                  amoss last edited by

                                  There you go: https://gofile.io/d/TziSA1
                                  Thanks a lot!

                                  dobbel 1 Reply Last reply Reply Quote 0
                                  • dobbel
                                    dobbel @amoss last edited by

                                    @amoss

                                    the " is not a valid Win32 application" error means you have to rebuild the keytar module for your system ( it’s a native module)

                                    I followed this guide:

                                    Solution 2

                                    https://github.com/fcapolini/electron-keytar-windows10-howto

                                    suc6

                                    1 Reply Last reply Reply Quote 0
                                    • A
                                      amoss last edited by amoss

                                      Thanks, a newbie question in order for me not to damage anything, in solution 2 point b I saw

                                      from an unprivileged shell

                                      mkdir electron-keytar
                                      cd electron-keytar
                                      npm init
                                      npm install electron
                                      npm install keytar
                                      npm install electron-rebuild --save-dev
                                      .\node_modules.bin\electron-rebuild -w keytar -p -f

                                      Because I already have a project folder with the relevant installations (electron, keytar and electron rebuild), is it enough for me just to run
                                      .\node_modules.bin\electron-rebuild -w keytar -p -f
                                      ?

                                      dobbel 1 Reply Last reply Reply Quote 0
                                      • dobbel
                                        dobbel @amoss last edited by

                                        @amoss
                                        Yes that’s enough , if you have the right visual c++ libaries installed ect ( probably not). BUt just try it. You probably get missing visual c++ libs or something.

                                        What I had to do was:

                                        npm install --global --production windows-build-tools
                                        npm install --global node-gyp
                                        ( I did not have to do this because I already had python)
                                        setx PYTHON $env:USERPROFILE.windows-build-tools\python27\python.exe

                                        Than it still gave me errors, so I had to manually update the visual c++ 2020 libs or something 😉

                                        if you get this too I let me know…

                                        1 Reply Last reply Reply Quote 0
                                        • A
                                          amoss last edited by

                                          It looks a bit cumbersome (to my non-professional eyes) to achieve what I need.
                                          I appreciate a lot your effort and wanting to help but I will first finish some unfinished business I have in the queue and then I’ll get to this.
                                          Again, thanks a lot!

                                          dobbel 1 Reply Last reply Reply Quote 0
                                          • dobbel
                                            dobbel @amoss last edited by

                                            @amoss sure no problem I learned a lot too!

                                            1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post