徐培源 發表於 2019-5-7 18:03:00

使用uni-app开发小程序,关于小程序更新后与用户本地不会及时更新解决办法

<h2>1.原因分析</h2>
<p>在小程序更新开发版本之后,用户本地并没有对之前版本的小程序进行删除,那么再进入小程序的时候的版本是不会发生变化的,这是由于发版是异步执行,因此新版本将会覆盖的比较慢,本质是小程序的启动方式分为两种,冷启动与热启动。</p>
<p>冷启动:指的是用户首次打开或小程序被微信主动销毁后再次打开的情况,此时小程序需要重新加载启动。<br>热启动:指用户已经打开过某小程序,然后在一定时间内再次打开该小程序,此时无需重新启动,只需将后台态的小程序切换到前台,这个过程并不会重新加载启动。</p>
<h2>2.解决方案</h2>
<p>为了在小程序每次更新及时提醒用户更新,uni-app提供了<code>uni.getUpdateManager()</code>接口,用于管理小程序更新。<br>参考地址:https://uniapp.dcloud.io/api/other/update?id=getupdatemanager<br>代码为:</p>
<div class="cnblogs_code">
<pre>onLaunch: <span style="color: rgba(0, 0, 255, 1)">function</span><span style="color: rgba(0, 0, 0, 1)">() {
            const updateManager </span>=<span style="color: rgba(0, 0, 0, 1)"> uni.getUpdateManager();
            updateManager.onCheckForUpdate(</span><span style="color: rgba(0, 0, 255, 1)">function</span><span style="color: rgba(0, 0, 0, 1)">(res) {
                </span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 请求完新版本信息的回调</span>
                <span style="color: rgba(0, 0, 255, 1)">if</span><span style="color: rgba(0, 0, 0, 1)"> (res.hasUpdate) {
                  updateManager.onUpdateReady(</span><span style="color: rgba(0, 0, 255, 1)">function</span><span style="color: rgba(0, 0, 0, 1)">(res2) {
                        uni.showModal({
                            title: </span>'更新提示'<span style="color: rgba(0, 0, 0, 1)">,
                            content: </span>'发现新版本,是否重启应用?'<span style="color: rgba(0, 0, 0, 1)">,
                            cancelColor:</span>'#eeeeee'<span style="color: rgba(0, 0, 0, 1)">,
                            confirmColor:</span>'#FF0000'<span style="color: rgba(0, 0, 0, 1)">,
                            success(res2) {
                              </span><span style="color: rgba(0, 0, 255, 1)">if</span><span style="color: rgba(0, 0, 0, 1)"> (res2.confirm) {
                                    </span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 新的版本已经下载好,调用 applyUpdate 应用新版本并重启</span>
<span style="color: rgba(0, 0, 0, 1)">                                    updateManager.applyUpdate();
                              }
                            }
                        });
                  });
                }
            });

            updateManager.onUpdateFailed(</span><span style="color: rgba(0, 0, 255, 1)">function</span><span style="color: rgba(0, 0, 0, 1)">(res) {
                </span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 新的版本下载失败</span>
<span style="color: rgba(0, 0, 0, 1)">                uni.showModal({
                  title: </span>'提示'<span style="color: rgba(0, 0, 0, 1)">,
                  content: </span>'检查到有新版本,但下载失败,请检查网络设置'<span style="color: rgba(0, 0, 0, 1)">,
                  success(res) {
                        </span><span style="color: rgba(0, 0, 255, 1)">if</span><span style="color: rgba(0, 0, 0, 1)"> (res.confirm) {
                            </span><span style="color: rgba(0, 128, 0, 1)">//</span><span style="color: rgba(0, 128, 0, 1)"> 新的版本已经下载好,调用 applyUpdate 应用新版本并重启</span>
<span style="color: rgba(0, 0, 0, 1)">                            updateManager.applyUpdate();
                        }
                  }
                });
            });
      },</span></pre>
</div>
<h2>3.本地调试</h2>
<p>在微信小程序开发工具中,添加编译模式,步骤如下:</p>
<p>1.点击普通编译下的【添加编译模式】按钮</p>
<p><img src="https://img2018.cnblogs.com/blog/860581/201905/860581-20190507180118139-1899788199.png"></p>
<p>2 填写新编译模式值,填写一个名称,选择一个启动页面(首页),勾选底部选项。</p>
<p><img src="https://img2018.cnblogs.com/blog/860581/201905/860581-20190507180126624-1357716616.png"></p>
<p>3 选择新的编译选项,加载当前小程序。</p>
<p>&nbsp;<img src="https://img2018.cnblogs.com/blog/860581/201905/860581-20190507180134405-142671028.png"></p>
<p>这样界面上就可以出现刚才我们添加的代码的执行效果了,如下:</p>
<p><img src="https://img2018.cnblogs.com/blog/860581/201905/860581-20190507180147907-506968151.png"></p>
<p><span style="font-size: 16px; color: rgba(255, 0, 0, 1)">推荐是最好的支持,关注是最大的鼓励。亲爱的朋友,很荣幸在园子里遇到您,希望能与您一起学习~~~</span>。</p>

</div>
<div id="MySignature" role="contentinfo">
    As you wish.<br><br>
来源:https://www.cnblogs.com/wfaceboss/p/10827088.html
頁: [1]
查看完整版本: 使用uni-app开发小程序,关于小程序更新后与用户本地不会及时更新解决办法