uniapp组件webview无法访问某些外部网站（header HTTP_USER_AGENT Html5Plus blocked）

报错：header HTTP_USER_AGENT Html5Plus blocked

场景：使用uniapp原生组件web-view去访问公司的官网遇到这个问题

定位问题：

• 打开chrome，在网址栏输入chrome://inspect，USB连线手机真机调试

• 打开DevTools，在控制台输入window.plus，查看是否为undefined还是一个对象

• 结果发现是一个对象，这就会被网站检测出来，环境是uniapp H+，从而触发网站的反扒机制

  由上可知我们的重点就在于处理window.plus

解决方法

其实知道这个原因后我们最好是直接找公司的官网源码，配个白名单之类的，最简单了。但是和负责人扯皮可比开发更难.........

我最后找到的解决方法是在页面加载完成后直接删除window.plus

最后我封装web-view写了一个新的组件，一下是代码

▼
vue
复制代码
<template>
  <web-view
    :src="src"
    :sandbox="sandbox"
    ref="webview"
    @pagefinish="onPageFinish"
    v-bind="$attrs"
  />
</template>

<script>
export default {
  name: 'SafeWebView',
  props: {
    src: {
      type: String,
      required: true
    },
    sandbox: {
      type: String,
      default: 'allow-scripts allow-same-origin allow-forms allow-popups'
    }
  },
  methods: {
    // 页面加载完成后，自动删除 window.plus
    onPageFinish() {
		console.log('wuwuwu!!!');
      // #ifdef APP-PLUS
      // 通过 evalJs 注入脚本删除 window.plus
      // 注意：webview 组件在 APP-PLUS 下才有 evalJs 方法
      const webview = this.$refs.webview;
      if (webview && webview.evalJs) {
        webview.evalJs(`
          if (window.plus) {
            delete window.plus;
            // 兼容某些框架下的只读属性
            try { window.plus = undefined; } catch(e) {}
            console.log('SafeWebView: window.plus 已被删除');
          }
        `);
      }
      // #endif
      this.$emit('pagefinish');
    }
  }
};
</script>