WServHapiClient

WServHapiClient

new WServHapiClient(optopt) → {Object}

Description:
  • Hapi瀏覽器端之資料控制與同步器

Source:
Example
import FormData from 'form-data'
import WServHapiClient from './src/WServHapiClient.mjs'


async function client() {

    //WServHapiClient
    let instWServHapiClient = new WServHapiClient({
        FormData,
        getUrl: () => {
            //return window.location.origin + window.location.pathname
            return 'http://localhost:8080'
        },
        useWaitToken: false,
        getToken: () => {
            return '' //Vue.prototype.$store.state.userToken
        },
        getServerMethods: (r) => {
            console.log('getServerMethods', r)
            //Vue.prototype.$fapi = r

            //select tabA
            r.tabA.select(({ prog, p, m }) => {
                console.log('select tabA', prog, p, m)
            })
                .then((res) => {
                    console.log('r.tabA.select then', res)
                })
                .catch((err) => {
                    console.log('r.tabA.select catch', err)
                })

            //select tabB
            r.tabB.select(({ prog, p, m }) => {
                console.log('select tabB', prog, p, m)
            })
                .then((res) => {
                    console.log('r.tabB.select then', res)
                })
                .catch((err) => {
                    console.log('r.tabB.select catch', err)
                })

            //uploadFile
            r.uploadFile({
                name: 'zdata.b1',
                u8a: new Uint8Array([66, 97, 115]),
            // u8a: new Uint8Array(fs.readFileSync('../_data/500mb.7z')), //最多500mb, 因測試使用w-converhp, 其依賴新版@hapi/pez無法處理1g檔案, 會出現: Invalid string length
            }, ({ prog, p, m }) => {
                console.log('uploadFile', prog, p, m)
            })

        },
        recvData: (r) => {
            console.log('recvData', r)
            //Vue.prototype.$store.commit(Vue.prototype.$store.types.UpdateTableData, r)
        },
        getRefreshState: (r) => {
            console.log('getRefreshState', 'needToRefresh', r.needToRefresh)
        },
        getRefreshTable: (r) => {
            console.log('getRefreshTable', 'tableName', r.tableName, 'timeTag', r.timeTag)
        },
        getBeforeUpdateTableTags: (r) => {
            console.log('getBeforeUpdateTableTags', 'needToRefresh', JSON.stringify(r.oldTableTags) !== JSON.stringify(r.newTableTags))
        },
        getAfterUpdateTableTags: (r) => {
            console.log('getAfterUpdateTableTags', 'needToRefresh', JSON.stringify(r.oldTableTags) !== JSON.stringify(r.newTableTags))
        },
        getBeforePollingTableTags: () => {
            console.log('getBeforePollingTableTags')
        },
        getAfterPollingTableTags: () => {
            console.log('getAfterPollingTableTags')
        },
    })

    instWServHapiClient.on('error', (err) => {
        console.log(err)
    })

}
client()

