Comments (10)
As a rule of thumb, never store sensitive info (like usernames or passwords) in the client at all.
With JS-driven apps, you generally want to pass the username/password to the server at login only. The server sends back a session token (which you can save in the client). You use that token for all future validations for the duration of the session.
This is what flows using OAuth, JWTs, and so on do.
from reef.
Ohh, good call. I need to update the docs on this. You'll need to update your server to point all files back to your index.html
file, and that will vary by hosting environment.
I'll post some docs on that soon.
from reef.
So if I'm reading this correctly I have to adjust the way how the server handles routes to do this right?...
from reef.
That's correct, and is true of all SPA's that use "real" URLs for their routes.
Here's an .htaccess
file example for apache servers.
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /reef/demos/router/index.html [L]
</IfModule>
And here's what it might look like in express (taken from the Reach Router docs):
const path = require("path")
const express = require("express")
const app = new express()
// requests for static files in the "public" directory
// like JavaScript, CSS, images will be served
app.use(express.static("public"))
// Every other request will send the index.html file that
// contains your application
app.use("*", function(req, resp) {
resp.sendFile("/public/index.html")
})
app.listen("8000")
This article gets into more details.
from reef.
Butting in for a minute, say you want to protect a route (ie. prevent /admin access only to users logged in. Would you build the auth checks and sessions, etc for keeping track of the user on the server side, then just build the front end and router normally in the index file?
from reef.
I'd do it on the client side
When the user logs in the response would return a user type in the response then create a store for that for easy access and then do the user type referencing in the render event if you want it to be persistent for that session or you're using the traditional CRUD method then check out the sessions API
https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/sessions
from reef.
Sounds a bit insecure though, having authorization code and such on the front end that could be seen or possibly edited easily?
from reef.
Depends on how session state is managed. If it's a single-use token that expires after a short period of time (ex. an OAuth token), the risk is low, and not really all that different from server-managed states with hashed cookie IDs.
from reef.
I guess that does make sense. Would it theoretically be possible to pass work like validating passwords through to the server though?
from reef.
The docs have been updated with info on server configurations.
from reef.
Related Issues (20)
- Add support for on* events that does so safely HOT 2
- 12.3 has broken my app HOT 2
- support disabled and readonly attributes with @ syntax? HOT 5
- jsdoc issue HOT 2
- Listeners remove html attributes HOT 4
- Event functions with parameters HOT 3
- Rename store(), setters() to align with industry norms (breaking change) HOT 1
- Add a way to ignore certain elements when diffing the DOM HOT 1
- How to read a signal's data built via a store? HOT 5
- Add getter methods to store() object
- tbody element not supported as a component root HOT 3
- Add option to keep attributes on nodes with [reef-keep] HOT 9
- onclick attribute removed by reef HOT 3
- Reef types HOT 2
- to do demo bug
- Component composition HOT 2
- Second event handler not correctly registered HOT 6
- 13.0.3 has broken attributes on html HOT 2
- Is the store function doesn't work with component? HOT 1
- Valid HTML5 custom elements render once but do not update HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from reef.