I'm building an application with Vue and Electron, and I'm wondering what the best approach is for authenticating users.
I'm using JSStore as a wrapper for IndexedDB as my database. I'm familiar with using bcryptjs as a means for authenticating users when I create Node backend and have traditional /login or /signup routes.
But this is where I'm starting to get confused. Do I need to set up a Node server to start up when my application starts up? Because given that I'm using IndexedDB, I don't know that it makes sense to have a process of Sign Up --> Request to Node Server --> Send data back to browser
Would I be better served using a different type of database? Could I do something such as adding bcryptjs to the Vue prototype, so that's it's accessible where I need it to work with JS Store? Are there security concerns that I should be aware of with an approach like that?
At this point I'm stuck, and have more questions than answers. I've done some looking around for articles, and I find a lot of content about setting up authentication with Vue, but not within the context of an Electron application. I'm not sure how that variable changes things.
Any advice or direction would be greatly appreciated.
JsStore is client side technology, which means if you are setting up authentication in client side, it will be available only to that device.
Let's understand it more by use case -
Say your application named My Awesome app has authenticaion implemented. User register it and then they are able to use it after registration. They are logging out and signing in again with registration data and everything is working normal.
Here is what wrong with this approach -
User buys another pc and installed application My Awesome app, he tries to login but unable to login because registration data does not exist on their new PC.
Due to some issue, user hard disk crashed & he installed new hard disk. Same thing as above he is not able to log in.
So it is recommended to implement the signin on some server & keep data there.
Related
I am new to blockchain development and to tendermint as well.
I already have a blockchain running locally.
Using this command starport scaffold vue I could mount a local web application. Inspecting a bit I could replicate some network requests (localhost) and I can get the ballance of current wallet (hard-coded on the request), get the current wallet from the localstorage. I'm struggling on authentication (mnemonic, wallet name and password).
However I also would like to costumize it according to my needs and I thought I could start a web application from scratch. I can see that the generated web project is importing this project https://github.com/tendermint/vue which is making a lot of "magic behind the scenes" and importing UI elements as well and I would like to have my own elements.
I don't want to re-invent the wheel and I can make some imports to help me on connection to wallet, validate authentication (mnemonic, wallet name and password), create wallet and so on.
I am trying to build a web application to connect to wallet, make transations.... but I would like to control the styles and the connections (and if possible using reactjs instead of vuejs, otherwise I dont mind learn vuejs as well).
Is this possible or reasonable? Where I can find good documentation or tutorial to guide me on customize a web application using tendermint. Honestly I searched but I am kind of lost.
Thanks
UPDATE: I found good examples and here and here. It helped me to validate mnemonics and make transactions, with my stack tech.
Because Starport generates both plain Javascript and VUE controllers, you have few options:
Create your own site re-using VUE components
Take plain JS part and build a website using whatever technology you like
Use a plain JS client for standard cosmos modules you can find on GitHub
Use Protobuf generator to generate light client code yourself
If you only need wallet functionality, #2 and #3 may work best for you because the bank module is stable and hasn't changed much in a long time.
You can find plain JS file for bank in your project:
vue/src/store/generated/cosmos/cosmos-sdk/cosmos.bank.v1beta1/module/index.ts
There is a link to starport discord channel related to frontend: https://discord.gg/CvbdYh9AWQ
Use case
I am creating a paid blog website, where people can pay to bloggers to see their blogs.
Solution i Chosen
I have chosen NextJS to build static content(SSG). With fallback option, static content can also built after site is deployed.
Problem
Now, the problem is authentication. We can not authenticate any incoming request on server like SSR.
The only way to check authentication is present on client side. Use useEffect hook to check if the current user is authenticated or not.
But, the problem with this approach is that, any user can disable javaScript on client side to view the content.
Is there any way to authenticated SSG page request on server side.
I don't want to use SSR because increased cost.
You can you use a service called Auth0 to implement static site authentication. It is free up to several thousand requests per month and has React components you can use. Make sure to follow the tutorial for auth0-react and NOT nextjs-auth0 (this is for SSR).
Here is the link to Auth0: https://auth0.com/
You could return null if the user is authenticating on SSG. If you're not loading any content via an API, then the user would be able to see it in the code (but not many users would be doing this). There is the option of Vercel Edge Functions now if you haven't managed to fix this issue yet.
I'm enjoying developing cross-browser web extensions, the main target being Chrome, so much that I started to think to develop one for my company. I find a chrome extension quite a cheap and efficient way to deploy internal apps. The main purpose is to host a couple of dynamic dashboards that fetch data from various APIs by using cross-domain ajax in background scripts. I finalized the app and I was also able to implement the authentication via chrome.identity and Azure AD.
However, I am struggling to find a safe way to customise the content.
I mean, when the extension is installed it requires to login to azure via the chrome.identity flow. Then I get a token that I use to query ms graph and get the user ID, name, email and basic info.
Until I get this information I want the browser action (popup) to be unavailable to the user as well as any other extension pages. After a successful login I would like to show the content on the pop up and to let the user access the pages, but here I want to customize the experience.
I know how to use the user id retrieved from the api call to customize the extension, but I think it is not safe because all the code is in the client.
If I code something like
if (user === logged) show something
it will be damn easy for a malicious user to look at the code and bypass it, or even to impersonate another user. And chrome extension cannot be obfuscated.
Any help?
Thanks
I have read through many questions here about launching my app on login. I have followed this awesome tutorial suggested many times. That tutorial does work. BUT...
The one side affect that comes from using a helper app and registering it using SMLoginItemSetEnabled is that my app does not show up inside the user's Login Items in System Preferences.
There are several apps in the App Store (such as PopClip and Dash) that do what I am trying to do. I just can't figure out how...
UPDATE: I found out from the Dash developer that Dash is actually not sandboxed. He also believes that PopClip is not either. This could explain things... https://alpha.app.net/kapeli/post/3975968
UPDATE #2: I just got confirmation from the PopClip dev that it indeed is not sandboxed as well. https://twitter.com/pilotmoon/status/313746294361427968
With the last 2 updates, I guess the answer is clear. As of today, there is no way to accomplish this with Sandboxed apps.
Hope it's not too late.
In Apple's "Daemons and Services Programming Guide":
Adding Login Items
There are two ways to add a login item: using the Service Management framework, and using a shared file list.
Login items installed using the Service Management framework are not visible in System Preferences and can only be removed by the application that installed them.
Login items installed using a shared file list are visible in System Preferences; users have direct control over them. If you use this API, your login item can be disabled by the user, so any other application that communicates with it it should have reasonable fallback behavior in case the login item is disabled.
In sandboxed environment, only Helper applications can be installed in login items. You need to create one, stored in the Contents/Library/LoginItems folder of the main application.
Then you can used SMLoginItemSetEnabled to set the helper as login item and ask the login item to start the main application.
I'm trying to use Instapaper's Simple API (http://www.instapaper.com/api/simple).
The API terms of use (http://www.instapaper.com/api/terms) says apps should not store user id and password, and I don't want to store them either. However, it seems that the only way to add a link to a user's Instapaper via simple API is to store the username/password (if the user does have a password).
Am I missing something?
The API terms of use state that:
Apps must not store users’ passwords. Passwords may only be collected for the xAuth token acquisition and must be discarded afterward.
Only the full API uses xAuth tokens. The above sentence doesn't apply to the simple API, since it uses Basic HTTP Authentication.
You still "must make reasonable efforts to prevent passwords from being compromised, and must not disclose passwords to any other services or individuals".
If you are using a native Mac application (like Apple’s Mail client or a third-party mail client like Airmail) there isn’t an easy way to save a link to Instapaper without first opening the link in a browser and then using one of Instapaper’s browser extensions to actually save the article.
One workaround that I’ve found to expedite this task is to write a service for OS X which uses Instapaper’s API to save links.
In order to write your own service, first open Apple’s Automator application and create a new Service. Then, drag the Run Shell Script action into the application’s main workflow area.
Make sure the service receives no input, can be used by any application, and that the shell script is set to run python.