Migrating a WeChat Mini‑Program to Baidu Mini‑Program: Goals, Approach, Challenges, and Outcomes

Author Introduction Zhang Haiming, Development Manager of Ctrip Train Ticket R&D, joined Ctrip in 2015 and has worked on Android, ReactNative, and mini‑program development.

1. Introduction With the rapid rise of mini‑programs on platforms such as WeChat, Baidu, and Alipay, Ctrip launched its own mini‑program to capture traffic, which also increased the workload. Ensuring quality, iteration speed, and reducing effort across platforms became a key concern.

2. Overview The article is organized around four points: why convert from WeChat to Baidu, the conversion ideas, problems encountered and their solutions, and the final results with future outlook.

3. Why Convert from WeChat to Baidu Mini‑Program After an initial simple Baidu mini‑program was released for market testing, the traffic proved significant, prompting optimization. Constraints included the need to keep the original WeChat code quality, limited reuse of cross‑platform frameworks (e.g., Taro, Remax), lack of native Baidu language reuse, and the desire to support future platforms.

4. Goals and Conversion Approach

4.1 Goal Enable one‑click conversion of a WeChat mini‑program to a Baidu mini‑program while supporting continuous iteration.

4.2 Approach The open‑source tool wx2swan was selected, which claims to migrate about 80% of the code and save roughly 50% of the effort. Two conversion schemes were evaluated:

Copy‑and‑modify the converted code – high maintenance cost for future iterations.

Adapt the original WeChat code to handle Baidu differences – larger upfront work but smoother future iterations.

The second scheme was chosen.

5. Problems Encountered and Solutions

5.1 Platform Difference Mitigation Key differences were addressed in API usage and UI handling. Example CSS font‑face adjustment:

@font-face {font-family: "xxx-iconfont"; src: url('data:application/octet-stream;bas...') format('truetype');}

.ifont-add:before {font-family: 'xxx-iconfont'; content: "\e7f8";}

Loop and conditional rendering required wrapping <block> elements to avoid empty DOM nodes in Baidu:

<block wx:for="{{arr}}" wx:for-item="s" wx:key="{{index}}">
    <view class="cls" wx:if="{{some condition}}" data-index="{{index}}" bindtap="taptap">
        <view class="cont">{{s.name}}</view>
    </view>
</block>

Other issues included lack of bitwise operators and shift operators in Baidu's swan language, which were moved to JavaScript.

5.2 wxs Rewrite The WeChat‑specific wxs scripts could not run on Baidu, so their logic was reimplemented in JavaScript.

5.3 H5 Data Transfer When navigating to H5 pages, the Baidu SDK was required to pass data.

5.4 Business‑Specific Adjustments A global platform detection utility was added:

initConfig() {
    // Determine platform by appId
    // channel represents the platform
    // requestChannel used for request headers
    switch (appId) {
        case baiduAppid:
            config.channel = 'Baidu';
            config.requestChannel = "RequestChannel.Baidu";
            break;
        default:
            config.channel = 'WX';
            config.requestChannel = "RequestChannel.WX";
            break;
    }
    config.isCtripApp = config.channel === 'WX';
    config.isBaiduApp = config.channel === 'Baidu';
    Object.assign(global.config, config);
}

Pages then read the flag to adjust UI/logic, and request headers were enriched with the platform identifier:

header: { 'request-type': `${global.config.requestChannel}` }

5.5 Workflow Git branching was used to isolate Baidu adaptations (e.g., develop_baidu branch) while keeping the original WeChat code untouched, enabling smooth merges and iterative development.

6. Results and Outlook The team achieved the target: a one‑click conversion from WeChat to Baidu mini‑program with continuous iteration capability. The established process has been applied to Quick‑App adaptation and is planned for other platforms, offering a reusable pattern for teams migrating from WeChat‑centric development.