濡傛灉瑙夊緱鏂囩珷涓嶉敊锛岃鍏虫敞銆佺偣璧炪€佸垎浜紒缁х画鍒嗕韩鎶€鏈崥鏂囷紝鍏虫敞寰俊鍏紬鍙佛煈夝煆诲ソ涔呮病涓婂墠绔疞eBron浜嗭紝鎬庝箞杩欎箞涔呬笉鏇存柊锛焑mmm...鏈€杩戠殑鎬ц兘娴嬭瘎瀛ｏ紝鎬ц兘鎬荤粨锛?60娴嬭瘎锛岃鍐欑殑涓滆タ寰堝锛岃€借浜嗕竴娈垫椂闂达紝搴熻瘽涓嶅璇达紝娆㈣繋JavaScript璁捐绗笁绡囨ā寮忥細浠ｇ悊妯″紡~浠ｇ悊妯″紡姒傚康浠ｇ悊妯″紡涓哄璞℃彁渚涗唬鐞嗗璞℃垨鍗犱綅绗︼紝浠ｇ悊瀵硅薄鎺у埗瀵瑰師濮嬪璞＄殑寮曠敤銆備篃鍙互鐞嗚В涓哄澶栨毚闇茬殑鎺ュ彛涓嶆槸鍘熸潵鐨勫璞°€傞€氫織鍦拌锛岀敓娲讳腑涔熸湁姣旇緝甯歌鐨勪唬鐞嗘ā寮忥細涓粙銆佷唬閿€銆佺粡绾汉绛夌瓑銆傝繖绉嶆ā寮忕殑鎰忎箟鍦ㄤ簬锛屽綋鏉ヨ鑰呭拰鍙楄鑰呬笉鏂逛究鐩存帴璁块棶/鑱旂郴鏃讹紝鎻愪緵涓€涓浛浠ｈ€呮潵澶勭悊浜ゆ槗杩囩▼銆傚疄闄呰闂槸鏇夸唬銆傛浛浠ｈ€呭浜嬪姟鍋氫簡涓€浜涘鐞?杩囨护鍚庯紝鍐嶄紶閫掔粰鏈綋瀵硅薄锛屽噺杞绘湰浣撳璞＄殑璐熸媴銆傛渶绠€鍗曠殑浠ｇ悊妯″紡鐨勫疄鐜扮敱绠€鍗曞埌澶嶆潅銆傛垜浠簡瑙ｄ簡浠ｇ悊妯″紡鐨勭浉鍏虫蹇点€備笅闈㈡垜浠皢閫氳繃涓€涓渶绠€鍗曠殑浠ｇ悊妯″紡鐨勪緥瀛愭潵瀹炵幇浠ｇ悊妯″紡锛屼粠浠ｇ爜涓劅鍙椾竴涓嬩唬鐞嗘ā寮忕殑娴佺▼銆傝皥璇濆緢渚垮疁銆傛樉绀轰唬鐮侊紒瀹㈡埛绔悜鏈嶅姟鍣ㄥ彂閫佽姹備唬鐞嗗皢璇锋眰杞彂鍒版湇鍔″櫒鏈嶅姟鍣ㄥ鐞嗚姹俢onstRequest=function(){};constclient={requestTo:(server)=>{constreq=newRequest();鏈嶅姟鍣?receiveRequest(req);},};constserver={handleRequest:(request)=>{console.log('receiverequest:',request);},};constproxy={receiveRequest:(request)=>{console.log('proxyrequest:',request);鏈嶅姟鍣?handleRequest锛堣姹傦級锛泒,};client.requestTo(proxy);/***proxyrequest:Request{}*receiverequest:Request{}*/ProtectionProxyProtectionProxy椤惧悕鎬濅箟灏辨槸淇濇姢鏈綋涓嶈鍩轰簬璧勬簮璁块棶鍏充簬鏉冮檺鎺у埗銆備笅闈㈡垜浠敤涓€涓満鏅拰涓€涓緥瀛愭潵瀹為檯浣撻獙涓€涓嬨€傚熀浜庝笂杩版渶灏忎唬鐞嗘ā寮忚繘琛屾墿灞曪紝鎴戜滑鍙互浣跨敤淇濇姢浠ｇ悊鏉ヨ繃婊や笉璇疯嚜鏉ョ殑璧勬簮銆傞€氳繃韬唤楠岃瘉璇锋眰銆佺洃鍚湇鍔″櫒鍑嗗鍙戦€佽姹傜瓑鎿嶄綔锛屼繚鎶ゅ疄浣撴湇鍔″櫒鍏嶅彈闈炴硶璇锋眰鏀诲嚮锛屽噺杞绘湇鍔″櫒璐熸媴銆俢onstproxy={receiveRequest:(request)=>{//楠岃瘉韬唤constpass=validatePassport(request);if(pass){//鏈嶅姟鍣ㄥ氨缁悗鐩戝惉浠ｇ悊璇锋眰server.listenReady(()=>{console.log('proxyrequest:',request);server.handleRequest(request);});}},};VirtualProxy铏氭嫙浠ｇ悊浣滀负鍒涘缓鏄傝吹瀵硅薄鐨勫璞＄殑浠ｈ〃锛屽府鍔╂帶鍒舵槀璐佃祫婧愮殑鍒涘缓锛岀洿鍒扮湡姝ｉ渶瑕佸畠浠椂锛屽啀鍒涘缓涓€涓璞°€傝櫄鎷熶唬鐞嗗厖褰撳璞＄殑鏇夸唬鑰呫€傚璞″垱寤哄悗锛岀洿鎺ュ皢璧勬簮濮旀墭缁欏疄浣撳璞°€備笅闈㈠皢瀹炵幇涓€涓櫄鎷熶唬鐞嗗疄鐜板浘鐗囬鍔犺浇鐨勪緥瀛愶紝浠庝唬鐮佸拰瀹為檯鍦烘櫙涓劅鍙椾竴涓嬭櫄鎷熶唬鐞嗙殑鍔ㄤ綔銆傚疄浣撳浘鍍忓璞″畨瑁呭湪涓讳綋涓€傜敱浜庡姞杞藉浘鐗囪€楁椂楂樸€佹垚鏈珮锛屽洜姝ゅ湪鍔犺浇鍥剧墖璧勬簮鏃讹紝灏嗗疄浣撳浘鐗囧璞¤缃负loading鐘舵€併€備娇鐢ㄥ埆鍚嶅璞℃墽琛屽浘鐗囪祫婧愬姞杞姐€傜洃鍚埆鍚嶅璞¤祫婧愬姞杞斤紝灏嗚祫婧愭浛鎹负Entity瀵硅薄=>{imgNode.src=src;},setLoading:()=>{imgNode.src='loading.gif'}};})();constproxyImg=(()=>{//鏇胯韩imageobjectconsttempImg=newImage();//鐩戝惉璧勬簮鍔犺浇瀹屾垚鍚庯紝灏嗚祫婧愭浛鎹负瀹炰綋鍥剧墖瀵硅薄tempImg.onload=function(){img.setSrc(this.src);};return{//浠ｇ悊寮€濮嬭缃疄浣撳璞′负loading鐘舵€侊紝浣跨敤鍒悕瀵硅薄寮€濮嬪姞杞藉浘鐗嘡esourcesetSrc:(src)=>{img.setLoading()tempImg.src=src;}}})();proxyImg.setSrc('file.jpg')浠ｇ悊妯″紡鐨勫簲鐢ㄧ湅瀹屼簡淇濇姢浠ｇ悊鍜岃櫄鎷熶唬鐞嗘垜浠啀鏉ョ湅鐪嬪墠绔唬鐞嗘ā寮忕殑涓€浜涘叿浣撳簲鐢ㄨ姹備紭鍖栵紙鍩嬬偣銆侀敊璇暟鎹仛鍚堜笂鎶ワ級.鍓嶆鏃堕棿鏈夊垢鍙楅個鍙傚姞浜咮yteTech瀛楄妭闈掕钀ョ殑璇勫銆傚鏌ョ殑涓昏閮ㄥ垎鏄墠绔洃鎺х郴缁熴€備富棰橀」鐩€傚墠绔洃鎺т細娑夊強鍒颁竴浜涢敊璇瓑淇℃伅鐨勪笂鎶ワ紝鏈夌殑椤圭洰鍙疄鐜版渶绠€鍗曠殑HTTP璇锋眰涓婃姤銆傞儴鍒嗛」鐩杩欓儴鍒嗗唴瀹瑰仛浜嗗涓嬩紭鍖栵紝鏄瘮杈冨悎閫傜殑浠ｇ悊妯″紡瀹炶返鍦烘櫙锛歂avigator.sendBeacon浣跨敤鎴蜂唬鐞嗘湁鏈轰細寮傛鍙戦€佹暟鎹紙HTTPPOST锛夊埌鏈嶅姟绔紝涓嶅奖鍝嶄氦浜掓€ц兘https锛?/developer.mozilla.org...鏁版嵁鑱氬悎涓婃姤锛堜紭鍖栫増鏃犱唬鐞嗘ā寮忥紝姣忎唤鎶ュ憡浣跨敤璇锋眰涓婃姤锛夊噺灏戣姹傛鏁帮紝鑱氬悎澶氫釜浜嬩欢/淇℃伅锛岀敤浜庝笂鎶ュ畾鏃跺拰瀹氶噺鍒嗙粍涓嬮潰涓や釜绠€鍗曞疄鐜颁笂鎶ュ師鐞嗗浘浠ｇ爜璁℃椂constevents=[];constTIMER=10000;lettimer=null;constinit=()=>{//鍒濆鍖栨椂鍚姩瀹氭椂鍣╰imer=setInterval(()=>{//瀹氭椂浣跨敤sendBeacon鎶ュ憡constevts=events.splice(0,events.length);navigator.sendBeacon('/path',{events:evts});},TIMER);};constdestroyed=()=>{//褰撳畾鏃跺櫒琚攢姣佹椂娓呴櫎瀹氭椂鍣╟learInterval(timer);};constreport=(eventName,data)=>{//sdk鎶ヨ〃宸ュ叿鍑芥暟锛岃仛鍚堜簨浠秂vents.push({eventName,data,});};閲忓寲鍒嗙粍constevents=[];constLIMIT=10;constreportRequest=()=>{//閲忓寲鍒嗙粍浣跨敤sendBeacon涓婃姤constevts=events.splice(0,LIMIT);navigator.sendBeacon('/path',{events:evts});};constreport=(eventName,data)=>{//sdk涓婃姤宸ュ叿鍑芥暟锛岃仛鍚堜簨浠秂vents.push({eventName,data,});濡傛灉锛堜簨浠躲€傞暱搴?=LIMIT){reportRequest();}};鏁版嵁缂撳瓨浠ｇ悊涔嬪墠鐪嬭繃涓€閬撻潰璇曢锛氱紦瀛樿繃鏈熸椂鍓嶇濡備綍鑷姩鍒犻櫎缂撳瓨锛熷鏋滄闈㈡€濊€冿紝缂撳瓨杩囨湡锛岀▼搴忓叧闂紝濡備綍鍒犻櫎鍛紵鍙︿竴绉嶆柟寮忥細杩囨湡鏃朵笉瑕佺珛鍗宠缃紝鑾峰彇鏃跺彧闇€瑕佸垽鏂紦瀛樻槸鍚﹁繃鏈熷嵆鍙€傛嬁鍒扮殑鏃跺€欓渶瑕佸垽鏂紦瀛樻槸鍚﹁繃鏈熴€傝繃鏈熶簡鍙互鍒犻櫎鍝閫氳繃ProxyStorage浠ｇ悊缂撳瓨涓棿浠讹紝瀹炵幇浜嗘敮鎸佽缃紦瀛樿繃鏈熸椂闂寸殑浠ｇ悊灞傘€傛槗浜庡垏鎹㈢紦瀛樹腑闂翠欢锛屽鍔犲彲缁存姢鎬,get(key){constv=localStorage.getItem(key);濡傛灉(!v){杩斿洖绌哄€硷紱}const{maxAge,value,time}=JSON.parse(v);constnow=Date.now();濡傛灉锛堢幇鍦?鏃堕棿+maxAge*1000锛墈杩斿洖鍊硷紱}else{localStorage.removeItem(key);杩斿洖绌哄€硷紱}},has(key){constv=localStorage.getItem(key);濡傛灉锛堬紒v锛墈杩斿洖鍋囷紱}const{maxAge,time}=JSON.parse(v);constnow=Date.now();濡傛灉锛堢幇鍦?鏃堕棿+maxAge*1000锛墈杩斿洖鐪燂紱}else{localStorage.removeItem(key);r杩斿洖鍋囷紱}},};璇锋眰鍑芥暟鐨勫皝瑁呴€氳繃浠ｇ悊鏂瑰紡灏佽璇锋眰鍑芥暟锛屽彲浠ュ疄鐜板涓嬪姛鑳斤細妞嶅叆閫氱敤鍙傛暟锛岄€氱敤璇锋眰澶村叏灞€璇锋眰鍩嬬偣涓婃姤鍏ㄥ眬寮傚父鐘舵€佺爜澶勭悊鍣ㄥ叏灞€璇锋眰閿欒锛屽紓甯镐笂鎶ュ拰澶勭悊constSUCCESS_STATUS_CODE=200,FAIL_STATUS_CODE=400;constisValidHttpStatus=(statusCode)=>statusCode>=SUCCESS_STATUS_CODE&&statusCode
