公告列表
公告列表
收藏
回答

wx-open-launch-weapp跳转小程序为什么第一次会闪退？

开放标签：wx-open-launch-weapp;

小程序基础库版本：3.9

h5中未发生报错，且跳转成功，但是小程序进入之后立马闪退

<!DOCTYPE html>
<html>


<head>
    <meta charset="UTF-8">
    <title>订单</title>
    <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Expires" content="0">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
    <link rel="stylesheet" href="https://static-cdn.shenmabaike.com/vant/2.12.47/index.min.css" />
    <link rel="stylesheet" type="text/css" href="/assets/h5/css/main.css" />
    <link rel="stylesheet" type="text/css" href="/assets/h5/css/flex.css" />
    <link rel="stylesheet" type="text/css" href="/assets/h5/css/record.css" />
    <link rel="stylesheet" type="text/css" href="/assets/h5/css/wxapp_frame.css" />
    <script src="https://static-cdn.shenmabaike.com/vue/2.6.14/vue.min.js"></script>
    <script src="https://static-cdn.shenmabaike.com/vant/2.12.47/vant.min.js"></script>
    <script src="https://static-cdn.shenmabaike.com/jquery/1.9.1/jquery.min.js"></script>
    <script src="/assets/h5/js/jweixin-1.6.0.js"></script>
    <!-- <script src="https://cdn.jsdelivr.net/npm/eruda"></script>
    <script>eruda.init();</script> -->


    <script>
        (function ($, window) {
            // rem 自适应
            $(window).resize(function () {
                var winW = $(window).width();
                var fz = (100 * winW) / 750;
                fz = fz > 100 ? 100 : fz;


                $("html").css({ "font-size": fz + "px" });
            });
            $(window).resize();
        })(jQuery, window);
    </script>
</head>


