web网页和ios、android进行交互

这一篇我们来讲讲web网页和ios、android进行交互

一、原理

1. web调用ios和android

    1. 发送一个假请求，让原生开发去拦截,可以使用window.location.href 或者a标签发送请求
    2. 这个假请求的url需要和ios、android协商，保持一致
    3. 原生开发人员会去构建一个拦截请求类，如果是想要的url，就会被拦截，不会让它发送出去，截取到后面的字符串，
    4. ios中有自己的发布订阅中心，那截取到了字符串就根据字符串去发布对应的事件
    5. 比如说captureImage，原生开发人员就会在webview中去监听发布订阅中心对应的事件，事件中会去调用原生的功能
    6. webview就调用web中写好的方法 
   

2. ios、android调用web网页

    1. 先在网页上准备一个获得结果的回调函数(window上面去挂靠一个方法，比如说onCaptureImageCallback)
    2. 当原生需要传值给网页时，向打开网页的窗口动态插入js代码,这段js代码就是调用回调函数的代码
    3. 网页上接收到了结果，就去做对应的处理
   

代码示例：

<template>
<div id="home" class="page">
  <button @click="btnAction">拍照</button>
  <a href="yuzhenliu://openweixin">打开微信</a>
  <a href="yuzhenliu://scan">扫一扫</a>
  <button @click="btnAction">调用</button>
  <div>
    <h3>image:</h3>
    <p>{
   {
   image}}</p>
    <img :src="image" alt