崽崽app内H5活动注意事项 - 《文档》

1.window.ZEPETO 全局属性：
一. 获取用户的崽崽Id
let ownerId = window.ZEPETO ? ZEPETO.userInfo.hashCode : ‘’ ;
二. 站内外的判断：
let isInApp = window.ZEPETO ? true : false;
注释：获取window.ZEPETO有延迟，在ios中比较明显，有偶现获取不到的bug，当前比较稳妥的解决办法，就是延迟获取window.ZEPETO

2.图片保存：
一. ios中base64图片直接长按可以保存。
二.android中base64图片不能长按保存，但可以通过上传到oss上，通过oss链接图片，实现长按保存。
3.在崽崽app中打开h5调试页面：
一. ZEPETO://HOME/WEBVIEW?url= h5链接
例（ZEPETO://HOME/WEBVIEW?url=http://10.35.33.88:8081）
4.关闭崽崽中h5页面：
关闭图标
————————————————————————————————————————————————————
2019.8.9
崽崽[可多人][可不同pose]渲染成背景透明的图片/模板，App支持版本2.9.2+。
jsBridge的demo地址：https://github.com/SunnyEternal/Zepeto_jsBridge
————————————————————————————————————————————————————
2019.10.24
zepeto全屏webview改成卡片式后，多次连续退出H5在进入H5，会出现页面根字体字号小于10px，导致页面缩放到很小。
原因是获取的设备宽度时webview还没有完全和设备宽度一致，需要循环取设备宽度，然后计算根字体大小赋值给根字体。

beforeMount() {
    let fontTimer = setInterval(() => {
      let rootFontSize = (document.documentElement.clientWidth ||  document.body.clientWidth) / 750 * 100;
      if (rootFontSize > 32) { // 我设置默认根字体是32
        document.getElementsByTagName('html')[0].style.fontSize = rootFontSize + 'px';
        document.getElementsByTagName('body')[0].style.width = (document.documentElement.clientWidth ||  document.body.clientWidth) + 'px';
        clearInterval(fontTimer)
      }
    }, 60)
    setTimeout(() => {
      clearInterval(fontTimer)
    }, 3000);
    window.addEventListener("resize",()=>{
      document.getElementsByTagName('html')[0].style.fontSize = (document.documentElement.clientWidth ||  document.body.clientWidth) /10 + 'px';
    });
  },

    <br />-----------------------------------------------------------------------------------------------------2019.10.24<br />zepeto图片渲染（透明背景的崽崽形象图片，应用于【崽崽时装PK】【一键大片】，现替代了上文的jsBridge）<br />1.实现原理：post请求：<br />  [https://openapi.zepeto](https://openapi.zepeto.io/graphics/booth/<PHOTOBOOTH_NAME>?targets=<HASHCODES>&service=zaizai&width=<WIDTH>&cdn=<OPTION>&cache=<OPTION>).cn[/graphics/booth/<PHOTOBOOTH_NAME>?targets=<HASHCODES>&service=zaizai&width=<WIDTH>&cdn=<OPTION>&cache=<OPTION>](https://openapi.zepeto.io/graphics/booth/<PHOTOBOOTH_NAME>?targets=<HASHCODES>&service=zaizai&width=<WIDTH>&cdn=<OPTION>&cache=<OPTION>) <br />注释： <br />  <PHOTOBOOTH_NAME>   poseId<br />  <HASHCODES>  崽崽id  <br />  <WIDTH>  渲染图的宽度 <br />  OPTION  true 或 false<br />例如：[https://openapi.zepeto.cn/graphics/booth/PHOTOBOOTH_TWO_339?targets=EG3LTJ,EG3LTJ&service=zaizai&width=300&cdn=off&cache=off](https://openapi.zepeto.io/graphics/booth/PHOTOBOOTH_TWO_339?targets=EG3LTJ,EG3LTJ&service=zaizai&width=300&cdn=off&cache=off)<br />代码如下：

import request from '@/utils/request'
return request({
  url:`https://openapi.zepeto.cn/graphics/booth/${data.renderData}?targets=${data.hashCode}&service=zaizai&width=420&cdn=off&cache=off`,
  method: 'post'
})

跳转个人主页：

window.location.href = `ZEPETO://HOME/PROFILE/CARD?${zzId}`;

去换衣服/试衣间，实际是去商店，对应deeplink：

window.location.href = `ZEPETO://HOME/SHOP/COSTUME?referrer=${referrerUri}`; // 去商店

保存图片到相册：

function saveImage(callback) {
let base64 = document.getElementById(`photo`).src; // 获取图片base64字符串
let newBase64 = base64.substring(base64.indexOf(',')+1); // 去掉开头"data:image/png;base64,"
if (window.ZEPETO) {
 window.ZEPETO.invoke('SaveImage', newBase64, callback); // callback可以是保存成功的提示
}
}

上传feed，先将base64格式的图片保存到手机系统相册，再使用deeplink拉起上传feed的页面。deeplink：
```
window.location.href = 'ZEPETO://HOME/FEED/UPLOAD/CAMERAROLL'
```

说明：上面的3，4，5项 在崽崽【一键大片】中使用过