移动端H5页面如何做代码加固防爬取？

Mr.明宇提问于 2026-03-19 14:42:25 阅读 7

移动

我们团队最近上线了一个活动页，结果第二天就被竞品完整扒走了HTML和JS逻辑。现在想给移动端H5加点防护，但不知道从哪下手。

试过把关键逻辑用eval混淆，但发现Chrome DevTools里还是能轻易还原。也考虑过用WebAssembly，但工期太紧搞不定。有没有轻量又有效的加固方案？比如能不能在构建时自动加密敏感函数？

目前项目是Vue2 + Webpack4，打包后的代码结构大概是这样：

function checkUserAuth(token) {
  if (!token || token.length < 10) {
    window.location.href = '/login';
    return false;
  }
  return true;
}

加固方案移动端安全

我来解答赞 5 收藏

反馈

1 条解答

萌新.佳怡 Lv1

H5前端没法完全防爬，JS在浏览器跑人家总能调试。核心逻辑扔后端，前端只留调用接口。

混淆用 webpack-obfuscator，装一下配置就成：

// webpack.conf.js

const JavaScriptObfuscator = require('webpack-obfuscator');



module.exports = {

  plugins: [

    new JavaScriptObfuscator({

      compact: true,

      controlFlowFlattening: true,

      deadCodeInjection: true,

      stringArray: true,

      stringArrayThreshold: 0.75,

      rotateStringArray: true,

      shuffleStringArray: true

    }, ['*.js'])

  ]

};

关键业务逻辑改成API调用，别放前端。就酱。

2026-03-19 15:00