首页 > 编程语言 >小程序官方文档梳理

小程序官方文档梳理

时间:2022-11-21 10:15:38浏览次数:70  
标签:Web 微信 JS 官方 文档 gtimg com 梳理 SDK

单词:
WeixinJSBridge(微信JS桥梁)
invoke(调用)
imagePreview(图片预览)
current(当前图片路径)
urls(所有图片url列表)
function(功能)
res(响应回来的结果)

概念:
使用 WeixinJSBridge 预览图片

使用:
WeixinJSBridge.invoke('imagePreview', {
current: 'http://inews.gtimg.com/newsapp_bt/0/1693121381/641',
urls: [ // 所有图片的 URL 列表,数组格式
'https://img1.gtimg.com/10/1048/104857/10485731_980x1200_0.jpg',
'https://img1.gtimg.com/10/1048/104857/10485726_980x1200_0.jpg',
'https://img1.gtimg.com/10/1048/104857/10485729_980x1200_0.jpg'
]
}, function(res) {
console.log(res.err_msg)
})

核心:
微信相关的 JS API

优点:
额外引入一个 JS 图片预览组件库,这种调用方式显得非常简洁和高效

历史:
2015年初,微信发布了一整套网页开发工具包,称之为 JS-SDK,开放了拍摄、录音、语音识别、二维码、地图、支付、分享、卡券等几十个API

结果:
给所有的 Web 开发者打开了一扇全新的窗户,让所有开发者都可以使用到微信的原生能力,去完成一些之前做不到或者难以做到的事情

使用 JS-SDK 调用图片预览组件:

JS-SDK概念:
一整套网页开发工具包,​JS-SDK是对之前的 WeixinJSBridge 的一个包装,以及新能力的释放,并且由对内开放转为了对所有开发者开放,在很短的时间内获得了极大的关注。从数据监控来看,绝大部分在微信内传播的移动网页都使用到了相关的接口

JS-SDK使用:
wx.previewImage({
current: 'https://img1.gtimg.com/10/1048/104857/10485726_980x1200_0.jpg',
urls: [ // 所有图片的 URL 列表,数组格式
'https://img1.gtimg.com/10/1048/104857/10485731_980x1200_0.jpg',
'https://img1.gtimg.com/10/1048/104857/10485726_980x1200_0.jpg',
'https://img1.gtimg.com/10/1048/104857/10485729_980x1200_0.jpg'
],
success: function(res) {
console.log(res)
}
})
核心:
JS-SDK 由对内开放转为了对所有开发者开放

优点:
​JS-SDK 解决了移动网页能力不足的问题,通过暴露微信的接口使得 Web 开发者能够拥有更多的能力,然而在更多的能力之外

缺点:
JS-SDK 的模式并没有解决使用移动网页遇到的体验不良的问题。用户在访问网页的时候,在浏览器开始显示之前都会有一个白屏的过程,在移动端,受限于设备性能和网络速度,白屏会更加明显。

解决:
帮助平台上的 Web 开发者解决这个问题。因此我们设计了一个 JS-SDK 的增强版本,其中有一个重要的功能,称之为“微信 Web 资源离线存储”。

微信 Web 资源离线存储概念和优点
Web 开发者可借助微信提供的资源存储能力,直接从微信本地加载 Web 资源而不需要再从服务端拉取,从而减少网页加载时间,为微信用户提供更优质的网页浏览体验,每个公众号下所有 Web App 累计最多可缓存 5M 的资源

标签:Web,微信,JS,官方,文档,gtimg,com,梳理,SDK
From: https://www.cnblogs.com/strundent/p/16910441.html

相关文章

  • 系分文档
    模版:需求分析需求分析的目的在于理解需求的本质,搞清楚为什么要做这个需求。需求建模业务建模就是把要实现的业务功能抽象成为模型。建立模型有很多种方法,常用......
  • Kubernetes_梳理出ServiceAccount服务账号一条线
    前言看图,如下:左下角的Pod需要访问k8s的资源,需要通过中间apiserver的认证、授权、准入控制三个东西,这就需要一个serviceAccount,帮助它完成这个过程,才能访问k8......
  • Oracle 官方下载数据库教程
    Oracle官方下载数据库教程首先打开官方的下载地址如下官方下载地址:​​http://www.oracle.com/technetwork/database/enterprise-edition/downloads/index.html​​然后......
  • C++面向对象程序设计概念梳理
    写在前面:本篇文档是为了《C++面向对象程序设计》课程所写,包含了本课程考试可能会考的所有概念。当然,因为目的只是为了通过考试,所以我将这些概念已经尽量精简。如果你将下......
  • uni-app官方demo新闻资讯笔记
    pages.json768及以上屏幕显示rightWindowmain.js App.mpType="app"没在官方找到对应说明条件编译#ifdef:ifdefined仅在某平台存在#ifndef:ifnotdefined除......
  • 高校校企合作平台设计与实现-计算机毕业设计源码+LW文档
    数据库脚本:/*NavicatMySQLDataTransferSourceServer:localhost_3306SourceServerVersion:50561SourceHost:localhost:3306SourceDat......
  • 游乐园智慧向导小程序设计与实现-计算机毕业设计源码+LW文档
                           小程序开发说明开发语言:Java框架:ssmJDK版本:JDK1.8服务器:tomcat7数据库:mysql5.7(一定要5.7版本)数据库工具:Navicat11开发软......
  • 牧场系统设计与实现-计算机毕业设计源码+LW文档
    关键代码packagecom.example.controller;importcn.hutool.core.collection.CollUtil;importcn.hutool.core.collection.CollectionUtil;importcn.hutool.core.io.IoUtil......
  • 养老服务系统设计与实现-计算机毕业设计源码+LW文档
    基于SSM的养老服务系统设计与实现摘 要本养老服务系统就是建立在充分利用现在完善科技技术这个理念基础之上,并使用IT技术进行对养老服务的管理,从而保证系统得到充分利用......
  • 跟着文档学Fabric:获取通道配置
    原文在这里。1.获取通道配置peerchannelfetchconfigconfig_block.pb-o$ORDERER_CONTAINER-c$CH_NAME--tls--cafile$TLS_ROOT_CA上述命令需要在peer容器中......