From e9e07d1469f980ca651118d20ca44895f572eeeb Mon Sep 17 00:00:00 2001 From: itenl Date: 2021年3月11日 11:48:15 +0800 Subject: [PATCH 1/4] Fixed React-Native cannot capture network in the debug env --- .prettierrc | 12 ++++++++ src/event.js | 40 ++++++++++++------------ src/network.js | 4 +-- src/tool.js | 83 +++++++++++++++++++++++++++++++++++++++++++++++++- 4 files changed, 116 insertions(+), 23 deletions(-) create mode 100644 .prettierrc diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000..128c6d2 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,12 @@ +{ + "singleQuote": true, + "bracketSpacing": true, + "semi": true, + "trailingComma": "none", + "printWidth": 200, + "tabWidth": 2, + "jsxBracketSameLine": false, + "arrowParens": "avoid", + "requirePragma": false, + "proseWrap": "preserve" +} diff --git a/src/event.js b/src/event.js index c4808ec..1950247 100644 --- a/src/event.js +++ b/src/event.js @@ -1,52 +1,52 @@ export default class Event { constructor() { - this.eventList = {} + this.eventList = {}; } on(eventName, callback) { if (!this.eventList[eventName]) { - this.eventList[eventName] = [] + this.eventList[eventName] = []; } - this.eventList[eventName].push(callback) - return this + this.eventList[eventName].push(callback); + return this; } trigger(...args) { - const key = Array.prototype.shift.call(args) - const fns = this.eventList[key] + const key = Array.prototype.shift.call(args); + const fns = this.eventList[key]; if (!fns || fns.length === 0) { - return this + return this; } for (let i = 0, fn; (fn = fns[i++]); ) { - fn.apply(this, args) + fn.apply(this, args); } - return this + return this; } off(key, fn) { - const fns = this.eventList[key] + const fns = this.eventList[key]; if (!fns) { - return this + return this; } if (!fn) { if (fns) { - fns.length = 0 + fns.length = 0; } } else { for (let i = fns.length - 1; i>= 0; i--) { - const _fn = fns[i] + const _fn = fns[i]; if (_fn === fn) { - fns.splice(i, 1) + fns.splice(i, 1); } } } - return this + return this; } } -let event -module.exports = (function() { +let event; +module.exports = (function () { if (!event) { - event = new Event() + event = new Event(); } - return event -})() + return event; +})(); diff --git a/src/network.js b/src/network.js index e1e1782..8a10531 100644 --- a/src/network.js +++ b/src/network.js @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import { TextInput, Clipboard, View, Text, StyleSheet, FlatList, TouchableOpacity } from 'react-native'; import event from './event'; -import { debounce } from './tool'; +import { debounce, getJSEnvironment, EnvType } from './tool'; let ajaxStack = null; @@ -603,6 +603,6 @@ export default Network; export const traceNetwork = () => { if (!ajaxStack) { ajaxStack = new AjaxStack(); - proxyAjax(global.originalXMLHttpRequest || global.XMLHttpRequest, ajaxStack); + proxyAjax([EnvType.MACINTOSH, EnvType.WINDOWS].includes(getJSEnvironment().name) ? global.XMLHttpRequest : global.originalXMLHttpRequest || global.XMLHttpRequest, ajaxStack); } }; diff --git a/src/tool.js b/src/tool.js index 3853476..e000a36 100644 --- a/src/tool.js +++ b/src/tool.js @@ -49,8 +49,89 @@ function replaceReg(str) { }); } +const EnvType = { + WINDOWS: 'win', + MACINTOSH: 'mac', + LINUX: 'linux', + IOS: 'iOS', + ANDROID: 'Android', + BLACKBERRY: 'bb', + WINDOWS_PHONE: 'winphone', + REACTNATIVE: 'react-native' +}; + +function getJSEnvironment() { + if (navigator.userAgent) { + var userAgent = navigator.userAgent; + var platform, result; + function getDesktopOS() { + var pf = navigator.platform; + if (pf.indexOf('Win') != -1) { + var rVersion = /Windows NT (\d+).(\d)/i; + var uaResult = userAgent.match(rVersion); + var sVersionStr = ''; + if (uaResult[1] == '6') { + if (uaResult[2] == 1) { + sVersionStr = '7'; + } else if (uaResult[2]> 1) { + sVersionStr = '8'; + } + } else { + sVersionStr = uaResult[1]; + } + return { name: EnvType.WINDOWS, versionStr: sVersionStr }; + } else if (pf.indexOf('Mac') != -1) { + return { name: EnvType.MACINTOSH, versionStr: '' }; + } else if (pf.indexOf('Linux') != -1) { + return { name: EnvType.LINUX, versionStr: '' }; + } + return null; + } + platform = /Windows Phone (?:OS )?([\d.]*)/; + result = userAgent.match(platform); + if (result) { + return { name: EnvType.WINDOWS_PHONE, versionStr: result[1] }; + } + if (userAgent.indexOf('(BB10;')> 0) { + platform = /\sVersion\/([\d.]+)\s/; + result = userAgent.match(platform); + if (result) { + return { name: EnvType.BLACKBERRY, versionStr: result[1] }; + } else { + return { name: EnvType.BLACKBERRY, versionStr: '10' }; + } + } + platform = /\(([a-zA-Z ]+);\s(?:[U]?[;]?)([\D]+)((?:[\d._]*))(?:.*[\)][^\d]*)([\d.]*)\s/; + result = userAgent.match(platform); + if (result) { + var appleDevices = /iPhone|iPad|iPod/; + var bbDevices = /PlayBook|BlackBerry/; + if (result[0].match(appleDevices)) { + result[3] = result[3].replace(/_/g, '.'); + return { name: EnvType.IOS, versionStr: result[3] }; + } else if (result[2].match(/Android/)) { + result[2] = result[2].replace(/\s/g, ''); + return { name: EnvType.ANDROID, versionStr: result[3] }; + } else if (result[0].match(bbDevices)) { + return { name: EnvType.BLACKBERRY, versionStr: result[4] }; + } + } + platform = /\((Android)[\s]?([\d][.\d]*)?;.*Firefox\/[\d][.\d]*/; + result = userAgent.match(platform); + if (result) { + return { name: EnvType.ANDROID, versionStr: result.length == 3 ? result[2] : '' }; + } + // Desktop + return getDesktopOS(); + } else { + return { name: EnvType.REACTNATIVE, versionStr: '' }; + } +} + module.exports = { throttle, debounce, - replaceReg + replaceReg, + getJSEnvironment, + EnvType }; From 651c8edd63f3e98534a8e0a488c1c91ed09c87c6 Mon Sep 17 00:00:00 2001 From: itenl Date: 2021年3月13日 00:14:46 +0800 Subject: [PATCH 2/4] remove egg-code --- package.json | 2 +- src/config/index.js | 3 +- src/info.js | 88 ++++++++++++++++++--------------------------- src/log.js | 3 +- 4 files changed, 39 insertions(+), 57 deletions(-) diff --git a/package.json b/package.json index cf9382c..32b7e91 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-vdebug", - "version": "1.2.2", + "version": "1.2.3", "description": "React-Native 调试工具", "main": "index.js", "scripts": { diff --git a/src/config/index.js b/src/config/index.js index a313ce9..e66cdce 100644 --- a/src/config/index.js +++ b/src/config/index.js @@ -7,6 +7,7 @@ export default { homepage: 'https://itenl.com', repository: packagejson.repository.url, description: packagejson.description, - version: packagejson.version + version: packagejson.version, + toStar: 'Light up the little star and support me.' } }; diff --git a/src/info.js b/src/info.js index 6b4991e..9bc651f 100644 --- a/src/info.js +++ b/src/info.js @@ -1,49 +1,33 @@ import React, { Component } from 'react'; -import { Clipboard, ScrollView, View, Text } from 'react-native'; +import { Clipboard, ScrollView, View, Text, TouchableOpacity, Linking, Alert } from 'react-native'; import config from '../src/config'; export default class Info extends Component { constructor(props) { super(props); this.state = { - info: '', - enabled: false + appInfo: '', + exteranlInfo: '' }; } - verifyPassword() { - Clipboard.getString().then(password => { - const date = new Date(); - if (password == `${date.getFullYear()}${date.getMonth() + 1}${date.getDate()}|itenl`) { - this.setState({ - enabled: true - }); - } - }); - } - getScrollRef() { return this.scrollView; } componentDidMount() { - let info = Object.assign( - { - APP_INFO: config.APPINFO - }, - { EXTERNAL_INFO: this.props.info } - ); - if (typeof info === 'object') { - try { - info = JSON.stringify(info, null, 2); - } catch (err) { - console.log(err); - } + let appInfo = ''; + let exteranlInfo = ''; + try { + appInfo = JSON.stringify(config, null, 2); + if (typeof this.props.info === 'object') exteranlInfo = JSON.stringify({ EXTERANLINFO: this.props.info }, null, 2); + } catch (err) { + console.log(err); } this.setState({ - info + appInfo, + exteranlInfo }); - this.verifyPassword(); } render() { @@ -54,32 +38,28 @@ export default class Info extends Component { }} style={{ flex: 1, padding: 5 }} > - - {this.state.info} - - - {` - .::::. - .::::::::::. - :::::::::::: - ..:::::::::::::' - ':::::::::::::' - .::::::::::: - '::::::::::::::.. - ..:::::::::::::::::. - :::::::::::::::::::: - :::: :::::::::::' .:::. - ::::' '::::::' .::::::::. - .::::' ::::: .:::::::':::::. - :.:::' :::::: .:::::::::' ':::::. - .::' :::::.:::::::::' ':::::. - .::' ::::::::::::::' ::::. - ...::: ::::::::::::' ::. - ':. ':::::::::' :::::::::. - '.:::::' ':' - `} - Goddess bless you, there will never be BUG. - + { + Linking.canOpenURL(config.APPINFO.repository) + .then(supported => { + if (supported) return Linking.openURL(config.APPINFO.repository); + }) + .catch(err => console.log('An error occurred', err)); + }} +> + {this.state.appInfo} + + { + try { + Clipboard.setString(this.state.exteranlInfo); + Alert.alert('Info', 'Copy successfully', [{ text: 'OK' }]); + } catch (error) {} + }} +> + {this.state.exteranlInfo} + ); } diff --git a/src/log.js b/src/log.js index 8e57266..e2a9d08 100644 --- a/src/log.js +++ b/src/log.js @@ -2,6 +2,7 @@ import React, { Component } from 'react'; import { TextInput, FlatList, Text, StyleSheet, View, TouchableOpacity, Clipboard, TouchableWithoutFeedback, Alert } from 'react-native'; import event from './event'; import { debounce } from './tool'; +import config from './config'; const LEVEL_ENUM = { All: '', @@ -172,7 +173,7 @@ class Log extends Component { { try { - Clipboard.setString(`${item.data}\r\n\r\nLight up the little star and support me.\r\nhttps://github.com/itenl/react-native-vdebug`); + Clipboard.setString(`${item.data}\r\n\r\n${config.APPINFO.toStar}\r\nhttps://github.com/itenl/react-native-vdebug`); Alert.alert('Info', 'Copy successfully', [{ text: 'OK' }]); } catch (error) {} }} From b877d0c809f131142f15e7f2f39b6986b8a2d7a3 Mon Sep 17 00:00:00 2001 From: itenl Date: 2021年3月13日 11:12:22 +0800 Subject: [PATCH 3/4] added vdebug-version for XMLReq --- src/network.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/network.js b/src/network.js index 8a10531..6454d7e 100644 --- a/src/network.js +++ b/src/network.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import { TextInput, Clipboard, View, Text, StyleSheet, FlatList, TouchableOpacity } from 'react-native'; import event from './event'; +import config from './config'; import { debounce, getJSEnvironment, EnvType } from './tool'; let ajaxStack = null; @@ -483,6 +484,7 @@ function proxyAjax(XHR, stack) { XMLReq._requestID = id; XMLReq._method = method; XMLReq._url = url; + XMLReq._headers['vdebug-version'] = config.APPINFO.version; // mock onreadystatechange const _onreadystatechange = XMLReq.onreadystatechange || function () {}; From 0abc683216e608779905a48800fc915199b43879 Mon Sep 17 00:00:00 2001 From: itenl Date: 2021年4月23日 16:38:54 +0800 Subject: [PATCH 4/4] process headers --- src/network.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/network.js b/src/network.js index 6454d7e..35bbaa9 100644 --- a/src/network.js +++ b/src/network.js @@ -484,7 +484,7 @@ function proxyAjax(XHR, stack) { XMLReq._requestID = id; XMLReq._method = method; XMLReq._url = url; - XMLReq._headers['vdebug-version'] = config.APPINFO.version; + if(XMLReq._headers) XMLReq._headers['vdebug-version'] = config.APPINFO.version; // mock onreadystatechange const _onreadystatechange = XMLReq.onreadystatechange || function () {};

AltStyle によって変換されたページ (->オリジナル) /