{"id":5074,"date":"2022-04-01T22:47:21","date_gmt":"2022-04-01T14:47:21","guid":{"rendered":"https:\/\/egonlin.com\/?p=5074"},"modified":"2022-04-03T06:53:26","modified_gmt":"2022-04-02T22:53:26","slug":"06-%e6%83%b3%e9%80%86%e5%90%91js%e4%bb%a3%e7%a0%81%ef%bc%9f%e5%85%88%e8%bf%87%e4%ba%86%e5%8f%8ddebug","status":"publish","type":"post","link":"https:\/\/egonlin.com\/?p=5074","title":{"rendered":"06 \u60f3\u9006\u5411js\u4ee3\u7801\uff1f\u5148\u8fc7\u4e86\u53cddebug"},"content":{"rendered":"

\u6709\u65f6\u5019\u6211\u4eec\u5728\u722c\u53d6<\/p>\n

\u67d0\u4e2a\u7528 js \u6e32\u67d3\u7684\u7f51\u7ad9<\/p>\n

\u9700\u8981\u53bb\u5206\u6790\u4e00\u4e0b<\/p>\n

\u522b\u4eba\u7f51\u7ad9\u7684\u6570\u636e\u5c55\u793a\u89c4\u5219<\/p>\n

\u8fd9\u4e2a\u65f6\u5019\u5c31\u4e0d\u5f97\u4e0d\u7528 Chrome \u7684 DevTools \u8fdb\u884c\u5206\u6790\u4e86<\/p>\n

\"\"<\/div><\/p>\n

\u5bf9\u4e8e\u4e00\u822c\u7684\u7f51\u7ad9<\/p>\n

\u6211\u4eec\u5728\u5177\u4f53\u7684\u4f4d\u7f6e<\/p>\n

\u6253\u4e2a\u65ad\u70b9\u5c31\u53ef\u4ee5\u8fdb\u884c\u8c03\u8bd5\u4e86<\/p>\n

\"\"<\/div><\/p>\n

\u4e0d\u8fc7\u6709\u4e00\u4e9b\u7f51\u7ad9<\/p>\n

\u5f53\u4f60\u6253\u5f00 DevTools \u7684\u65f6\u5019<\/p>\n

\u4f60\u90fd\u8fd8\u6ca1\u6253\u65ad\u70b9<\/p>\n

\u4ed6\u5988\u7684\u76f4\u63a5\u5c31\u8fd9\u6837\u4e86<\/p>\n

\"\"<\/div><\/p>\n

\"\"<\/div><\/p>\n

\u4e00\u76f4 debug<\/p>\n

\u53ea\u8981\u4e00\u6309 F2 \u5c31\u4e00\u76f4 debug<\/p>\n

\u5c31\u7b97\u4f60\u8fd0\u884c\u8fc7\u53bb<\/p>\n

\u8fd8\u662f\u4e00\u76f4 debu**<\/strong>g**<\/p>\n

\u4e00\u76f4\u8c03\u7528<\/p>\n

\u5361\u6b7b\u4f60<\/p>\n

\u5361\u6b7b\u4f60<\/p>\n

\u5361\u6b7b\u4f60<\/p>\n

\"\"<\/div><\/p>\n

\u5c31\u662f\u4e0d\u8ba9\u4f60\u8fdb\u884c\u8c03\u8bd5<\/p>\n

\u4f60\u5948\u6211\u4f55<\/p>\n

\"\"<\/div><\/p>\n

\u54c7\u9760\u554a<\/p>\n

\u600e\u4e48\u89e3\u51b3\u5462<\/p>\n

\u63a5\u4e0b\u6765\u5c31\u662f<\/p>\n

\u5b66\u4e60\u53cd\u53cd debug \u7684\u6b63\u786e\u59ff\u52bf<\/strong><\/p>\n

\"\"<\/div><\/p>\n

\u6765\u6765\u6765<\/p>\n

\u83ab\u614c<\/p>\n

\u5c0f\u5e05b\u5148\u8ddf\u4f60\u8bf4\u8bf4<\/p>\n

\u5728 Chrome \u7684\u5f00\u53d1\u8005\u5de5\u5177\u4e2d<\/p>\n

\u600e\u4e48\u6837\u5728\u4ee3\u7801\u91cc\u9762\u6253\u65ad\u70b9<\/p>\n

\u6211\u4eec\u6700\u5e38\u7528\u7684\u64cd\u4f5c<\/p>\n

\u5c31\u662f\u5728\u60f3\u8981\u6253\u65ad\u70b9\u7684\u4ee3\u7801\u884c\u5de6\u4fa7<\/p>\n

\u7528\u9f20\u6807\u8f7b\u8f7b\u70b9\u4e00\u4e0b<\/p>\n

\u5c31\u53ef\u4ee5\u751f\u6210\u4e00\u4e2a\u56fe\u6807<\/p>\n

\u7136\u540e\u5c31\u53ef\u4ee5\u5bf9\u8fd9\u884c\u4ee3\u7801<\/p>\n

\u5f00\u59cb\u8fdb\u884c\u8c03\u8bd5\u4e86<\/p>\n

\"\"<\/div><\/p>\n

\u8fd9\u6837\u7684\u64cd\u4f5c<\/p>\n

\u4e5f\u53ef\u4ee5\u76f4\u63a5\u5728\u4ee3\u7801\u4e2d\u64cd\u4f5c<\/p>\n

\u4f7f\u7528 debugger<\/strong> \u8fd9\u4e2a<\/p>\n

\u5173\u952e\u5b57\u5c31\u53ef\u4ee5\u4e86<\/p>\n

\u6bd4\u5982\u8fd9\u6837\u7684 js<\/p>\n

console.log('a');\nconsole.log('b');debugger;console.log('c');<\/code><\/pre>\n
\u5f53 Chrome \u5728\u8fd0\u884c\u7684\u65f6\u5019<\/p>\n
\u53d1\u73b0\u4e86 debugger<\/p>\n
\u5c31\u4f1a\u505c\u4e0b\u6765<\/p>\n
\u8fdb\u5165\u8c03\u8bd5\u6a21\u5f0f<\/p>\n
\u5176\u5b9e\u5728\u4ee3\u7801\u4e2d<\/p>\n
\u58f0\u660e debugger <\/p>\n
\u5c31\u548c\u6211\u4eec\u70b9\u51fb\u4ee3\u7801\u884c<\/p>\n
\u5de6\u4fa7\u8fdb\u884c\u8c03\u8bd5\u662f\u4e00\u6837\u7684<\/p>\n
\u4e5f\u6b63\u662f\u56e0\u4e3a\u8fd9\u4e2a\u5173\u952e\u5b57<\/p>\n
\u6240\u4ee5\u5c31\u53ef\u4ee5\u4ece\u5b83\u5165\u624b<\/p>\n
\u53ea\u8981\u5728\u9996\u9875\u7684 js \u4e2d<\/p>\n
\u5199\u4e00\u4e2a\u65b9\u6cd5<\/p>\n
\u4e0d\u65ad\u7684\u5faa\u73af\u6267\u884c debugger<\/p>\n
\u6bd4\u5982<\/p>\n
    \n
  • \n<\/li>\n
  • \n<\/li>\n
  • \n<\/li>\n<\/ul>\n
    while true{    debugger;}<\/code><\/pre>\n
    \u90a3\u4e48\u5f53\u6211\u4eec\u6253\u5f00\u8fd9\u4e2a\u7f51\u9875<\/p>\n
    \u7684\u8c03\u8bd5\u9762\u677f\u7684\u65f6\u5019<\/p>\n
    \u5c31\u4f1a\u4e0d\u505c\u7684\u5904\u4e8e debug \u6a21\u5f0f<\/p>\n
    \u5373\u4f7f\u4f60\u75af\u72c2\u7684\u70b9\u51fb\u8fd0\u884c\u6309\u94ae<\/p>\n
    \"\"<\/div><\/p>\n
    \u4e5f\u65e0\u6d4e\u4e8e\u4e8b<\/p>\n
    \"\"<\/div><\/p>\n
    \u5176\u5b9e Chrome \u6709\u4e00\u4e2a\u5ffd\u7565\u65ad\u70b9<\/strong>\u7684\u529f\u80fd<\/p>\n
    \u53ea\u8981\u5728\u4ee3\u7801\u884c\u5de6\u4fa7<\/p>\n
    \u70b9\u51fb\u53f3\u952e<\/p>\n
    \u9009\u62e9 Never pause here<\/strong> \u5373\u53ef<\/p>\n
    \u7136\u540e\u5c31\u4f1a\u6709\u4e2a\u9ec4\u8272\u7684\u6807\u8bc6<\/p>\n
    \"\"<\/div><\/p>\n
    \u5f53\u4e0b\u6b21\u8fd0\u884c\u5230\u8fd9\u91cc\u7684\u65f6\u5019<\/p>\n
    \u5c31\u4f1a\u5ffd\u7565\u8fd9\u4e2a\u65ad\u70b9<\/p>\n
    \u8fd9\u5bf9\u4e8e\u4e00\u4e9b\u7b80\u5355\u7684\u5f88\u6709\u6548<\/p>\n
    \u4f46\u662f<\/p>\n
    \u6709\u4e9b\u6bd4\u8f83\u53d8\u6001<\/strong>\u7684\u5c31\u6ca1\u90a3\u4e48\u5bb9\u6613\u4e86<\/p>\n
    \u6bd4\u5982\u8fd9\u4e2a<\/p>\n
    \"\"<\/div><\/p>\n
    \u5c31\u7b97\u6211\u5ffd\u7565\u4e86<\/p>\n
    \u5b83\u8fd8\u662f\u4f1a\u75af\u72c2\u8fdb\u5165 debug \u6a21\u5f0f<\/p>\n
    \u770b\u770b\u53f3\u8fb9\u7684 Call stack<\/p>\n
    \u4e00\u76f4\u75af\u72c2\u7684\u8c03\u7528 _0xa3e3cc<\/strong><\/p>\n
    \u5403\u4f60\u7684\u5185\u5b58<\/p>\n
    \u628a\u4f60\u641e\u7684\u4e0d\u8981\u4e0d\u8981\u7684<\/p>\n
    \"\"<\/div><\/p>\n
    \u90a3\u600e\u4e48\u529e\u597d\u5462\uff1f<\/p>\n
    \u53ea\u80fd\u770b\u770b\u5b83\u7684\u6e90\u7801\u4e86<\/p>\n
    \"\"<\/div><\/p>\n
    \u53ef\u4ee5\u770b\u5230<\/p>\n
    2949 \u884c<\/p>\n
    \u4e00\u76f4\u5728\u9012\u5f52<\/strong>\u8c03\u7528_0xa3e3cc<\/strong> \u51fd\u6570<\/p>\n
    \u6240\u4ee5<\/p>\n
    \u6211\u4eec\u624d\u4f1a\u4e00\u76f4\u5904\u4e8e debug \u6a21\u5f0f<\/p>\n
    \u65e2\u7136\u5df2\u7ecf\u95ee\u9898\u51fa\u73b0\u5728\u54ea\u91cc\u4e86<\/p>\n
    \u90a3\u5c31\u60f3\u529e\u6cd5\u628a\u8fd9\u4e2a\u7ed9\u641e\u6389<\/p>\n
    \"\"<\/div><\/p>\n
    \u8fd8\u8bb0\u4e0d\u8bb0\u5f97\u6211\u4eec<\/p>\n
    \u4e4b\u524d\u8bf4\u7684 mitmproxy<\/strong><\/p>\n
    \u6ca1\u9519<\/p>\n
    \u8fd9\u6b21\u8d70\u5b83\u7684\u4ee3\u7406<\/p>\n
    \u7136\u540e\u62e6\u622a\u8fd9\u4e2a\u7f51\u9875<\/p>\n
    \u628a js \u4e2d\u7684 debugger \u4ee3\u7801\u53bb\u6389<\/p>\n
    \u7136\u540e\u6211\u4eec\u4e0d\u7528\u53d7\u8fd9\u4e2a\u7f6a\u4e86\u5440<\/p>\n
    \u5feb\u70b9\u5f00\u542f\u6211\u4eec\u7684 mitmweb<\/p>\n
    \u8bbe\u7f6e\u5730\u5740\u62e6\u622a<\/p>\n
    \"\"<\/div><\/p>\n
    \u6d4f\u89c8\u5668\u8bbe\u7f6e\u597d\u4ee3\u7406<\/p>\n
    \"\"<\/div><\/p>\n
    \u6253\u5f00\u4ee3\u7406\u4e4b\u540e\u8bbf\u95ee\u4e00\u6ce2<\/p>\n
    \"\"<\/div><\/p>\n
    \u8fd9\u65f6\u5019\u88ab\u6211\u4eec\u62e6\u622a\u4e0b\u6765\u4e86<\/p>\n
    \"\"<\/div><\/p>\n
    \u8bf7\u6c42\u6211\u4eec\u76f4\u63a5\u8ba9\u5b83\u8fc7\u53bb<\/p>\n
    \"\"<\/div><\/p>\n
    \u56e0\u4e3a\u6211\u4eec\u53ea\u8981\u62e6\u622a\u8fd4\u56de\u7684\u6570\u636e<\/strong><\/p>\n
    \u7136\u540e\u5bf9\u5b83\u8fdb\u884c\u4fee\u6539<\/strong><\/p>\n
    ok<\/p>\n
    \u73b0\u5728\u6211\u4eec\u5c31\u62e6\u622a\u5230\u8fd4\u56de\u7684\u6570\u636e\u4e86<\/p>\n
    \"\"<\/div><\/p>\n
    \u4fee\u6539\u4e00\u4e0b\u4ee3\u7801<\/p>\n
    \u70b9\u51fb\u8fd9\u652f\u7b14<\/p>\n
    \"\"<\/div><\/p>\n
    \u53ef\u4ee5\u770b\u5230\u73b0\u5728\u7684\u4ee3\u7801\u96be\u770b<\/p>\n
    \"\"<\/div><\/p>\n
    \u590d\u5236\u51fa\u6765\u7528\u7f16\u8f91\u5668\u6253\u5f00\u5427<\/p>\n
    \"\"<\/div><\/p>\n
    \u628a\u8c03\u7528\u9012\u5f52\u7684\u4ee3\u7801\u53bb\u6389<\/p>\n
    \"\"<\/div><\/p>\n
    \u628a debugger \u5173\u952e\u5b57\u6362\u6210 return<\/p>\n
    \"\"<\/div><\/p>\n
    \u590d\u5236\u5230 mitmweb \u66ff\u6362<\/p>\n
    \"\"<\/div><\/p>\n
    \u53f3\u4e0a\u89d2\u7684\u52fe\u7ed9\u6253\u4e0a<\/p>\n
    \u7136\u540e\u8fd0\u884c<\/p>\n
    \"\"<\/div><\/p>\n
    \"\"<\/div><\/p>\n
    \u6b64\u65f6\u6b64\u523b<\/p>\n
    \u6d4f\u89c8\u5668\u5f97\u5230\u7684\u5c31\u662f\u4fee\u6539\u8fc7\u7684\u6587\u4ef6<\/p>\n
    \"\"<\/div><\/p>\n
    \u6253\u5f00 F12<\/p>\n
    \"\"<\/div><\/p>\n
    \u53ef\u4ee5\u770b\u5230<\/p>\n
    \u4e0d\u4f1a\u5728\u4e00\u76f4 debug \u6076\u5fc3\u6211\u4eec\u4e86<\/p>\n
    \u53ef\u80fd\u4e0d\u540c\u7684\u7f51\u7ad9<\/p>\n
    \u53cd debug \u7684\u5b9e\u73b0\u4e0d\u540c<\/p>\n
    \u601d\u8def\u5c31\u662f\u8fd9\u4e48\u4e2a\u601d\u8def<\/p>\n
    \u4ee5\u4e0d\u53d8\u5e94\u4e07\u53d8<\/p>\n","protected":false},"excerpt":{"rendered":"
    \u6709\u65f6\u5019\u6211\u4eec\u5728\u722c\u53d6 \u67d0\u4e2a\u7528 js \u6e32\u67d3\u7684\u7f51\u7ad9 \u9700\u8981\u53bb\u5206\u6790\u4e00\u4e0b \u522b\u4eba\u7f51\u7ad9\u7684\u6570\u636e\u5c55\u793a\u89c4\u5219 \u8fd9\u4e2a\u65f6\u5019\u5c31\u4e0d\u5f97\u4e0d\u7528 Chr […]<\/p>\n","protected":false},"author":3,"featured_media":5095,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[371,378],"tags":[],"_links":{"self":[{"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/posts\/5074"}],"collection":[{"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5074"}],"version-history":[{"count":0,"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/posts\/5074\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=\/wp\/v2\/media\/5095"}],"wp:attachment":[{"href":"https:\/\/egonlin.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5074"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=5074"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/egonlin.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=5074"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}