[Angular] Protect The Session Id with https and http only
For the whole signup process. we need to
- Hash the password to create a password digest
- Store the user's info and password digest into db
- Create a random sessionId to assoc with user
- Set Session Id into cookie
async function createUserAndSession(res, credentials) { // Create a password digest const passwordDigest = await argon2.hash(credentials.password); // Save into db const user = db.createUser(credentials.email, passwordDigest); // create random session id const sessionId = await randomBytes(32).then(bytes => bytes.toString('hex')); // link sessionId with user sessionStore.createSession(sessionId, user); // set sessionid into cookie res.cookie('SESSIONID', sessionId); // send back to UI res.status(200).json({id: user.id, email: user.email}); } ----- const util = require('util'); const crypto = require('crypto'); // convert a callback based code to promise based export const randomBytes = util.promisify( crypto.randomBytes ); ----- import {Session} from './session'; import {User} from '../src/app/model/user'; class SessionStore { private sessions: {[key: string]: Session} = {}; createSession(sessionId: string, user: User) { this.sessions[sessionId] = new Session(sessionId, user); } } // We want only global singleton export const sessionStore = new SessionStore();
Now we have set the cookie, later, each request we send to the server, this cookie will be attached in the request header, we can confirm that:
But the problem is that, hacker can inject some script to get our cookie by using:
document.cookie
It enables the hacker to attack our site by just set cookie in his broswer, then in each reqest, the cookie will be sent to server, cookie is the only thing which server used to verfiy the user.
document.cookie = "......"
To protect that, we can make cookie can only be accessed by http, not JS:
// set sessionid into cookie res.cookie('SESSIONID', sessionId, { httpOnly: true, // js cannot access cookie });
We can see that "HTTP" column was marked.
Second, we need to enable https protect.
To do that in server:
// set sessionid into cookie res.cookie('SESSIONID', sessionId, { httpOnly: true, // js cannot access cookie secure: true // enable https only });
We also need to adjust angular cli so that app run on https:
package.json:
"start": "ng serve --proxy-config ./proxy.json --ssl 1 --ssl-key key.pem --ssl-cert cert.pem",
// proxy.json { "/api": { "target": "https://localhost:9000", "secure": true } }
We can see that "Secure" column now is also marked.
相关文章
- 从 Angular Component 和 Directive 的实例化,谈谈 Angular forRoot 方法的命令由来
- 一个 Angular 开发人员对腾讯 Cloud Studio 使用后的体验报告
- SAP 电商云 Spartacus UI Angular UI 和 Accelerator JSP UI 的混合使用
- Angular HTTPClient API 在 SAP 电商云中的使用
- Angular HTTPClient 发送请求的触发方式讨论
- Angular 里 HTTP 请求和响应结构的拦截器(interceptors)在 SAP Spartacus 中的应用
- 关于 Angular 工程文件 angular.json 里的 inlineCritical 属性
- 一款开源的 Angular Storefront 应用介绍,代号 Spartacus 诞生的历史背景
- Angular 应用里 ng-package.json 文件的作用是什么?
- 关于 Angular 应用的 Bootstrap 过程
- Angular 依赖注入错误消息:ERROR Error NullInjectorError No provider for XX
- Angular 应用里 server.ts 文件的 APP_BASE_HREF token 的用法?
- 什么是 Angular library 的 secondary entry points?
- MySQL Error number: 3739; Symbol: ER_SRS_INVALID_ANGULAR_UNIT; SQLSTATE: SR002 报错 故障修复 远程处理
- Angular与React、Vue.js的对比
- 高质量 VR 直播有望了,Google 带来 Equi-Angular Cubemaps 技术
- angular中使用路由和$location切换视图