资讯专栏INFORMATION COLUMN

在Chrome控制台注入npm模块

aaron / 1185人阅读

摘要:工具和资料群高级爬虫作者自建群,欢迎加入作者收集的爬虫相关工具和资料正文上次研究了如何在内置解释器中加载模块,这两天手头又有一个需求,要在浏览器的开发者控制台中加载同样的模块,以便在控制台中验证一些想法。

工具和资料

QQ群 - Javascript高级爬虫 - 作者自建群,欢迎加入!

awesome-java-crawler - 作者收集的爬虫相关工具和资料

正文

上次研究了如何在java内置javascript解释器nashorn中加载npm模块,这两天手头又有一个需求,要在Chrome浏览器的开发者控制台中加载同样的npm模块,以便在控制台中验证一些想法。
因为对前端开发不算熟悉,不知道有没有其它的好方案,这个是我自己摸索的,但确实可用。

流程

npm下载browserify
npm i browserify -g

写一个简单js文件,使用require加载npm模块,并注入到window对象
window.acorn = require("./acorn")

使用browserify打包这个js,该工具会自动把所有依赖的npm模块和简单js打包成单个js文件
browserify entry.js > require_acorn.js

把require_acorn.js文件的内容粘贴到开发者控制台并执行,然后就可以使用了

代码压缩

到这里其实桌面Chrome浏览器就没有问题了,我又用inspector连上安卓版Chrome试了一下,结果控制台崩了……
估计是acorn太大了,毕竟有5000多行,于是又试了试压缩:

npm下载uglify.js
npm i uglify-js -g

压缩前面生成的单个js包
uglifyjs require_acorn.js > require_acorn.min.js

这次果然没有问题了,在控制台执行typeof acorn可看到模块已经正确加载。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/42976.html

相关文章

  • Chrome制台注入npm模块

    摘要:工具和资料群高级爬虫作者自建群,欢迎加入作者收集的爬虫相关工具和资料正文上次研究了如何在内置解释器中加载模块,这两天手头又有一个需求,要在浏览器的开发者控制台中加载同样的模块,以便在控制台中验证一些想法。 工具和资料 QQ群 - Javascript高级爬虫 - 作者自建群,欢迎加入! awesome-java-crawler - 作者收集的爬虫相关工具和资料 正文 上次研究了...

    CoorChice 评论0 收藏0
  • webpack实战

    摘要:和类似的预处理器还有等。的用处非常多,包括给自动加前缀使用下一代语法等,目前越来越多的人开始用它,它很可能会成为预处理器的最终赢家。 webpack实战 查看所有文档页面:全栈开发,获取更多信息。快马加鞭,加班加点,终于把这个文档整理出来了,顺便深入地学习一番,巩固知识,就是太累人,影响睡眠时间和质量。极客就是想要把事情做到极致,开始了就必须到达终点。 原文链接:webpack实战,原...

    cyrils 评论0 收藏0
  • 写一个 Chrome 扩展之 Flat Weibo —— 简洁你的微博世界

    摘要:一般而言,扩展会对用户浏览的页面进行相应的操作和一些数据传递,本案例的本质是,当用户浏览网页版微博时,扩展会向当前页面注入预先写好的,这样便对微博网页版进行了样式重构。采用这样的方法依次处理所有你不想看到的元素,你的微博便会简洁很多。 0x00. 前言 微博现在也是变得越来越臃肿,广告越来越多,早已不再是微博了,这让微博深度用户的我感到十分焦灼。由于之前就尝试写过 Chrome 插件,...

    fredshare 评论0 收藏0
  • Javascript模块全揽

    摘要:要求模块编写必须在真正的代码之外套上一层规定的代码包装,样子看起来是这样的模块代码通过传递一个签名为的回调函数给函数,就可以把需要注入的变量和函数注入到模块代码内。 之前写的文章急速Js全栈教程得到了不错的阅读量,霸屏掘金头条3天,点赞过千,阅读近万,甚至还有人在评论区打广告,可见也是一个小小的生态了;)。看来和JS全栈有关的内容,还是有人颇有兴趣的。 showImg(https://...

    lily_wang 评论0 收藏0
  • 某网站高度加密混淆的javascript的分析

    摘要:前言对某网站加密混淆后的代码也算分析了一段时间了,虽然还没搞出来,但多少有些心得,这里记录一下。因此,应该将局部变量也替换成唯一且更有意义的名字,比如函数名变量索引因此,正确的方法是基于编译原理进行语法级别的替换。 showImg(https://segmentfault.com/img/remote/1460000018765904); 前言 对某网站加密混淆后的javascript...

    newsning 评论0 收藏0

发表评论

0条评论

aaron

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<