调试微信html5页面

调试微信html5页面相关知识

• 微信本地调试

  一、网页授权域名先打开微信公众后台，找到网页授权域名，目前可以设置 2 个网页授权域名，原来只能设置一个的时候测试更麻烦。这 2 个授权域名可以设置成一个线上，一个测试的，这样我们就可以在本地代理测试环境的域名来实现微信本地调试啦。比如现在设置的测试域名是：test.jojo.cn二、修改本地 host1、mac 下载 iHosts 软件直接在 APPStore 上搜索就有2、配置本地 host将本地的 ip 映射到上面在微信公众号后台配置好的授权域名：test.jojo.cn三、修改接口域名1、本地环境可以临时用测试环境域名或直接是线上域名，但测试环境域名不能是 test.jojo..cn，因为被穿透到了本地。2、测试和线上环境用绝对路径即可，不需要写死域名，这样无论在测试还是线上，都不需要手动修改域名了。四、访问1、起服务用 80 端口 start 本地服务，我用的 webpack，所以命令如下：npm run start --port=80比如本地地址是：http://localhost/wxtest
• 浅析微信支付：微信公众号网页授权

  1、开发前的准备首先，如果没有看过本系列 浅析微信支付：开发前的准备 的朋友需要看一下这篇文章，链接在上方；本文需要用到开发前准备中的几个知识点：设置安全、设置白名单、得到公众号一系列信息（appid\apiKey等）；如果需要在本地开发测试，还需要下载 微信开发者工具和 微信公众平台接口测试帐号 。下面我们开始进入开发阶段。2、设置测试号相关信息因为项目在开发阶段的时候，需要本地调试，所以需要使用测试号来验证代码是否正确，所以下面会讲如何设置测试号相关配置；首先我们进入 微信公众平台接口测试帐号申请 页面，点击登录即可使用微信账号登录（一个微信号只有一个测试号）。登录后可以进入测试号管理界面，如下：按要求设置上方图片中的配置，即可减少80%的问题，如果调用时还有其他问题，请到文末添加作为微信，可进入讨论群和大家一起交流。3、获取微信网页授权使用以下代码获取微信网页授权：微信官方js文件：<script src="http://res.wx.qq.com/open/js/jweix
• html5仿微博web、微信网页版聊天系统实战开发

  h5仿微信网页端|仿微博web聊天界面|web端聊天室|桌面端聊天系统html5聊天系统场景应用还是蛮多的，如 在线客服沟通系统、淘宝网页端旺旺等，之前就有开发过h5移动端聊天室，如是就忍不住开发了个仿新浪微博web版聊天项目，功能效果还是蛮不错哒。使用了html5+css3+jQuery+swiper+wcPop等技术进行开发架构，实现了消息、表情发送，发送图片，还有上传附件及自定义推送内容，另外也加入了个人名片、上传附件、分享等样式，功能上实现了消息、表情的发送，图片、视频全屏预览。// 2、设置聊天$("body").on("click", ".J__setChat", function(e){    var that = $(this), contextTpl, menuNode = $("<div class='wc__contextmenu animated anim-fadeIn'&
• H5页面测试总结

  前言在最近几个项目中，小编接触了较多关于H5页面的测试，H5页面的测试除了业务逻辑功能测试外，其他部分的测试方法基本是可以通用的，在此对H5页面的一些通用测试方法进行总结分享给大家。H5页面介绍1. H5页面H5即 HTML5，是最新的 Web 端开发语言版本，大多数手机 APP 页面会用 H5 实现，包括 PC Web 站点也会用它开发实现。所以 Web 的通用测试点和方法基本都可以适用于它。H5其实就是：移动端Web页面。H5应用在很多地方，如APP的活动专题页面、新闻页面、微信公众号文章页面等都属于H5页面，在PC或者手机浏览器都可以直接访问H5页面。H5作为移动端的web页面，有它自身的优势，如它可以跨平台使用，开发成本相对较低；可随时上线就更新版本，适合快速迭代；可以轻量的触达用户，提供更便捷的服务。因此在项目中，对于上线后迭代更新较快的页面，通常利用H5页面来实现。2. 技术实现从广义上来讲，HTML5是包括HTML、CSS和JavaScript在内的一套技术组合。HTML：

调试微信html5页面相关课程

