JSBridge调用时如何防止恶意注入攻击？

纪娜提问于 2026-03-21 17:22:23 阅读 9

移动

我在Vue项目里通过JSBridge调用原生功能，但担心有人篡改传参导致安全问题。比如用户在输入框里填了恶意脚本，我直接传给原生会不会出事？

目前我是这样调的：

<template>
  <input v-model="userInput" />
  <button @click="callNative">提交</button>
</template>

<script>
export default {
  data() {
    return { userInput: '' }
  },
  methods: {
    callNative() {
      window.JSBridge.invoke('submitData', { content: this.userInput })
    }
  }
}
</script>

有没有必要对 userInput 做转义或校验？原生端是不是也得做防护？有点拿不准该在哪一层处理更安全。

移动端安全

我来解答赞 2 收藏

反馈

1 条解答

Designer°羽沫 Lv1

确实需要对 userInput 做些处理，这样更清晰。前端做一层过滤可以防止一些简单的攻击，但原生端也必须做防护，毕竟前端的安全措施容易被绕过。

前端这边可以先简单地对输入进行转义或者正则校验，确保传给原生的数据是预期的格式。比如，如果你知道输入应该是纯文本，可以先移除所有 HTML 标签：

methods: {

  callNative() {

    const sanitizedInput = this.userInput.replace(/<[^>]*>/g, '')

    window.JSBridge.invoke('submitData', { content: sanitizedInput })

  }

}

不过，这种做法只能防住一部分恶意输入，原生端还是要对接收到的数据做严格的校验和过滤。这样才能确保即使绕过了前端的防护，也无法注入恶意代码。

2026-03-21 18:03