<body>
    <div id="app" v-cloak>
        <div class="container">
            <van-sticky>
                <div class="top-tips u-flex-xy-center">
                    为保护用户隐私，相关数据仅保存1个月，请及时下载
                </div>


                <div class="tabs">
                    <van-tabs color="#2761FF" @change="changeTab" v-model="currTab">
                        <van-tab v-for="(item, index) in orderTabList" :key="index" :title="item.title"
                            :name="item.name"></van-tab>
                    </van-tabs>


                    <div v-if="currTab == 2" class="sec-tabs u-flex-y-center">
                        <div v-for="(item, index) in orderTabList[currTab].children" :key="index"
                            class="tabs-item u-flex-xy-center" :class="{ tabsActive: formatIndex == index }"
                            @click="changeFormatTab(item, index)">
                            {{ item.title }}
                        </div>
                    </div>
                </div>
            </van-sticky>


            <!-- 顶部背景图，固定在页面顶部 -->
            <div class="top-bg fullimg">
                <img src="/assets/h5/image/index-bg.png" />
            </div>
            <div v-if="!recordList.length">
                <div class="empty u-flex-y u-flex-center u-flex-items-center">
                    <img src="/assets/h5/image/empty/no-list.png" class="img"></img>
                </div>
            </div>
            <template v-else>
                <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
                    <van-list v-model="loading" :finished="finished" :immediate-check="false" finished-text="没有更多了"
                        @load="onLoad" class="list">
                        <div v-for="(item, index) in recordList" :key="index"
                            class="item u-flex-y-center u-flex-between van-clearfix"
                            :class="{ 'del-item': item.delete_time }" @click.stop="backShow = true">
                            <template v-if="!item.delete_time">
                                <!-- status  0 制作中  1完成  2失败 -->
                                <div v-if="item.status == 3" class="image fullimg u-flex-xy-center err">
                                    <img src="/assets/h5/image/order/fail.png" />
                                </div>


                                <div v-else class="image fullimg u-flex-xy-center">
                                    <img :src="item.cover_image.file_path" />
                                    <div v-if="item.img_num > 1" class="num u-flex-xy-center">{{ item.img_num }}</div>
                                </div>
                            </template>
                            <template v-else>
                                <div class="image fullimg">
                                    <img src="/assets/h5/image/order/del-icon.png" mode="aspectFill" />
                                </div>
                            </template>
                            <div class="info u-flex-y u-flex-between">
                                <div class="tips u-flex-y-center u-flex-between">
                                    <div class="title">
                                        <!-- status  0 制作中  1完成  2失败 -->
                                        <span v-if="item.status == 3">
                                            <!-- 31去手写vip等级 -->
                                            {{ [0, 1, 31].includes(item.vip_level) ? '制作失败,次数已返还' : '制作失败' }}
                                        </span>
                                        <template v-else>
                                            <span>
                                                {{ item.title }}
                                            </span>
                                        </template>
                                    </div>
                                </div>
                                <!-- 制作中 -->
                                <div v-if="item.status == 1" class="make-ing">
                                    <div class="u-flex-xy-center">
                                        <van-progress style="flex: 1" :percentage="90" :show-pivot="false"
                                            color="#2761FF"></van-progress>
                                        <div class="val">90%</div>
                                    </div>
                                    <div class="make-text">正在制作中</div>
                                </div>


                                <div v-else class="time u-flex-y-center">
                                    {{ item.create_time }}
                                    <div v-if="item.cover_image && item.status == 2" class="size">
                                        <span v-if="item.cover_image.file_size / 1024 < 1024">
                                            {{ (item.cover_image.file_size / 1024).toFixed(1) }}kb
                                        </span>
                                        <span v-else>{{ (item.cover_image.file_size / 1024 / 1024).toFixed(2) }}MB</span>
                                    </div>
                                </div>
                            </div>
                            <div v-if="item.delete_time" class="btn download u-flex-xy-center"
                                @click.stop="backShow = true">
                                <div class="text">已删除</div>
                            </div>
                            <template v-else>
                                <!-- 订单列表功能 -->
                                <div v-if="item.status !== 0" class="btn del u-flex-xy-center"
                                    @click.stop="backShow = true">
                                    <van-icon name="delete-o" class="icon"></van-icon>
                                    <div class="text">删除</div>
                                </div>
                            </template>
                        </div>
                    </van-list>
                </van-pull-refresh>
            </template>
        </div>
        <!-- 返回弹窗 -->
        <van-popup v-model="backShow" round="50" :close-on-click-overlay="false"
            style="background: linear-gradient(179deg, #D5E7FF 0%, #FFFFFF 100%);">
            <div class="backPopup">
                <!-- <div class="top-bg"></div> -->
                <!-- <img class="finish" src="/static/mobile/img/finish-icon.png" alt="" /> -->
                <div class="info">
                    <div>当前h5暂不支持该功能，</div>
                    <div>请点击下方按钮返回小程序操作</div>
                </div>
                <div style="text-align: center;">
                    <img src="/assets/h5/image/shou.png" class="backPopup-shou" alt="">
                    <!-- <button style="display: flex;justify-content: center;align-items: center;width: 260px;height: 60px;background:#4876f0;border-radius: 60px;border: none;font-size: 24px;color: #fff;margin: 17px auto 0 auto;">点我跳转小程序</button> -->
                    <wx-open-launch-weapp id="launch-btn" :appid="wxAppid" path="pages/order/index"
                        @launch="handleLaunch" @error="handleError">
                        <script type="text/wxtag-template">
                                <style>.btn {
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    width: 260px;
                                    height: 60px;
                                    background: #4876F0;
                                    border-radius: 60px;
                                    border: none;
                                    font-size: 24px;
                                    color: #FFFFFF;
                                    margin: 17px auto 0 auto;
                                }</style>
                                <button class="btn">点我跳转小程序</button>
                            </script>
                    </wx-open-launch-weapp>
                </div>
            </div>
        </van-popup>
        <van-popup v-model="jumpWeapp" round="50" :close-on-click-overlay="false"
            style="background: linear-gradient(179deg, #D5E7FF 0%, #FFFFFF 100%);">
            <div class="backPopup">
                <div class="info">
                    <div>当前h5暂不支持该功能</div>
                    <div>请返回小程序文档列表操作</div>
                    <van-image src="/assets/h5/image/tabbar.png"></van-image>
                </div>
            </div>
        </van-popup>
    </div>
    <script>
        const content = {$init_config | json_encode | raw
    };
        const search = window.location.search
        const params = search.split('?')[1]
        const order = params.split('&')
        const [token, makeRecordCategoryId] = order.map(item => item.split('=')[1])
        console.log(content, token, makeRecordCategoryId);
        


        // 创建生成器
        function* traverseNodes(items, parentIndex = -1) {
            for (let i = 0; i < items.length; i++) {
                yield { item: items[i], parentIndex, childIndex: i }
                if (items[i].children && items[i].children.length) {
                    yield* traverseNodes(items[i].children, i)
                }
            }
        }


        new Vue({
            el: '#app',
            data() {
                return {
                    loading: false,
                    finished: false,
                    refreshing: false, // 是否下拉刷新
                    backShow: false,
                    orderTabList: [],


                    currTab: 0, // 当前tab索引
                    formatIndex: 0, // 格式订单索引
                    lineBg: '/assets/h5/image/order/line-bg.png',
                    intervalId: null,
                    recordList: [],
                    page: 1,
                    total: 0,
                    searchNum: 0, // 请求次数
                    wxAppid: content.wxapp_member.app_id,
                    jumpWeapp: false,
                }
            },
            async created() {
                await this.getCategory()
                const { parent, child } = this.getCurrTabOrFormatIndex()
                this.currTab = parent
                this.formatIndex = child
                this.getWxConfig();
                await this.getData(true)
            },
            mounted() {
                window.addEventListener('visibilitychange', this.handlePageChange)
            },
            beforeDestory() {
                window.removeEventListener('visibilitychange', this.handlePageChange)
            },
            methods: {
                getCurrTabOrFormatIndex () {
                    for (const { item, parentIndex, childIndex } of traverseNodes(this.orderTabList)) {
                        if (item.id === Number(makeRecordCategoryId)) {
                            return { parent: parentIndex, child: childIndex }
                        }
                    }
                    return { parent: -1, child: -1 }
                },
                async getCategory() {
                    const url = `${content.get_record_category_url}?token=${token}`
                    try {
                        const res = await this.request(url)
                        this.orderTabList = res
                    } catch (err) {
                        console.log(err);
                    }
                },
                // 请求方法
                request(url, data = {}, type = 'post',) {
                    return new Promise((resolve, reject) => {
                        $.ajax({
                            url,
                            type,
                            contentType: 'application/json',
                            data: JSON.stringify(data),
                            success(res) {
                                resolve(res.data)
                            },
                            error(err) {
                                reject(err)
                            }
                        })
                    })
                },
                // 微信配置信息
                async getWxConfig() {


                    try {
                        wx.config(JSON.parse(content.jsSdkConfig));
                        wx.ready((res) => {
                            console.log('wx ready', res);
                        });
                        wx.error(err => {
                            console.log('wx error', err);
                        })
                    } catch (err) {
                        console.log(err);
                    }
                },


                // 获取数据
                async getData(isReset = false) {
                    this.$toast.loading({
                        message: '加载中...',
                        overlay: true,
                        forbidClick: true,
                    })
                    const { orderTabList, currTab, formatIndex } = this
                    if (isReset) {
                        this.page = 1
                        this.recordList = []
                    }


                    if (this.finished) return
                    const url = `/h5/index/getRecordList?token=${token}`
                    const params = {
                        page: this.page,
                        page_size: 10,
                    }
                    if (this.currTab === 2) {
                        params.category_id = orderTabList[currTab].children[formatIndex].id
                    } else {
                        params.category_id = orderTabList[currTab].children[0].id
                    }
                    this.loading = true
                    try {
                        const res = await this.request(url, params)
                        const { page_info, record } = res
                        this.recordList = [...this.recordList, ...record]
                        this.page = page_info.page + 1
                        this.total = page_info.total_count
                        this.isFirst = false
                        this.loading = false
                        this.$toast.clear()
                        const makingIdList = []
                        this.recordList.forEach(item => {
                            if (item.status === 1) {
                                makingIdList.push(item.id)
                            }
                        })
                        this.makingIdList = makingIdList
                        this.changeStatus()
                        console.log(res);
                    } catch (err) {
                        console.log(err);
                        
                    } finally {
                        this.loading = false
                    }
                },


                // 定时请求最新状态
                changeStatus() {
                    if (this.intervalId) return


                    this.intervalId = setInterval(() => {
                        this.searchNum += 1
                        if (this.makingIdList.length) {
                            for (const id of this.makingIdList) {
                                this.getDetail(id)
                            }
                        } else {
                            this.clearTime()
                        }
                    }, 5000)
                },


                async getDetail(id) {
                    const url = `${content.get_record_detail_url}?token=${token}`
                    try {
                        const res = await this.request(url, { total_record_id: id })
                        if (res.status === 2) {
                            const index = this.recordList.findIndex(item => item.id === detail.id)
                            if (index === -1) return
                            this.recordList[index].status = res.status
                            if (res.cover_image) {
                                this.recordList[index].cover_image = res.cover_image
                            }
                            this.makingIdList = this.makingIdList.filter(it => it !== detail.id)
                        }
                    } catch (err) {   
                        console.log(err);
                        
                    } finally {}
                },


                // 清除定时器
                clearTime() {
                    clearInterval(this.intervalId)
                    this.intervalId = null
                },
                async changeTab(e) {
                    this.currTab = e
                    this.finished = false;
                    await this.getData(true)
                },
                // 切换格式订单下的tab
                async changeFormatTab(item, index) {
                    if (+this.formatIndex === +index) return
                    this.formatIndex = index


                    // 切换tab前，清掉定时器
                    this.clearTime()
                    // 清空列表数据
                    this.finished = false;
                    await this.getData(true)
                },


                // 下拉刷新
                onRefresh() {
                    // 清空列表数据
                    this.finished = false;


                    // 重新加载数据
                    // 将 loading 设置为 true，表示处于加载状态
                    this.loading = true;
                    this.getData(true)
                },


                // 触底
                onLoad() {
                    this.getData()
                    if (this.recordList.length >= this.total) {
                        this.finished = true
                    }
                },
                handleLaunch(res) {
                    sessionStorage.setItem('jumpWeapp', JSON.stringify(true))
                    console.log(res);
                },
                handleError(err) {
                    console.log(err);
                },
                handlePageChange() {
                    const jumpWeapp = JSON.parse(sessionStorage.getItem('jumpWeapp'))
                    if (!document.hidden) {
                        this.getWxConfig()
                        if (jumpWeapp) {
                            this.jumpWeapp = jumpWeapp
                            this.backShow = !this.jumpWeapp
                        }
                    } else {
                        if (this.backShow) {
                            sessionStorage.setItem('jumpWeapp', JSON.stringify(true))
                            this.backShow = false
                        }
                    }
                }
            }
        })  
    </script>
</body>


</html>
回答关注问题邀请回答
收藏

1 个回答

  • 社区技术运营专员--许涛
    社区技术运营专员--许涛
    2025-09-03

    你好，麻烦提供下机型，微信版本号和复现链接

    2025-09-03
    有用
    回复 1
    • zh
      zh
      2025-11-22
      您好，这个没有问题了，是我们没有考虑到生产环境跟开发环境，导致从开发环境跳转到生产环境；第一次跳转会跳转到生产环境但是第一次微信没有生产环境的包就会闪退，第二次就没有问题了，这个是主要原因，跟sdk、开放标签无关
      2025-11-22
      赞
      回复
请 登录 后发表内容
相关文档