~~~
(function (window, undefined) {
// 调用 schema 的封装
function _invoke(action, data, callback) {
// 拼装 schema 协议
var schema = 'myapp://utils/' + action;
// 拼接参数
schema += '?a=a';
var key;
for (key in data) {
if (data.hasOwnProperty(key)) {
schema += '&' + key + data[key]
}
}
// 处理 callback
var callbackName = '';
if (typeof callback === 'string') {
callbackName = callback
} else {
callbackName = action + Date.now();
window[callbackName] = callback
}
schema += 'callback=callbackName';
// 触发
var iframe = document.createElement('iframe');
iframe.style.display = 'none';
iframe.src = schema ; // 重要！
var body = document.body;
body.appendChild(iframe);
setTimeout(function () {
body.removeChild(iframe);
iframe = null
})
}
// 暴露到全局变量
window.invoke = {
share: function (data, callback) {
_invoke('share', data, callback)
},
scan: function (data, callback) {
_invoke('scan', data, callback)
},
login: function (data, callback) {
_invoke('login', data, callback)
}
}
})(window);
~~~
~~~
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
<title>Document</title>
</head>
<body>
<button id="btn1">扫一扫</button>
<button id="btn2">分享</button>
<script type="text/javascript" src="./invoke.js"></script>
<script type="text/javascript">
// function invokeScan() {
// window['_invoke_scan_callback_'] = function (result) {
// alert(result)
// }
// var iframe = document.createElement('iframe')
// iframe.style.display = 'none'
// // iframe.src = 'weixin://dl/scan' // 重要！
// iframe.src = 'weixin://dl/scan?k1=v1&k2=v2&k3=v3&callback=_invoke_scan_callback_'
// var body = document.body
// body.appendChild(iframe)
// setTimeout(function () {
// body.removeChild(iframe)
// iframe = null
// })
// }
document.getElementById('btn1').addEventListener('click', function () {
// invokeScan()
window.invoke.scan({}, function () {})
})
document.getElementById('btn2').addEventListener('click', function () {
window.invoke.share({
title: 'xxx',
content: 'yyy'
}, function (result) {
if (result.errno === 0) {
alert('分享成功')
} else {
alert(result.message)
}
})
})
</script>
</body>
</html>
~~~
- 空白目录
- 第1章 课程介绍
- 1-2 架构
- 第2章 ES6 语法
- 2-1 开始
- 2-2 模块化 - 语法
- 2-3 模块化 - babel-new-part1
- 2-4 模块化 - babel-new-part2
- 2-5 模块化 - webpack
- 2-6 模块化 - rollup介绍
- 2-7 模块化 - rollup安装
- 2-8 模块化 - 总结
- 2-9 class - JS构造函数
- 2-10 class - 基本语法
- 2-11 class - 继承
- 2-12 class - 总结
- 2-13 promise-callback-hell
- 2-14 promise - 语法
- 2-15 promise - 总结
- 2-16 常用功能演示
- 2-17 常用功能 - 代码演示
- 2-18 常用功能 - 总结
- 第3章 原型
- 第4章 异步
- 4-1 开始
- 4-2 单线程 - 介绍-1
- 4-3 单线程 - 介绍-2
- 4-4 单线程 - 异步-1
- 4-5 单线程 - 异步-2
- 4-6 单线程 - 总结
- 4-7 event-loop - 演示
- 4-8 event-loop - 代码演示
- 4-9 event-loop - 总结
- 4-10 jquery-deferred - 介绍
- 4-11 jquery-deferred -
- 4-12 jquery-deferred - 应用-1
- 4-13 jquery-deferred - 应用-2
- 4-14 jquery-deferred - 应用3
- 4-15 jquery-deferred - 应用4
- 4-16 jquery-deferred - 总结
- 4-17 promise - 语法回顾
- 4-18 promise - 捕获异常-1
- 4-19 promise - 捕获异常-2
- 4-20 promise - 串联
- 4-21 promise-all-race
- 4-22 promise - 标准总结
- 4-23 promise - 总结
- 4-24 async-await-1
- 4-25 async-await-2
- 4-26 async-await - 总结
- 4-27 总结
- 第5章 虚拟 DOM
- 第6章 MVVM 和 vue
- 第7章 组件化和 React
- 第8章 hybrid
- 8-1 开始
- 8-2 hybrid是什么 - 开始
- 8-3 hybrid是什么 - webview
- 8-4 hybrid是什么 - file协议
- 8-5 hybrid是什么 - 具体实现和总结
- 8-6 hybrid更新流程
- 8-7 hybrid 和 h5 的比较
- 8-8 JS和客户端通讯 - 开始
- 8-9 JS和客户端通讯 - schema协议-1
- 8-10 JS和客户端通讯 - schema协议-2
- 8-11 JS和客户端通讯 - schema封装-1
- 8-12 JS和客户端通讯 - schema封装-2
- 8-13 JS和客户端通讯 - 总结
- 8-14 总结
- 第9章 课程总结