网页H5链接嵌入在uniapp 中 再从H5 跳转到app 中

最近 要做一个uniapp 开发的app 功能，但是因为是用uniapp 进行app 开发 没有图片验证的方法，所以 就让做一个嵌套的功能，把登录模块专门放在网页H5 中，然后登录之后，将token 传递到APP 上， 这样一个操作

<script type="text/javascript" src="https://unpkg.com/@dcloudio/uni-webview-js@0.0.3/index.js" ></script>

我们将这个 标签放在 index.html 中 进行引用

1. 创建一个登录页面

2.  

<van-button size="normal" @click="onSubmit">注册/登录</van-button

<script>

export default{

methods:{
 onSubmit() {
      if (this.checkForm()) {
        if (this.loadingForg) return;
        this.loadingForg = true;
        //接口请求
        getAction("", params)
          .then((res) => {
            if (res.data.code === 200) {
              let token = res.data.result.token;
              let userInfo = res.data.result.userInfo;

              从H5 跳转到app  
              window.uni.postMessage({
                data: {
                  action: "backLogin",
                  token: token,
                  userInfo: userInfo,
                },
              });
              console.log("postMessage", window.uni.postMessage);
              this.$toast(res.data.message);
              this.loadingForg = false;
            } else {
              this.$toast(res.data.message);
              this.loadingForg = false;
            }
          })
          .catch((err) => {
            console.log(err);
            this.loadingForg = false;
          });
      }
    },

}


 }

</script>

3. 在 uniapp 中 ，去接受这个传递过来的信息

<template>
  <view>
    <web-view src="你的网址" @message="getMessage"></web-view>
  </view>
</template>

<script>
  export default {
    methods: {
      getMessage(e) {
        console.log("getMessage", JSON.stringify(e))
        const obj = (e.detail.data[0])
        uni.setStorageSync('token', obj.token)
        uni.setStorageSync('userInfo', obj.userInfo)
        if (obj.action === "backLogin") {
          // 跳转
          uni.reLaunch({
            url: "pages/user/user"
          })
        }
      }
    },
    mounted() {
      console.log("xxxxx mounted")
    }
  }
</script>

 如果 有需要的可以直接复制 用 ，我开始以为 要从H5 跳转到APP  ，根本跳不过来， 所以 要从uniapp 中去跳转，

1. 你也可以自己尝试在mounted 中 尝试 是否可以跳转
 mounted() {
     document.addEventListener("UniAppJSBridgeReady", () => {
        console.log("UniAppJSBridgeReady");
        window.uni.postMessage({
          data: {
            action: "backLogin",
            token: this.token,
          },
        });
      });
      console.log("postMessage", window.uni.postMessage);
  },

不点赞 没关系 记得收藏哦 ！ 真得有用，看别的文章 ，我都不知道他们写的啥 ，所以 我想整理出来 ，有需要的就可以直接复制