• 本资源是本人常用的微信web开发工具,属于稳定版本。最新版操作不流畅,有bug,需要最新版的百度下载。
  • 有时候微信官网会下载不了开发者工具, 可以在这边下载
  • 微信小程序强制更新

    2019-09-27 11:44:24
    如图,当小程序发布新的版本后,用户如果之前访问过该小程序,通过已打开的小程序进入(未手动删除),则会弹出这个提示,提醒用户更新新的版本。用户点击确定就可以自动重启更新,点击取消则关闭弹窗,不再更新。 ...

    如图,当小程序发布新的版本后,用户如果之前访问过该小程序,通过已打开的小程序进入(未手动删除),则会弹出这个提示,提醒用户更新新的版本。用户点击确定就可以自动重启更新,点击取消则关闭弹窗,不再更新。

     

    官方给的示例代码:

    const updateManager = wx.getUpdateManager()
    
    updateManager.onCheckForUpdate(function (res) {
      // 请求完新版本信息的回调
      console.log(res.hasUpdate)
    })
    
    updateManager.onUpdateReady(function () {
      wx.showModal({
        title: '更新提示',
        content: '新版本已经准备好,是否重启应用?',
        success(res) {
          if (res.confirm) {
            // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
            updateManager.applyUpdate()
          }
        }
      })
    })
    
    updateManager.onUpdateFailed(function () {
      // 新版本下载失败
    })

     

    官方提供的demo中,只有最基本的更新提示,并未做异常处理。而且官方也说了这个功能基础库 1.9.90 开始支持,低版本需做兼容处理,那么就需要对着端代码进行改进了。

    另一方面,如果当前版本更新有重大调整,一定需要用户更新,那么可以在用户点击取消的回调中给出提示,并重新进入版本提示流程。如下图,在上边的更新提示中,用户点击取消,则弹出下面提示弹窗,用户点击确定,则更新版本,点击取消,则重新调用上边的更新提示。总之,用户只有更新了,才能正常访问小程序(如非必须,建议慎用)。

     

    改善后的代码:

    //app.js
    
    App({
      onLaunch: function(options) {
        this.autoUpdate()
      },
      autoUpdate:function(){
        console.log(new Date())
        var self=this
        // 获取小程序更新机制兼容
        if (wx.canIUse('getUpdateManager')) {
          const updateManager = wx.getUpdateManager()
          //1. 检查小程序是否有新版本发布
          updateManager.onCheckForUpdate(function (res) {
            // 请求完新版本信息的回调
            if (res.hasUpdate) {
              //2. 小程序有新版本,则静默下载新版本,做好更新准备
              updateManager.onUpdateReady(function () {
                console.log(new Date())
                wx.showModal({
                  title: '更新提示',
                  content: '新版本已经准备好,是否重启应用?',
                  success: function (res) {
                    if (res.confirm) {
                      //3. 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
                      updateManager.applyUpdate()
                    } else if (res.cancel) {
                      //如果需要强制更新,则给出二次弹窗,如果不需要,则这里的代码都可以删掉了
                      wx.showModal({
                        title: '温馨提示~',
                        content: '本次版本更新涉及到新的功能添加,旧版本无法正常访问的哦~',
                        success: function (res) {     
                          self.autoUpdate()
                          return;                 
                          //第二次提示后,强制更新                      
                          if (res.confirm) {
                            // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
                            updateManager.applyUpdate()
                          } else if (res.cancel) {
                            //重新回到版本更新提示
                            self.autoUpdate()
                          }
                        }
                      })
                    }
                  }
                })
              })
              updateManager.onUpdateFailed(function () {
                // 新的版本下载失败
                wx.showModal({
                  title: '已经有新版本了哟~',
                  content: '新版本已经上线啦~,请您删除当前小程序,重新搜索打开哟~',
                })
              })
            }
          })
        } else {
          // 如果希望用户在最新版本的客户端上体验您的小程序,可以这样子提示
          wx.showModal({
            title: '提示',
            content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。'
          })
        }
      }
    })

     

    更新版本的模拟测试:

    1. 微信开发者工具上可以通过「编译模式」下的「下次编译模拟更新」开关来调试;

    2. 小程序开发版/体验版没有「版本」概念,所以无法在开发版/体验版上测试更版本更新情况;

    对于开发者工具,可以这样验证测试:

    点击编译模式设置下拉列表,然后点击“添加编译模式”,在自定义编译条件弹窗界面,点击下次编译时模拟更新,然后点击确定,重新编译就OK了。

    需要注意的是,这种方式模拟更新一次之后就失效了,后边再测试仍需要对这种编译模式进行重新设置才可以。

    更新提示有延迟?

    在开发者工具上测试验证的时候,更新提示弹窗在小程序界面加载出来五六秒之后才弹出来,这是由于小程序在检测到有新版本之后,调用 UpdateManager.onUpdateReady(function callback) 进行版本更新监听,此时客户端主动触发下载(无需开发者触发),下载成功后回调。也就是说我们上边的更新提示弹窗是在小程序检测到新版本并完成新版本下载之后弹出的,所以就有了这几秒的时间差。这样的话就很有必要进行再次改善了,至少应该在小程序编译时检测到有新版本就应该先给出更新提示,至于新版本下载的准备工作,可以在用户点击确认按钮之后进行,代码改造如下:

    App({
      onLaunch: function(options) {
        this.autoUpdate()
      },
      autoUpdate: function() {
        var self = this
        // 获取小程序更新机制兼容
        if (wx.canIUse('getUpdateManager')) {
          const updateManager = wx.getUpdateManager()
          //1. 检查小程序是否有新版本发布
          updateManager.onCheckForUpdate(function(res) {
            // 请求完新版本信息的回调
            if (res.hasUpdate) {
              //检测到新版本,需要更新,给出提示
              wx.showModal({
                title: '更新提示',
                content: '检测到新版本,是否下载新版本并重启小程序?',
                success: function(res) {
                  if (res.confirm) {
                    //2. 用户确定下载更新小程序,小程序下载及更新静默进行
                    self.downLoadAndUpdate(updateManager)
                  } else if (res.cancel) {
                    //用户点击取消按钮的处理,如果需要强制更新,则给出二次弹窗,如果不需要,则这里的代码都可以删掉了
                    wx.showModal({
                      title: '温馨提示~',
                      content: '本次版本更新涉及到新的功能添加,旧版本无法正常访问的哦~',
                      showCancel:false,//隐藏取消按钮
                      confirmText:"确定更新",//只保留确定更新按钮
                      success: function(res) {
                        if (res.confirm) {
                          //下载新版本,并重新应用
                          self.downLoadAndUpdate(updateManager)
                        }
                      }
                    })
                  }
                }
              })
            }
          })
        } else {
          // 如果希望用户在最新版本的客户端上体验您的小程序,可以这样子提示
          wx.showModal({
            title: '提示',
            content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。'
          })
        }
      },
      /**
       * 下载小程序新版本并重启应用
       */
      downLoadAndUpdate: function (updateManager){
        var self=this
        wx.showLoading();
        //静默下载更新小程序新版本
        updateManager.onUpdateReady(function () {
          wx.hideLoading()
          //新的版本已经下载好,调用 applyUpdate 应用新版本并重启
          updateManager.applyUpdate()
        })
        updateManager.onUpdateFailed(function () {
          // 新的版本下载失败
          wx.showModal({
            title: '已经有新版本了哟~',
            content: '新版本已经上线啦~,请您删除当前小程序,重新搜索打开哟~',
          })
        })
      }
    })

     

    如上,在检测到小程序有新版本之后,就给出弹窗提示用户下载新版并重启小程序,用户点击确定按钮后进行小程序新版本的下载和更新。也为了调用方便,将新版本下载及小程序的重启应用单独封装起来。

    这样,从小程序加载到弹出版本更新弹窗只需要耗费调用新版本检测API并返回结果的时间(开发者工具测试有2~3秒),虽说还是有一点延迟,但目前也只能这样了。

    总结:

    综上,无论如何,使用小程序版本更新检测功能都是需要一定时间的(一两秒的时间已经不算短了哈),如果在检测这一两秒中内用户进行了操作,那么更新提示弹窗则会打断用户的操作。但毕竟不是频繁更新版本,所以这方面还是可以接受的。

    另外,下载新的版本包的时候建议loading,这样用户就知道是在下载,然后下载完成自动重启,这样整个流程就顺畅多了。

    梳理了下,整了份思维导图,可以辅助理解:

    其他注意事项:

    基础库最低版本设置:

    如果不想做API支持判断,那么可以给小程序设置最低版本支持。

    打开小程序管理后台-设置-基础库最低版本设置,根据现有小程序的访问情况或者小程序官方提供的数据,设置一个比较大众化的基础库版本就好了,这样就能进了尽量减少API兼容性判断,也能促使用户更新微信版本,以支持小程序正常运行,体验小程序一些高级功能。

     

     

    展开全文
  • 微信小程序开发工具1.02版,新版开发工具不能监听用户分享后的回调函数,但是用户手机上和旧版本的开发工具上还是能正常使用,可以通过回调函数判断是否分享成功
  • 在linux下开发微信小程序,发现用虚拟机执行widnows然后运行微信开发者工具太难用了,每次改完js文件,需要先关闭掉开发者工具中的项目再重新打开并编译,才能正常编译,一次编译就要近1分钟,太痛苦了,网上有许多...

    在linux下开发微信小程序,发现用虚拟机执行widnows然后运行微信开发者工具太难用了,每次改完js文件,需要先关闭掉开发者工具中的项目再重新打开并编译,才能正常编译,一次编译就要近1分钟,太痛苦了,网上有许多linux下安装此工具的文章,

    但是发现下载wechat_web_devtools及nwjs-sdk太难了,老是下载失败,此次终于安装成功,做个总结。

    1.  安装wine,

        1)  如果是ubuntu则执行sudo apt-get install wine    如果是opensuse则执行sudo zypper install wine

        2)执行winecfg  

    (若无wine后面运行开发者工具时可能会提示Error: .config/wechat_web_devtools/WeappVendor/wcc.exe 无法执行的二进制文件)

    2. 下载wechat_web_devtools

    一种方法是git clone git@github.com:cytle/wechat_web_devtools.git

    如果没有安装git或者git clone下载老是超时下载失败,则点击进入https://github.com/cytle/wechat_web_devtools,然后点击网页右上角的“clone or download” 然后选择Download Zip,就会下载其zip包,zip包相对于源码要小一些,下载就会更容易成功。

    3.安装

        1)下载完,如果是zip包解压,然后进入wechat_web_devtools的目录,执行./bin/wxdt install

    这个命令会自动下载nwjs-sdk的而且用的是国内的源,比直接下载官网的nwjs-sdk要快许多,网上的文章许多都说要手动下载nwjs-sdk太坑了,此包下载太容易超时失败了,其实是不用手动去下载的。

        2)执行chmod -R 777 ~/.config/wechat_web_devtools/ 

    然后执行./bin/wxdt 就会启动微信开发者工具。成功。。。。

    作者:帅得不敢出门

    展开全文
  • 今天新弄了个企业微信,在使用微信开发者工具调试的时候,遇到了如下的问题: 在网上找了下教程,发现全都是旧版本的解决方法不适用。这里介绍下新的企业微信的解决方案:1.首先,你必须是这个企业微信的管理员。这...

    今天新弄了个企业微信,在使用微信开发者工具调试的时候,遇到了如下的问题:

        

    在网上找了下教程,发现全都是旧版本的解决方法不适用。这里介绍下新的企业微信的解决方案:

    1.首先,你必须是这个企业微信的管理员。这个可以在企业微信中的权限设置中设置。很好找,不再赘述。

    2.要在企业微信中勾上【开发者工具】选项,这个东西真的是找得我怀疑人生。这里贴上选项位置的两张图,防止大家在这种简单步骤上浪费时间。文字描述:在导航栏中选择【连接微信】 ->【微工作台】->最下面的【开发者工具】



    展开全文
  • 微信开发者工具总是弹出不信任的这个弹窗,一开始直接无法进入到编辑页面, 网上各种百度尝试,最后勉强解决: 然后关闭电脑的防火墙,最后重启电脑; 虽然后来也弹出来信任窗口吧,但是没那么频繁了,凑合用吧...

    微信开发者工具总是弹出不信任的这个弹窗,一开始直接无法进入到编辑页面,

    网上各种百度尝试,最后勉强解决:

     然后关闭电脑的防火墙,最后重启电脑;

    虽然后来也弹出来信任窗口吧,但是没那么频繁了,凑合用吧

     

     

    终极解决方式:上面的弹出还是太多了。。。

    下载:http://xiazai.sogou.com/detail/34/9/7883989824595990767.html?e=1970

    我还关闭了电脑的防火墙,我也没有杀毒软件什么的;

    安装之后,点击“工具---选项---链接”,如下图:

    点击确定,然后,在微信开发者工具里面,坚持到点击“设置”,选择手动设置代理:

    填写如上面,最后重新运行微信开发者工具,就没有任何问题了。

     

     

    展开全文
  • 3、开发者工具-版本管理 4、设置连接信息(有多种连接) 方法一、小程序账号就是对应的tgit账号 一、设置远程连接(设置-远程) 注:名称随便填,url去tgit直接复制(连接有两种格式一种http一种ss...

    最近在做微信小程序的时候用到了小程序的tgit,在网上找了一圈也没有一个完整的教程,所以在这写个完整的教程。
    1、开通tgit(设置-开发者工具-tgit)
    2、设置成员账号


    3、开发者工具-版本管理


    4、设置连接信息(有多种连接)
    方法一、小程序账号就是对应的tgit账号
    一、设置远程连接(设置-远程)
    注:名称随便填,url去tgit直接复制(连接有两种格式一种http一种ssh,我这边使用http)


    二、设置网络认证(设置-网络和认证)
    注:
    网络代理设置:选择使用微信开发者工具设定的代理(本地未安装git,如果本地有git软件可以使用自动)
    认证方式:选择使用用户名和密码(用户名可以直接在小程序后台:“设置-开发者设置-tgit权限管理-管理权限”里面查看。使用SSH key是使用SSH链接才使用)。


    方法二、tgit账号不是非小程序账号
    一、使用非小程序账号注册tgit账号(未实现)

     

     

     

     

    展开全文
  • 问题:1、从打开开发者工具就一直弹出当前系统代理不是安全代理是否信任,随意点确定或取消或点右上角 X 关闭都可以正常打开工具使用,在使用过程中仍继续不间断弹框当前系统代理不是安全代理是否信任 尝试1:在...
  • 参考如下图即可解决微信工具的服务端口已关闭问题
  • 前段时间突发奇想想接触小程序,看了一些视频之后其实主要还是要练手,当然就去官网下载了小程序官方开发工具(https://developers.weixin.qq.com/miniprogram/dev/devtools/nightly.html) 下载、安装、新建/导入...
  • 这个game是我新建的页面,保存后,界面一直未变(还是index的初始界面)。怎么才能展示我新建的页面内容呢? ![图片说明](https://img-ask.csdn.net/upload/201903/22/1553258779_468019.png)
  • 微信小程序开发者工具v0.11 Mac版
  • 在安装微信开发者工具的时候,提示了一个比较奇怪的问题。 搜索了网络上很多解决的方案,但是实际尝试并没有生效。 检索的链接比较靠谱的有以下两个: 1....
  • 最近开始学习上了微信小程序开发,网上找了一个教程来学习,结果刚开始学习就掉进了坑里。 在教程之中,新建了一个空白项目后,进去项目,根目录下新建了一个app.json文件,然后新建了一个pages目录,pages目录下...
  • 早期微信应用的开发是一件非常痛苦的事情,因为基于微信的网页涉及到调用微信的接口,所以网页必须在微信的内置浏览器打开才能看到实际的运行效果。做过前端开发的同学都知道,Chrome和firefox都自带强大的调试工具...
  • 前言 由于项目需要,最近开始了微信小程序开发的学习,从官方的开发工具开始。微信小程序无论是从开发难度还是从便捷性上来讲都是不错的选择,而且...开发者工具 系统:win7及以上版本 工具 安装和建立工程都很...
  • 原来的预览方式,每次都得扫码!现在的预览方式,只要点击预览,选择“自动预览”,点击编译并预览,手机端会自动同步,是相当的不错哦。
  • 一、删除小程序项目通常我们会进入到项目配置中寻找删除按钮,不幸的是那里并没有删除按钮。删除的设置在启动页面的底部“管理项目”中,如下图:进入管理项目后,就...喜欢研究的同学可以试试直接改 project.con...
  • 新版遍地是坑,怨声载道。版本回退方法:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html下载历史...即,打开开发工具,一片空白,之前的项目都没了。需要重新添加项目地址 但至少能接着开发啊!!
1 2 3 4 5 ... 20
收藏数 7,663
精华内容 3,065