• Spring Boot打造企业微信点餐系统， 微服务时代必学 课程还原企业真实系统重构场景：微信点餐系统，带你体验敏捷式开发，尽可能低成本迭代升级，以最小的代价完成旧系统的升级改造。系统前后端分离的架构，让你更具备互联网工程师的气质，带你一步步设计并开发一个企业级Java应用。

  讲师：廖师兄 中级 6321人正在学习

• 0到1快速掌握Java全栈开发，玩转微信生态 程序员想快速发展提升，除了编程技术精进，还有一大方向——深入业务，抓住好的赛道机会。当下各行业对于私域营销的迫切度与认可度居高不下，SCRM系统也受追捧。本课程带你自主开发一个打通个人微信、企业微信、公众号、小程序的SCRM系统，增强营销业务认知，提升商业场景技术落地实力。

  讲师：祁聪 初级 131人正在学习

• 微信小程序电商实战 从前端到后端的全流程精讲 通过开发一个已上线的小程序商城全栈应用，学会如何打造iOS，Android，Web多端适配的服务端标准API，掌握三端分离开发方式，理解现代Web的基本架构思想

  讲师：7七月 中级 4578人正在学习

调试微信html5页面相关教程

• 3.1 打包为微信小程序 注册微信小程序账号，获取到 AppID，我们后面配置的时候会用到。在 HBuilderX 工具栏，点击发行，选择小程序-微信。输入小程序名称和 AppID，单击发行就可以了。这样我们就会获得一个微信小程序的打包文件，接下来我们来发布微信小程序项目，打开微信小程序开发者工具，导入刚刚生成的微信小程序项目的打包文件，在微信小程序开发者工具中先测试一下，项目运行是否正常，项目测试没有问题后，点击右上角>>按钮，上传代码就可以发布微信小程序了，最后等待微信团队审核通过，别人就可以在线上访问到你的项目了。
• 2.1 调试 调试选项提供了配置设备端调试以及在设备与开发计算机之间建立通信的方式。我们可以启用 USB 调试，以便 Android 设备可以通过 Android 调试桥 (adb) 与开发机器通信。等待调试程序选项仅在我们使用选择调试应用选择要调试的应用后才可用。如果我们启用等待调试程序，选定的应用会先等待调试程序连接后才会执行操作。其他调试选项包括：在设备上永久存储日志记录器数据：选择要在设备上永久存储的日志消息类型。选项包括“关闭”、“全部”、“所有非无线电”和“仅限内核”。选择模拟位置信息应用：使用此选项可以模拟设备的 GPS 位置，以测试我们的应用在其他位置时行为是否相同。要使用此选项，请下载并安装 GPS 模拟位置应用。启用视图属性检查功能：将视图属性信息保存在 View 实例的 mAttributes 成员变量中，以便将这些信息用于调试。我们可以通过 Layout Inspector 界面访问属性信息（如果不启用此选项，“属性”项将不可用）。启用 GPU 调试层：在运行 Android 9（API 级别 28）及更高版本的设备上可用，启用此选项可允许从本地设备存储加载 Vulkan 验证层。
• 3.1 微信小程序 API uni-app 的 API 与微信小程序 API 基本一致。掌握微信小程序 API 对后面的开发很有帮助。微信小程序 API 文档:https://developers.weixin.qq.com/miniprogram/dev/api/
• 3.2 页面生命周期 函数名说明支持平台 onLoad 页面加载时触发，一个页面只会调用一次。可以传递参数，参数说明查看示例 3.2.1 所有 onShow 页面显示时触发，每次打开页面都会调用一次所有 onReady 页面初次渲染完成后触发，一个页面只会调用一次所有 onHide 页面隐藏时触发，每次隐藏页面都会被触发所有 onUnload 页面卸载时触发所有 onResize 页面每次窗口尺寸变化时会被触发，App、微信小程序 onPullDownRefresh 用户下拉页面时触发，一般用于页面下拉刷新，查看实例 3.2.2 所有 onReachBottom 页面上拉滚动触底时触发所有 onTabItemTap 点击底部 tab 栏时触发，参数为 Object，参数说明查看实例 3.2.3 微信小程序、百度小程序、H5、ApponShareAppMessage 点击右上角分享时触发微信小程序、百度小程序、字节跳动小程序、支付宝小程序 onPageScroll 页面滚动时触发，只监听页面垂直滚动所有 onNavigationBarButtonTap 监听原生标题栏按钮点击事件，参数说明查看实例 3.2.4App、H5onBackPress 页面返回时触发，查看实例 3.2.5App、H5onNavigationBarSearchInputChanged 监听原生标题栏搜索输入框输入内容变化事件 App、H5onNavigationBarSearchInputConfirmed 监听原生标题栏搜索输入框搜索事件 App、H5onNavigationBarSearchInputClicked 监听原生标题栏搜索输入框点击事件 App、H53.2.1 onLoad 参数说明页面生命周期函数 onLoad，是页面最先执行的生命周期函数，如果从上个页面跳转到本页面，可以通过参数 option 传递上个页面的数据。我们来看一下实例，比如要从首页（index.vue）跳转到个人中心页面（me.vue）。实例：//index.vue//跳转语句，并在跳转链接上面加上要传递的数据uni.reLaunch({ url: 'test?name=我是首页的数据'});//me.vueexport default { //options参数就是上个页面传递过来的数据 onLoad: function (options) { console.log(options.name); }}//打印出来的结果我是首页的数据3.2.2 onPullDownRefresh 函数用于监听该页面用户下拉页面的动作。普通页面下拉不会触发 onPullDownRefresh 函数，要先在 pages.json 里面，找到当前页面的 pages 节点，并在 style 选项中将 enablePullDownRefresh 设置为 true，下拉页面才可以触发 onPullDownRefresh 函数。下面来看一下实例，比如我们想开启首页（index.vue）的下拉动作。实例：//pages.json{ "path": "pages/index/index.vue", "style": { "enablePullDownRefresh": true }}调用完成 onPullDownRefresh 函数后，用 stopPullDownRefresh 函数可以停止当前页面的下拉状态。实例：export default{ onPullDownRefresh(){ console.log('用户下拉页面时触发') uni.stopPullDownRefresh() }}3.2.3 onTabItemTap 参数说明属性类型说明 indexString 被点击 tabItem 的序号，从 0 开始 pagePathString 被点击 tabItem 的页面路径 textString 被点击 tabItem 的按钮文字实例：export default { onTabItemTap(options) { console.log('被点击tabItem的序号index:' + options.index) console.log('被点击tabItem的页面路径pagePath:' + options.pagePath) console.log('被点击tabItem的按钮文字text:' + options.text) }}注意以下几点：onTabItemTap 常用于点击当前 tabitem，滚动或刷新当前页面。如果是点击不同的 tabitem，一定会触发页面切换。如果想在 App 端实现点击某个 tabitem 不跳转页面，不能使用 onTabItemTap，可以使用 plus.nativeObj.view 放一个区块盖住原先的 tabitem，并拦截点击事件。在 App 端，从 HBuilderX 1.9 的自定义组件编译模式才开始支持 onTabItemTap。3.2.4 onNavigationBarButtonTap 参数说明属性类型说明 indexNumber 原生标题栏按钮数组的下标实例：export default { onNavigationBarButtonTap(options) { console.log('index:' + options.index) }}3.2.5 onBackPress 参数说明返回结果的格式是这样的：event = {from:backbutton、 navigateBack}。其中 backbutton 表示来源是左上角返回按钮或 android 返回键；navigateBack 表示来源是 uni.navigateBack。属性类型说明 fromString 触发返回行为的来源：‘backbutton’—— 左上角导航栏按钮及安卓返回键；‘navigateBack’——uni.navigateBack () 方法实例：export default { onBackPress(options) { console.log('from:' + options.from) }}
• HTML5 地理位置 地理定位功能是 HTML5 新增的标准，早期的 HTML 和 JavaScript 没有操控硬件和文件的权限，因为页面交互效果比较简单；但是 HTML5 之后网页已经逐渐应用于各种复杂场景包括移动设备，所以增加了各种与硬件交互的 API 接口，地理位置就是其中之一。
• 2.1 list说明 list是一个数组列表，里面存放着我们需要调试的页面对象，我们将想要调试的页面都放在 list 数组列表中。想要调试哪个页面，就将这个页面对象所对应的的 list 索引写在 current 属性的后面、这样我们调试的时候，就会将这个页面作为项目的启动页面了。比如 "current": 1，current 属性后面跟着 1，也就是 list 数组列表中索引为 1 的页面对象，我们调试的时候，list 数组中的第 2 个页面对象就会作为项目的初始启动页面。Tips：我们一般直接在 App 里真机调试运行，这样可以直接打开配置的页面，如果在微信开发者工具中调试需要手动改变编译模式。

调试微信html5页面相关搜索

daima damain dart dataset datasource datediff datediff函数 datepicker datetime db4o dbi dcloud deallocate debian安装 debugger debugging declaration declarations declare decode函数

查看更多慕课网实用课程