uniapp 微信小程序广告

uniapp微信小程序可以使用插屏广告来在应用中展示广告内容。在uniapp官网和微信开放文档中都有相关的插屏广告文档可以参考。在代码中，可以在onLoad()方法中加载插屏广告，使用Utils.interstitial.load('插屏广告位id')来进行加载。在进入小程序时调用插屏广告时，可能会出现不能显示的情况，可以通过设置第一次进入就显示插屏广告来解决这个问题，将times设置为0。即使提示一定时间不显示，也可以忽略它并持续尝试显示，直到成功为止。如果想在15秒后显示插屏广告，可以不用进行这个操作。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [uniapp 小程序 加载显示插屏广告](https://blog.csdn.net/weixin_42065713/article/details/120707921)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]

### 在 UniApp 微信小程序中集成和配置穿山甲广告 SDK #### 准备工作 为了在 UniApp 开发的微信小程序中集成并开通穿山甲广告，需确保已注册今日头条旗下的穿山甲平台账号，并完成开发者认证。 #### 创建广告位 登录穿山甲后台，在应用管理页面创建新应用或选择已有应用。接着进入该应用详情页中的“新建广告位”，按照提示填写相关信息来创建适合需求的广告形式（如激励视频、插屏等），获取对应的 `adUnitId`[^2]。 #### 安装依赖包 使用 HBuilderX 打开项目，在 manifest.json 文件里找到 uni-app 插件市场入口安装最新版本的 “@dcloudio/uni-csj-ad” 组件用于支持穿山甲广告服务： ```json { "usingComponents": { ... }, "requireNativePlugin": true, "plugins": { "@dcloudio/uni-csj-ad": {} } } ``` #### 修改 app.json 或 pages.json 进行全局设置 对于需要加载广告的小程序页面，可以在其所在的 json 配置文件内加入如下字段以声明所使用的广告组件及其参数： ```json { "app-plus": { "distribute": { "sdkConfigs": { "ad" : { "csj" : {"appId":"<your_csj_app_id>"} } } } } } ``` 其中 `<your_csj_app_id>` 是指从穿山甲控制台获得的应用 ID。 #### 编写业务逻辑代码实现广告展示功能 下面是一个简单的例子展示了如何在一个按钮点击事件处理函数里面初始化并显示一个激励型视频广告实例： ```javascript import csjad from '@/components/csja-video/index'; export default { data() { return { videoAd: null, // 存储广告对象引用 }; }, onLoad() { this.loadRewardVideoAd(); }, methods: { loadRewardVideoAd() { const that = this; if (this.videoAd) { this.videoAd.destroy(); // 销毁之前的实例防止内存泄漏 } try { this.videoAd = csjad.createRewardedVideoAd({ adUnitId: '<your_ad_unit_id>', // 替换成实际取得的广告单元ID }); this.videoAd.onLoad(() => console.log('videoAd loaded')); this.videoAd.onError(err => console.error(`rewarded video error ${err.errMsg}`)); this.videoAd.onClose(res => { if (!res.isEnded){ wx.showToast({title:'未看完无法领取奖励',icon:"none"}); }else{ // 用户观看了完整的广告后给予相应奖励... } }); this.showRewardVideoAd(); } catch (error) { console.warn(error); } }, showRewardVideoAd(){ let self=this; if(this.videoAd){ this.videoAd.load().then(()=>{ setTimeout(function(){self.videoAd.show()},100); }).catch((err)=>{ console.error('load fail:', err); }) } } } }; ``` 此段脚本实现了当页面加载完成后尝试预加载一条激励式视频广告；当用户触发特定操作时调用 `show()` 方法播放这段预先准备好的素材。同时监听了几个重要的生命周期钩子以便于捕获异常情况以及确认观众是否完成了整个观看过程从而决定是否发放奖品。