1.uni-app中对接第三方为了防止跳出app使用了webview

<template>

    <view>

        <web-view :src="url"  @message="message"></web-view>

    </view>

</template>

<script>

    export default {

        data() {

            return {

                url: ''

            }

        },

        onLoad(option) {

            // console.log(JSON.parse(decodeURIComponent(option.url)))

            this.url = JSON.parse(decodeURIComponent(option.url))//跳转第三方的url

        },

        methods:{

            message(e){    //接收html发回来的消息判断是否成功，然后跳转页面

                console.log(e.detail)

                uni.switchTab({

                    url: '/pages/member/user'

                });

            }

        }

    }

</script>

2.顺利的跳转到第三方的时候进行一些操作，例如支付等

3.地方支付成功后会有回调函数，进行一些操作

4.为了从第三方的h5跳回到app 写了个新的html页面

5.uni-app打包后会有static文件夹 所以将页面放到static文件夹中

<!DOCTYPE html>

<html>

    <head>

        <title>正在返回...</title>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

        <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>//不引入的话不能进行监听

        <script>

            function load(){

                // alert("测试")

                let local = window.location.href;

                // alert(local)

                console.log(local)

                let sourceType = getQueryVariable('sourceType');//传参得值

                let env = getQueryVariable('env');/传参得值

                    document.addEventListener('UniAppJSBridgeReady', function() {

                           uni.postMessage({   //监听向uni-app发消息

                               data: {

                                   action: 'success'

                               }

                           });

                       })

            }

            function getQueryVariable(variable) //通过url获取参数

            {

                   var query = window.location.search.substring(1);

                   var vars = query.split("&");

                   for (var i=0;i<vars.length;i++) {

                           var pair = vars[i].split("=");

                           if(pair[0] == variable){return pair[1];}

                   }

                   return(false);

            }

        </script>

    </head>

    <body οnlοad="load()">

    </body>

</html>

uni-app开发经验分享十八：对接第三方h5的更多相关文章

  1. uni-app开发经验分享十九： uni-app对接微信小程序直播

    uni-app对接微信小程序直播 1.登录微信小程序后台-点击>设置->第三方设置->添加直播插件 2.添加直播组件后->点击<详情>      记录这两个参数直播 ...

  2. uni-app开发经验分享十六：发布android版App的详细过程

    开发环境 1. Android Studio下载地址:Android Studio官网 OR Android Studio中文社区 2. HBuilderX(开发工具) 3. App离线SDK下载:最 ...

  3. uni-app开发经验分享十五： uni-app 蓝牙打印功能

    最近在做uni-app项目时,遇到了需要蓝牙打印文件的功能需要制作,在网上找到了一个教程,这里分享给大家. 引入tsc.js 简单得引入到自己所需要得页面中去,本次我们只要到了标签模式,他同时还有账单 ...

  4. uni-app开发经验分享十： 封装request请求

    http.js //封装requset,uploadFile和downloadFile请求,新增get和post请求方法 let http = { 'setBaseUrl': (url) => ...

  5. C#&.Net干货分享- 构造SMSWebChineseApi对接第三方短信平台

    你们想要的短信对接,要舍得点钱哦.... /// <summary>    /// http://sms.webchinese.cn/api.shtml    /// </summa ...

  6. uni-app开发经验分享十四：小程序超过2M限制的方法——分包加载

      起初小程序上线时,微信限制了代码包不能超过1MB,后来功能变大变成了2M了,限制大小是出于对小程序启动速度的考虑,希望用户在使用任何一款小程序时,都能获得一种"秒开"体验.但是 ...

  7. uni-app开发经验分享十二： Android平台应用启动时读写手机存储、访问设备信息(如IMEI)等权限策略及提示信息

    Android平台从6.0(API23)开始系统对权限的管理更加严格,所有涉及敏感权限都需要用户授权允许才能获取.因此一些应用基础业务逻辑需要的权限会在应用启动时申请,并引导用户允许. 读写手机存储权 ...

  8. php分享十八七：mysql基础

    mysql操作数据库代码: $link = @mysql_connect('localhost:3306', 'root', 'root') or die(mysql_error()); mysql_ ...

  9. php分享十八：网页抓取

    一.抓取远程图片到本地,你会用什么函数? 方法1:利用readfile读取远程图片到缓冲中,然后写入新的文件 function grabImage($url, $filename = '') { if ...

随机推荐

  1. js 获取某月第一天和最后一天

    1.获取某月第一天和最后一天日期 function getDateByMonth (timeStamp) { let inDate = new Date(timeStamp) let year = i ...

  2. 2.Redis info命令详解

    命令 127.0.0.1:6379> info [server|clients|memory|stats|...] # Server redis_version:5.0.4 #redis版本 r ...

  3. CentOS7安装Elasticsearch7

    下载地址:https://www.elastic.co/cn/downloads/elasticsearch 使用YUM安装 # 下载并安装公共签名密钥 rpm --import https://ar ...

  4. 3. Longest Substring Without Repeating Characters寻找不重复的最大子串

    首先弄清楚Substring和Subsequence,前者是子串,要求连续,后者是子序列,可以不连续 public int lengthOfLongestSubstring(String s) { / ...

  5. mysql数据库连接java

    1 1.创建配置文件jdbc.properties 2 3 jdbc.driver=com.mysql.jdbc.Driver 4 jdbc.url=jdbc:mysql://localhost:33 ...

  6. mysql-font1251错误

    控制台中先连接mysql: ALTER USER 'root'@'localhost' IDENTIFIED BY 'password' PASSWORD EXPIRE NEVER; ALTER US ...

  7. VScode中配置C++运行环境

    目录 VScode中配置C++运行环境 1. 哪些插件 2. 配置开始 3. 编写代码并运行 VScode中配置C++运行环境 关于安装mingw的教程,网络上已经有很多了,这里不再赘述,下面就看VS ...

  8. 论文阅读 Characterization of Multiple 3D LiDARs for Localization and Mapping using Normal Distributions Transform

    Abstract 在这个文章里, 我们细致的比较了10种不同的3D LiDAR传感器, 用了一般的 Normal Distributions Transform (NDT) 算法. 我们按以下几个任务 ...

  9. python之hashlib、suprocess模块

    一.hashlib模块 1.什么叫hash:hash是一种算法(3.x里代替了md5模块和sha模块,主要提供 SHA1, SHA224, SHA256, SHA384, SHA512 ,MD5 算法 ...

  10. Solon rpc 之 SocketD 协议 - RPC调用模式

    Solon rpc 之 SocketD 协议系列 Solon rpc 之 SocketD 协议 - 概述 Solon rpc 之 SocketD 协议 - 消息上报模式 Solon rpc 之 Soc ...