// getServerMethods {
//   tabA: {
//     select: [AsyncFunction: f],
//     insert: [AsyncFunction: f],
//     save: [AsyncFunction: f],
//     del: [AsyncFunction: f]
//   },
//   tabB: {
//     select: [AsyncFunction: f],
//     insert: [AsyncFunction: f],
//     save: [AsyncFunction: f],
//     del: [AsyncFunction: f]
//   },
//   uploadFile: [AsyncFunction: f]
// }
// r.tabA.select then [
//   { id: 'id-tabA-peter', name: 'peter', value: 123 },
//   { id: 'id-tabA-rosemary', name: 'rosemary', value: 123.456 },
//   { id: 'id-tabA-kettle', name: 'kettle', value: 456 }
// ]
// r.tabB.select then [
//   { id: 'id-tabB-peter', name: 'peter', value: 123 },
//   { id: 'id-tabB-rosemary', name: 'rosemary', value: 123.456 }
// ]
// getBeforeUpdateTableTags needToRefresh true
// getRefreshState needToRefresh true
// getRefreshTable tableName tabA timeTag kFv3W1
// recvData {
//   tableName: 'tabA',
//   timeTag: 'kFv3W1',
//   data: [
//     { id: 'id-tabA-peter', name: 'peter', value: 123 },
//     { id: 'id-tabA-rosemary', name: 'rosemary', value: 123.456 },    { id: 'id-tabA-kettle', name: 'kettle', value: 456 }
//   ]
// }
// getAfterUpdateTableTags needToRefresh false
// getBeforeUpdateTableTags needToRefresh true
// getRefreshState needToRefresh true
// getRefreshTable tableName tabA timeTag 2022-03-02T17:05:39+08:00|Mkmsfo
// recvData {
//   tableName: 'tabA',
//   timeTag: '2022-03-02T17:05:39+08:00|Mkmsfo',
//   data: [
//     { id: 'id-tabA-peter', name: 'peter', value: 0.2695575980174958 },
//     { id: 'id-tabA-rosemary', name: 'rosemary', value: 123.456 },    { id: 'id-tabA-kettle', name: 'kettle', value: 456 }
//   ]
// }
// getAfterUpdateTableTags needToRefresh false
// getBeforeUpdateTableTags needToRefresh true
// getRefreshState needToRefresh true
// getRefreshTable tableName tabA timeTag 2022-03-02T17:05:42+08:00|hqCtKH
// recvData {
//   tableName: 'tabA',
//   timeTag: '2022-03-02T17:05:42+08:00|hqCtKH',
//   data: [
//     { id: 'id-tabA-peter', name: 'peter', value: 0.5347793912758274 },
//     { id: 'id-tabA-rosemary', name: 'rosemary', value: 123.456 },    { id: 'id-tabA-kettle', name: 'kettle', value: 456 }
//   ]
// }
// getAfterUpdateTableTags needToRefresh false
// getBeforeUpdateTableTags needToRefresh true
// getRefreshState needToRefresh true
// getRefreshTable tableName tabA timeTag 2022-03-02T17:05:45+08:00|FA4NPZ
// recvData {
//   tableName: 'tabA',
//   timeTag: '2022-03-02T17:05:45+08:00|FA4NPZ',
//   data: [
//     { id: 'id-tabA-peter', name: 'peter', value: 0.5995958376378325 },
//     { id: 'id-tabA-rosemary', name: 'rosemary', value: 123.456 },    { id: 'id-tabA-kettle', name: 'kettle', value: 456 }
//   ]
// }
// getAfterUpdateTableTags needToRefresh false
// getBeforeUpdateTableTags needToRefresh true
// getRefreshState needToRefresh true
// getRefreshTable tableName tabA timeTag 2022-03-02T17:05:48+08:00|8Q88uv
// recvData {
//   tableName: 'tabA',
//   timeTag: '2022-03-02T17:05:48+08:00|8Q88uv',
//   data: [
//     { id: 'id-tabA-peter', name: 'peter', value: 0.45049512863192986 },
//     { id: 'id-tabA-rosemary', name: 'rosemary', value: 123.456 },    { id: 'id-tabA-kettle', name: 'kettle', value: 456 }
//   ]
// }
// getAfterUpdateTableTags needToRefresh false
// getBeforeUpdateTableTags needToRefresh true
// getRefreshState needToRefresh true
// getRefreshTable tableName tabA timeTag 2022-03-02T17:05:51+08:00|1k3U1P
// recvData {
//   tableName: 'tabA',
//   timeTag: '2022-03-02T17:05:51+08:00|1k3U1P',
//   data: [
//     { id: 'id-tabA-peter', name: 'peter', value: 0.07134333448641317 },
//     { id: 'id-tabA-rosemary', name: 'rosemary', value: 123.456 },    { id: 'id-tabA-kettle', name: 'kettle', value: 456 }
//   ]
// }
// getAfterUpdateTableTags needToRefresh false
Parameters:
Name Type Attributes Default Description
opt Object <optional>
{}

輸入設定物件,預設{}

Properties
Name Type Attributes Default Description
FormData function <optional>
()=>''

輸入指定FormData函數,當於nodejs執行時需提供FormData才能使用,可安裝'form-data'並引用取得FormData,預設()=>''

getUrl function <optional>
()=>''

輸入指定getUrl函數,提供伺服器接口網址,預設()=>''

useWaitToken Boolean <optional>
false

輸入是否等待有token才啟動,供驗證使用者已成功登入之用,預設false

getToken function <optional>
()=>''

輸入取得使用者token的回調函數,預設()=>''

getServerMethods function

輸入提供操作物件的回調函數,前後端通訊先取得可呼叫函數清單,映射完之後,後端函數都將放入物件當中,key為函數名而值為函數,並通過回調函數提供該物件

recvData function

輸入取得變更表資料的回調函數

showLog Boolean <optional>
true

輸入是否使用console.log顯示基本資訊布林值,預設true

Returns:

回傳物件,wcc為w-converhp的瀏覽器事件物件,wsdc為w-serv-webdata的瀏覽器事件物件,可監聽error事件

Type
Object