Capturing External Launch Data in WeChat Mini Programs
When an external application or a deep link initiates a mini-program, the runtime injects initialization parameters into the global lifecycle hooks. Reliable extraction requires consolidating data from multiple sources: direct query strings, referrer payloads, and encoded scene parameters.
The native environment exposes onLaunch and onShow at the application scope. These callbacks provide access to the query object, referrerInfo, and occasionally a compressed scene string. The implementation below demonstrates a centralized strategy for merging these inputs into a persistent global state.
App({
globalData: {
launchContext: {}
},
onLaunch(initOpts) {
this._resolveParameters(initOpts);
},
onShow(resumeOpts) {
if (resumeOpts.scene) {
this._resolveParameters(resumeOpts);
}
},
_resolveParameters(opts) {
const directQuery = opts.query || {};
const externalPayload = opts.referrerInfo?.extraData || {};
const sceneMap = directQuery.scene
? this._extractScenePairs(decodeURIComponent(directQuery.scene))
: {};
this.globalData.launchContext = {
...this.globalData.launchContext,
...directQuery,
...sceneMap,
...externalPayload
};
},
_extractScenePairs(rawData) {
const result = {};
rawData.split('&').forEach(segment => {
const [key, val = ''] = segment.split('=');
if (key) result[key] = decodeURIComponent(val);
});
return result;
}
});
Individual pages should prioritize route-specific arguments before falling back to the globally cached launch context. This guarantees that parameters remain accessible regardless of navigation depth or background resume states.
Page({
onLoad(routeOpts) {
const app = getApp();
const targetVal = routeOpts.customKey || app.globalData.launchContext.customKey || '';
this.setData({ extractedParam: targetVal });
}
});
Handling Launch Contexts in UniApp
Cross-platform frameworks like UniApp abstract the underlying platform differences but maintain the same lifecycle architecture for parameter injection. Developers typically capture the initialization payload in the root instance before page rendering begins, which is essential for routing logic that depands on external campaign identifiers or application states.
// App.vue script section
export default {
onLaunch(context) {
console.log('Runtime initialized:', context);
// Forward to state management or global cache
},
onShow(context) {
console.log('App resumed:', context);
// Refresh global parameters if they mutated while suspended
}
};
View components receive immediate route arguments through their own onLoad hook. To maintain consistency across the application, merge the incoming page query with the globally stored initialization data. This approach prevents data loss when users enter through shared links, QR scans, or external app callbacks.
<script>
export default {
onLoad(pageQuery) {
const globalCache = getApp().globalData.launchContext || {};
const unifiedData = { ...globalCache, ...pageQuery };
console.log('Resolved payload:', unifiedData);
// Bind component state to unifiedData
}
};
</script>