You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 line
20 KiB
Plaintext
1 line
20 KiB
Plaintext
{"version":3,"sources":["flow.js","utils.js","App.js","reportWebVitals.js","index.js"],"names":["FlowManager","this","items","_map","Map","filterText","filterTimer","num","max","filter","item","request","url","includes","no","push","set","id","length","oldest","shift","delete","get","text","callback","clearTimeout","setTimeout","isTextResponse","response","header","test","join","getSize","len","parseInt","body","byteLength","isNaN","toFixed","buildMessage","messageType","content","TextEncoder","encode","data","Uint8Array","App","props","flowMgr","state","flows","showList","flow","flowTab","interceptUriInputing","interceptUri","ws","initWs","close","host","URL","document","WebSocket","binaryType","onopen","console","log","onclose","onmessage","evt","msg","meta","Int8Array","slice","type","TextDecoder","decode","resp","waitIntercept","JSON","parse","err","parseMessage","add","setState","error","onerror","className","onClick","Button","size","stringify","send","style","padding","method","statusCode","Object","keys","map","key","clear","Form","Control","placeholder","onChange","e","value","target","changeFilterLazy","display","alignItems","Table","striped","bordered","f","u","path","pathname","search","classNames","renderFlow","React","Component","reportWebVitals","onPerfEntry","Function","then","getCLS","getFID","getFCP","getLCP","getTTFB","ReactDOM","render","StrictMode","getElementById"],"mappings":"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","file":"static/js/main.597545a3.chunk.js","sourcesContent":["export class FlowManager {\n constructor() {\n this.items = []\n this._map = new Map()\n this.filterText = ''\n this.filterTimer = null\n this.num = 0\n\n this.max = 1000\n }\n\n showList() {\n if (!this.filterText) return this.items\n return this.items.filter(item => {\n return item.request.url.includes(this.filterText)\n })\n }\n\n add(item) {\n item.no = ++this.num\n this.items.push(item)\n this._map.set(item.id, item)\n \n if (this.items.length > this.max) {\n const oldest = this.items.shift()\n this._map.delete(oldest.id)\n }\n }\n\n get(id) {\n return this._map.get(id)\n }\n\n changeFilter(text) {\n this.filterText = text\n }\n\n changeFilterLazy(text, callback) {\n if (this.filterTimer) {\n clearTimeout(this.filterTimer)\n this.filterTimer = null\n }\n\n this.filterTimer = setTimeout(() => {\n this.filterText = text\n callback()\n }, 300)\n }\n\n clear() {\n this.items = []\n this._map = new Map()\n }\n}\n","export const isTextResponse = response => {\n if (!response) return false\n if (!response.header) return false\n if (!response.header['Content-Type']) return false\n\n return /text|javascript|json/.test(response.header['Content-Type'].join(''))\n}\n\nexport const getSize = response => {\n if (!response) return '0'\n if (!response.header) return '0'\n\n let len\n if (response.header['Content-Length']) {\n len = parseInt(response.header['Content-Length'][0])\n } else if (response && response.body) {\n len = response.body.byteLength\n }\n if (!len) return '0'\n if (isNaN(len)) return '0'\n if (len <= 0) return '0'\n \n if (len < 1024) return `${len} B`\n if (len < 1024*1024) return `${(len/1024).toFixed(2)} KB`\n return `${(len/(1024*1024)).toFixed(2)} MB`\n}\n\nexport const parseMessage = data => {\n if (data.byteLength < 39) return null\n const meta = new Int8Array(data.slice(0, 3))\n const version = meta[0]\n if (version !== 1) return null\n const type = meta[1]\n if (![1, 2, 3].includes(type)) return null\n const id = new TextDecoder().decode(data.slice(3, 39))\n\n const resp = {\n type: ['request', 'response', 'responseBody'][type-1],\n id,\n waitIntercept: meta[2] === 1,\n }\n if (data.byteLength === 39) return resp\n if (type === 3) {\n resp.content = data.slice(39)\n return resp\n }\n\n let content = new TextDecoder().decode(data.slice(39))\n try {\n content = JSON.parse(content)\n } catch (err) {\n return null\n }\n\n resp.content = content\n return resp\n}\n\n/**\n * \n * @param {number} messageType \n * @param {string} id \n * @param {string} content \n */\nexport const buildMessage = (messageType, id, content) => {\n content = new TextEncoder().encode(content)\n const data = new Uint8Array(39 + content.byteLength)\n data[0] = 1\n data[1] = messageType\n data[2] = 0\n data.set(new TextEncoder().encode(id), 3)\n data.set(content, 39)\n return data\n}\n","import React from 'react'\nimport Table from 'react-bootstrap/Table'\nimport Form from 'react-bootstrap/Form'\nimport Button from 'react-bootstrap/Button'\nimport './App.css'\n\nimport { FlowManager } from './flow'\nimport { isTextResponse, getSize, parseMessage, buildMessage } from './utils'\n\nclass App extends React.Component {\n\n constructor(props) {\n super(props)\n\n this.flowMgr = new FlowManager()\n\n this.state = {\n flows: this.flowMgr.showList(),\n flow: null,\n\n flowTab: 'Headers', // Headers, Preview, Response\n\n interceptUriInputing: '',\n interceptUri: '',\n }\n\n this.ws = null\n }\n\n componentDidMount() {\n this.initWs()\n }\n\n componentWillUnmount() {\n if (this.ws) {\n this.ws.close()\n }\n }\n\n initWs() {\n if (this.ws) return\n\n let host;\n if (process.env.NODE_ENV === 'development') {\n host = 'localhost:9081'\n } else {\n host = new URL(document.URL).host\n }\n this.ws = new WebSocket(`ws://${host}/echo`)\n this.ws.binaryType = 'arraybuffer'\n this.ws.onopen = () => { console.log('OPEN') }\n this.ws.onclose = () => { console.log('CLOSE') }\n this.ws.onmessage = evt => {\n const msg = parseMessage(evt.data)\n if (!msg) {\n console.error('parse error:', evt.data)\n return\n }\n // console.log('msg:', msg)\n\n if (msg.type === 'request') {\n const flow = { id: msg.id, request: msg.content, waitIntercept: msg.waitIntercept }\n this.flowMgr.add(flow)\n this.setState({ flows: this.flowMgr.showList() })\n }\n else if (msg.type === 'response') {\n const flow = this.flowMgr.get(msg.id)\n if (!flow) return\n flow.waitIntercept = msg.waitIntercept\n flow.response = msg.content\n this.setState({ flows: this.state.flows })\n }\n else if (msg.type === 'responseBody') {\n const flow = this.flowMgr.get(msg.id)\n if (!flow || !flow.response) return\n flow.waitIntercept = msg.waitIntercept\n flow.response.body = msg.content\n this.setState({ flows: this.state.flows })\n }\n }\n this.ws.onerror = evt => {\n console.log('ERROR:', evt)\n }\n }\n\n renderFlow() {\n const { flow, flowTab } = this.state\n if (!flow) return null\n\n const request = flow.request\n const response = flow.response || {}\n\n return (\n <div className=\"flow-detail\">\n <div className=\"header-tabs\">\n <span onClick={() => { this.setState({ flow: null }) }}>x</span>\n <span className={flowTab === 'Headers' ? 'selected' : null} onClick={() => { this.setState({ flowTab: 'Headers' }) }}>Headers</span>\n <span className={flowTab === 'Preview' ? 'selected' : null} onClick={() => { this.setState({ flowTab: 'Preview' }) }}>Preview</span>\n <span className={flowTab === 'Response' ? 'selected' : null} onClick={() => { this.setState({ flowTab: 'Response' }) }}>Response</span>\n {\n !flow.waitIntercept ? null :\n <div className=\"flow-wait-area\">\n <Button size=\"sm\" onClick={() => {\n const msg = buildMessage(11, flow.id, JSON.stringify(flow.request))\n this.ws.send(msg)\n flow.waitIntercept = false\n this.setState({ flows: this.state.flows })\n }}>Continue</Button>\n <Button size=\"sm\">Drop</Button>\n </div>\n }\n </div>\n\n <div style={{ padding: '20px' }}>\n {\n !(flowTab === 'Headers') ? null :\n <div>\n <div className=\"header-block\">\n <p>General</p>\n <div className=\"header-block-content\">\n <p>Request URL: {request.url}</p>\n <p>Request Method: {request.method}</p>\n <p>Status Code: {`${response.statusCode || '(pending)'}`}</p>\n </div>\n </div>\n\n <div className=\"header-block\">\n <p>Response Headers</p>\n <div className=\"header-block-content\">\n {\n !(response.header) ? null :\n Object.keys(response.header).map(key => {\n return (\n <p key={key}>{key}: {response.header[key].join(' ')}</p>\n )\n })\n }\n </div>\n </div>\n\n <div className=\"header-block\">\n <p>Request Headers</p>\n <div className=\"header-block-content\">\n {\n !(request.header) ? null :\n Object.keys(request.header).map(key => {\n return (\n <p key={key}>{key}: {request.header[key].join(' ')}</p>\n )\n })\n }\n </div>\n </div>\n </div>\n }\n\n {\n !(flowTab === 'Response') ? null :\n !(response.body && response.body.byteLength) ? <div>No response</div> :\n !(isTextResponse(response)) ? <div>Not text response</div> :\n <div>\n {new TextDecoder().decode(response.body)}\n </div>\n }\n </div>\n\n </div>\n )\n }\n \n render() {\n const { flows, interceptUriInputing, interceptUri } = this.state\n return (\n <div className=\"main-table-wrap\">\n <div className=\"top-control\">\n <div><Button size=\"sm\" onClick={() => {\n this.flowMgr.clear()\n this.setState({ flows: this.flowMgr.showList(), flow: null })\n }}>Clear</Button></div>\n <div>\n <Form.Control\n size=\"sm\" placeholder=\"Filter\"\n onChange={(e) => {\n const value = e.target.value\n this.flowMgr.changeFilterLazy(value, () => {\n this.setState({ flows: this.flowMgr.showList() })\n })\n }}\n >\n </Form.Control>\n </div>\n\n <div style={{ display: 'flex', alignItems: 'center' }}>\n <Form.Control size=\"sm\" placeholder=\"Set interpect\" value={interceptUriInputing} onChange={e => {\n this.setState({ interceptUriInputing: e.target.value || '' })\n }}></Form.Control>\n <Button size=\"sm\" onClick={() => {\n this.setState({ interceptUri: interceptUriInputing })\n const msg = buildMessage(21, '00000000-0000-0000-0000-000000000000', interceptUriInputing)\n this.ws.send(msg)\n }}>Set</Button>\n {\n interceptUri ? <span>{`Intercept:${interceptUri}`}</span> : null\n }\n </div>\n </div>\n\n <Table striped bordered size=\"sm\">\n <thead>\n <tr>\n <th>No</th>\n <th>Host</th>\n <th>Path</th>\n <th>Method</th>\n <th>Status</th>\n <th>Size</th>\n </tr>\n </thead>\n <tbody>\n {\n flows.map(f => {\n const url = f.request.url\n const u = new URL(url)\n let host = u.host\n if (host.length > 35) host = host.slice(0, 35) + '...'\n let path = u.pathname + u.search\n if (path.length > 65) path = path.slice(0, 65) + '...'\n\n const request = f.request\n const response = f.response || {}\n\n const classNames = []\n if (this.state.flow && this.state.flow.id === f.id) classNames.push('tr-selected')\n if (f.waitIntercept) classNames.push('tr-wait-intercept')\n\n return (\n <tr className={classNames.length ? classNames.join(' ') : null} key={f.id}\n onClick={() => {\n this.setState({ flow: f })\n }}\n >\n <td>{f.no}</td>\n <td>{host}</td>\n <td>{path}</td>\n <td>{request.method}</td>\n <td>{response.statusCode || '(pending)'}</td>\n <td>{getSize(response)}</td>\n </tr>\n )\n })\n }\n </tbody>\n </Table>\n\n {this.renderFlow()}\n </div>\n )\n }\n}\n\nexport default App\n","const reportWebVitals = onPerfEntry => {\n if (onPerfEntry && onPerfEntry instanceof Function) {\n import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {\n getCLS(onPerfEntry)\n getFID(onPerfEntry)\n getFCP(onPerfEntry)\n getLCP(onPerfEntry)\n getTTFB(onPerfEntry)\n })\n }\n}\n\nexport default reportWebVitals\n","import React from 'react'\nimport ReactDOM from 'react-dom'\nimport 'bootstrap/dist/css/bootstrap.min.css'\nimport App from './App'\nimport reportWebVitals from './reportWebVitals'\n\nReactDOM.render(\n <React.StrictMode>\n <App />\n </React.StrictMode>,\n document.getElementById('root')\n)\n\n// If you want to start measuring performance in your app, pass a function\n// to log results (for example: reportWebVitals(console.log))\n// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals\nreportWebVitals()\n"],"sourceRoot":""} |