sessioin-and-cookie example

This commit is contained in:
King Wang
2021-06-14 17:45:11 +08:00
parent 5af32e67ba
commit 54c2f31f83
28 changed files with 297 additions and 233 deletions

View File

@@ -15,8 +15,8 @@
<div class="buttons">
<button id="btnTest">Test</button>
<button id="btnClear">Clear</button>
<button id="btnGetSession">Get Session</button>
<button id="btnGetCookie">Get Cookie</button>
<button id="btnSetSession">Set Session</button>
<button id="btnSetCookie">Set Cookie</button>
</div>
<h2>API Request</h2>

View File

@@ -1,5 +1,5 @@
import { HttpClient } from 'tsrpc-browser';
import { enableSessionAndCookie } from './models/enableSessionAndCookie';
import { enableCookie } from './models/enableCookie';
import { showReqAndRes } from './models/showReqAndRes';
import { serviceProto } from './shared/protocols/serviceProto';
@@ -10,7 +10,7 @@ let client = new HttpClient(serviceProto, {
});
// Session and Cookie
enableSessionAndCookie(client);
enableCookie(client);
// Show Req and Return to View
showReqAndRes(client);
@@ -23,9 +23,9 @@ $('#btnTest').onclick = () => {
$('#btnClear').onclick = () => {
client.callApi('Clear', {});
};
$('#btnGetCookie').onclick = () => {
client.callApi('GetCookie', {});
$('#btnSetCookie').onclick = () => {
client.callApi('SetCookie', {});
};
$('#btnGetSession').onclick = () => {
client.callApi('GetSession', {});
$('#btnSetSession').onclick = () => {
client.callApi('SetSession', {});
};

View File

@@ -1,19 +1,13 @@
import { HttpClient } from "tsrpc-browser";
const CookieStorageKey = '__MY_COOKIE__';
const SessionStorageKey = '__MY_SESSION__';
export function enableSessionAndCookie(client: HttpClient<any>) {
export function enableCookie(client: HttpClient<any>) {
// Send
client.flows.preCallApiFlow.push(v => {
// Auto get __cookie from localStorage
let cookieStr = localStorage.getItem(CookieStorageKey);
v.req.__cookie = cookieStr ? JSON.parse(cookieStr) : undefined;
// Auto get __session from sessionStorage
let sessionStr = sessionStorage.getItem(SessionStorageKey);
v.req.__session = sessionStr ? JSON.parse(sessionStr) : undefined;
return v;
})
@@ -24,10 +18,6 @@ export function enableSessionAndCookie(client: HttpClient<any>) {
if (v.return.res.__cookie) {
localStorage.setItem(CookieStorageKey, JSON.stringify(v.return.res.__cookie))
}
// Auto set __session to sessionStorage
if (v.return.res.__session) {
sessionStorage.setItem(SessionStorageKey, JSON.stringify(v.return.res.__session))
}
}
return v;

View File

@@ -1,7 +1,13 @@
import { HttpClient } from "tsrpc-browser";
export function showReqAndRes(client: HttpClient<any>) {
// Send
// Clear when send
client.flows.preCallApiFlow.push(v => {
document.querySelector('.apiReq')!.innerHTML = '';
document.querySelector('.apiReturn')!.innerHTML = '';
return v;
});
// Ouput when recv
client.flows.postApiReturnFlow.push(v => {
(document.querySelector('.apiReq') as HTMLElement).innerText = 'callApi: ' + v.apiName + '\n\n' + JSON.stringify(v.req, null, 2);
(document.querySelector('.apiReturn') as HTMLElement).innerText = JSON.stringify(v.return, null, 2);

View File

@@ -1,9 +0,0 @@
import { BaseRequest, BaseResponse } from './base'
export interface ReqGetCookie extends BaseRequest {
}
export interface ResGetCookie extends BaseResponse {
}

View File

@@ -1,9 +0,0 @@
import { BaseRequest, BaseResponse } from './base'
export interface ReqGetSession extends BaseRequest {
}
export interface ResGetSession extends BaseResponse {
}

View File

@@ -0,0 +1,9 @@
import { BaseRequest, BaseResponse } from './base'
export interface ReqSetCookie extends BaseRequest {
}
export interface ResSetCookie extends BaseResponse {
}

View File

@@ -0,0 +1,9 @@
import { BaseRequest, BaseResponse } from './base'
export interface ReqSetSession extends BaseRequest {
}
export interface ResSetSession extends BaseResponse {
}

View File

@@ -1,9 +1,10 @@
import { BaseRequest, BaseResponse } from './base'
import { BaseRequest, BaseResponse } from './base';
export interface ReqTest extends BaseRequest {
}
export interface ResTest extends BaseResponse {
// From Session
testSession?: string
}

View File

@@ -1,9 +1,12 @@
export interface BaseRequest {
__session?: { [key: string]: any };
__cookie?: { [key: string]: any };
__cookie?: Cookie;
}
export interface BaseResponse {
__session?: { [key: string]: any };
__cookie?: { [key: string]: any };
__cookie?: Cookie;
}
export interface Cookie {
sessionId?: string,
[key: string]: any
}

View File

@@ -1,7 +1,7 @@
import { ServiceProto } from 'tsrpc-proto';
import { ReqClear, ResClear } from './PtlClear';
import { ReqGetCookie, ResGetCookie } from './PtlGetCookie';
import { ReqGetSession, ResGetSession } from './PtlGetSession';
import { ReqSetCookie, ResSetCookie } from './PtlSetCookie';
import { ReqSetSession, ResSetSession } from './PtlSetSession';
import { ReqTest, ResTest } from './PtlTest';
export interface ServiceType {
@@ -10,13 +10,13 @@ export interface ServiceType {
req: ReqClear,
res: ResClear
},
"GetCookie": {
req: ReqGetCookie,
res: ResGetCookie
"SetCookie": {
req: ReqSetCookie,
res: ResSetCookie
},
"GetSession": {
req: ReqGetSession,
res: ResGetSession
"SetSession": {
req: ReqSetSession,
res: ResSetSession
},
"Test": {
req: ReqTest,
@@ -29,25 +29,24 @@ export interface ServiceType {
}
export const serviceProto: ServiceProto<ServiceType> = {
"version": 3,
"services": [
{
"id": 3,
"id": 0,
"name": "Clear",
"type": "api"
},
{
"id": 0,
"name": "GetCookie",
"type": "api"
},
{
"id": 1,
"name": "GetSession",
"name": "SetCookie",
"type": "api"
},
{
"id": 2,
"name": "SetSession",
"type": "api"
},
{
"id": 3,
"name": "Test",
"type": "api"
}
@@ -70,34 +69,34 @@ export const serviceProto: ServiceProto<ServiceType> = {
"properties": [
{
"id": 0,
"name": "__session",
"type": {
"type": "Interface",
"indexSignature": {
"keyType": "String",
"type": {
"type": "Any"
}
}
},
"optional": true
},
{
"id": 1,
"name": "__cookie",
"type": {
"type": "Interface",
"indexSignature": {
"keyType": "String",
"type": {
"type": "Any"
}
}
"type": "Reference",
"target": "base/Cookie"
},
"optional": true
}
]
},
"base/Cookie": {
"type": "Interface",
"properties": [
{
"id": 0,
"name": "sessionId",
"type": {
"type": "String"
},
"optional": true
}
],
"indexSignature": {
"keyType": "String",
"type": {
"type": "Any"
}
}
},
"PtlClear/ResClear": {
"type": "Interface",
"extends": [
@@ -115,35 +114,16 @@ export const serviceProto: ServiceProto<ServiceType> = {
"properties": [
{
"id": 0,
"name": "__session",
"type": {
"type": "Interface",
"indexSignature": {
"keyType": "String",
"type": {
"type": "Any"
}
}
},
"optional": true
},
{
"id": 1,
"name": "__cookie",
"type": {
"type": "Interface",
"indexSignature": {
"keyType": "String",
"type": {
"type": "Any"
}
}
"type": "Reference",
"target": "base/Cookie"
},
"optional": true
}
]
},
"PtlGetCookie/ReqGetCookie": {
"PtlSetCookie/ReqSetCookie": {
"type": "Interface",
"extends": [
{
@@ -155,7 +135,7 @@ export const serviceProto: ServiceProto<ServiceType> = {
}
]
},
"PtlGetCookie/ResGetCookie": {
"PtlSetCookie/ResSetCookie": {
"type": "Interface",
"extends": [
{
@@ -167,7 +147,7 @@ export const serviceProto: ServiceProto<ServiceType> = {
}
]
},
"PtlGetSession/ReqGetSession": {
"PtlSetSession/ReqSetSession": {
"type": "Interface",
"extends": [
{
@@ -179,7 +159,7 @@ export const serviceProto: ServiceProto<ServiceType> = {
}
]
},
"PtlGetSession/ResGetSession": {
"PtlSetSession/ResSetSession": {
"type": "Interface",
"extends": [
{
@@ -213,6 +193,16 @@ export const serviceProto: ServiceProto<ServiceType> = {
"target": "base/BaseResponse"
}
}
],
"properties": [
{
"id": 0,
"name": "testSession",
"type": {
"type": "String"
},
"optional": true
}
]
}
}