1. 创建广告位

首先，你需要在QQ广告和微信广告平台上创建一个插页广告位。在QQ广告平台中，你需要创建一个QQ插页广告位，而在微信广告平台中，你需要创建一个小程序插屏广告位。这将为你提供一个唯一的广告单元ID，以便在小程序中使用。

2. 引入广告组件

在你的小程序代码中，你需要引入广告组件。以下是一个示例代码，演示了如何引入QQ和微信小程序的插页广告组件：

// QQ小程序
onLoad: function () {
  this.creatInterstitialAd();
},

onUnload: function () {
  if (this.InterstitialAd) {
    this.InterstitialAd.destroy();
  }
},

creatInterstitialAd() {
  // 创建插页广告
  this.InterstitialAd = qq.createInterstitialAd({
    adUnitId: 'your_ad_unit_id'
  });
  this.InterstitialAd.onLoad(() => {
    console.log('插页广告加载完成');
  });
  this.InterstitialAd.onError((err) => {
    console.error('插页广告加载失败', err);
  });
},

showInterstitialAd: function () {
  if (this.InterstitialAd) {
    this.InterstitialAd.show()
      .then(() => {
        console.log('插页广告展示成功');
      })
      .catch((err) => {
        console.error('插页广告展示失败', err);
      });
  } else {
    console.error('插页广告未初始化');
  }
}

// 微信小程序
onLoad: function () {
  this.creatInterstitialAd();
},

onUnload: function () {
  if (this.InterstitialAd) {
    this.InterstitialAd.destroy();
  }
},

creatInterstitialAd() {
  // 创建插屏广告
  this.InterstitialAd = wx.createInterstitialAd({
    adUnitId: 'your_ad_unit_id'
  });
  this.InterstitialAd.onLoad(() => {
    console.log('插屏广告加载完成');
  });
  this.InterstitialAd.onError((err) => {
    console.error('插屏广告加载失败', err);
  });
},

showInterstitialAd: function () {
  if (this.InterstitialAd) {
    this.InterstitialAd.show()
      .then(() => {
        console.log('插屏广告展示成功');
      })
      .catch((err) => {
        console.error('插屏广告展示失败', err);
      });
  } else {
    console.error('插屏广告未初始化');
  }
}

3. 展示插页广告

一旦引入了广告组件，你可以使用 showInterstitialAd 方法来展示插页广告。这个方法会触发广告的加载和展示，当广告加载完成后，它将在你的小程序中显示。

4. 处理广告事件

在上述示例中，我们还定义了处理广告事件的回调函数，例如 onLoad 和 onError。这些事件可以帮助你监测广告的加载情况，以及在出现错误时进行适当的处理。

5. 释放资源

最后，不要忘记在小程序页面卸载时使用 onUnload 方法释放广告组件的资源，以免产生不必要的内存消耗。