首页 > 其他分享 >【快应用】adbutton如何直接下载广告而不跳落地页再下载

【快应用】adbutton如何直接下载广告而不跳落地页再下载

时间:2023-08-04 10:57:20浏览次数:36  
标签:adData false 落地 color adbutton margin 下载 native

​ 【关键词】

原生广告、adbutton、下载

 

【问题背景】

快应用中的原生广告推出了adbutton组件来直接下载广告app,在使用的时候,点击adbutton按钮的安装文案,不是直接下载广告app,而是跳转到落地页后直接下载,这种情形该如何解决?

相关代码:

<template>

  <!-- Only one root node is allowed in template. -->

  <div class="container">

    <div class="item-container">

      <input class="input-text" placeholder="请输入slotid" onchange="setProductIdValue"></input>

      <input type="button" class="btn" value="加载并展示原生广告" onclick="showNativeAd()" />

      <ad-button if="native.isShowImg" class="adbutton" adunitid="{{native.adUnitId}}" adid="{{native.adData.adId}}" open-type="1" valuetype="1" onclick="onAdButtonClick()"></ad-button>

      <div if="native.isShow" class="container">

        <stack>

          <video id="video" if="native.isShowVideo" src="{{native.adVideoSrc}}" autoplay="true" onclick="reportNativeClick()" class="ad-video"></video>

          <image if="native.isShowImg" src="{{native.adImgSrc}}" onclick="reportNativeClick()"></image>

        </stack>

        <text if="native.isShowData">{{ native.adData }}</text>

        <text if="native.errStr">{{ native.errStr }}</text>

        <text if="native.isShowDesc">{{ native.desc }}</text>

      </div>

    </div>

  </div>

</template>

 

<style>

  .container {

    flex: 1;

    flex-direction: column;

  }

  .input-text {

    height: 80px;

    line-height: 80px;

    padding-left: 30px;

    padding-right: 30px;

    margin-left: 30px;

    margin-right: 30px;

    border-top-width: 1px;

    border-bottom-width: 1px;

    border-color: #999999;

    font-size: 30px;

    background-color: #ffffff;

  }

  .adbutton {

    height: 100px;

    width: 600px;

    text-align: center;

    margin-right: 60px;

    margin-left: 60px;

    margin-bottom: 50px;

    font-size: 30px;

    background-color: rgba(176, 14, 136, 0.6);

    color: rgba(52, 92, 65, 0.945);

    border-radius: 88;

    opacity: 0.9;

    progressbar-color: rgba(51, 10, 89, 0.931415926);

    progressbar-text-color: #8b0000;

    progressbar-background-color: hsl(001, 65%, 075%);

  }

  .btn {

    height: 80px;

    text-align: center;

    border-radius: 5px;

    margin-right: 60px;

    margin-left: 60px;

    margin-bottom: 50px;

    color: #ffffff;

    font-size: 30px;

    background-color: #0faeff;

  }

  .item-container {

    margin-top: 50px;

    margin-right: 60px;

    margin-left: 60px;

    flex-direction: column;

    align-items: center;

  }

  image {

    width: 100%;

  }

  .ad-video {

    object-fit: contain;

    width: 100%;

    height: 415px;

  }

</style>

 

<script>

  import ad from '@service.ad'

  let nativeAd

  export default {

    componentName: 'ad',

    provider: '',

    data: {

      native: {

        adUnitId: 'testb65czjivt9',

        isShow: 'false',

        adData: {},

        isShowImg: false,

        isShowVideo: false,

        isShowData: false,

        isShowDesc: false,

        errStr: '',

        adImgSrc: '',

        adImgSrc1: '',

        adImgSrc2: '',

        adVideoSrc: ''

      }

    },

    hideAll() {

      this.native.isShow = false

      this.native.isShowImg = false

      this.native.isShowVideo = false

      this.native.isShowDesc = false

    },

    showNativeAd() {

      nativeAd = ad.createNativeAd({ adUnitId: this.native.adUnitId })

      nativeAd.onLoad((data) => {

        console.info('ad data loaded: ' + JSON.stringify(data))

        this.native.adData = data.adList[0]

        if (this.native.adData) {

          if (this.native.adData.imgUrlList) {

            this.native.adImgSrc = this.native.adData.imgUrlList[0]

            this.native.isShowImg = true

          } else {

            this.native.isShowImg = false

            this.native.adImgSrc = ''

          }

          if (this.native.adData.desc) {

            this.native.desc = this.native.adData.desc

            this.native.isShowDesc = true

          }

          let showVideoFlag = false

          if (this.native.adData.videoUrlList && this.native.adData.videoUrlList[0]) {

            this.native.adVideoSrc = this.native.adData.videoUrlList[0]

            showVideoFlag = true

          } else {

            this.native.isShowVideo = false

            this.native.adVideoSrc = ''

          }

          if (this.native.isShowImg && showVideoFlag) {

            setTimeout(() => {

              this.native.isShowVideo = true

              this.native.isShowImg = false

            }, 1000)

          }

        }

        this.native.isShow = true

        this.native.errStr = ''

      })

      nativeAd.onError((e) => {

        console.error('load ad error:' + JSON.stringify(e))

        this.native.isShowImg = false

        this.native.isShowVideo = false

      })

      nativeAd.load()

    },

    reportNativeClick() {

      nativeAd.reportAdClick({

        'adId': this.native.adData.adId

      })

    },

    setProductIdValue: function (e) {

      this.native.adUnitId = e.value

    },

    onAdButtonClick(event) {

      console.error('result code is : ', event.resultCode)

      nativeAd.reportAdClick({

        'adId': this.native.adData.adId

      })

    }

  }

</script>

 

【问题分析】

可以看到adbutton的点击事件是onAdButtonClick控制的,在点击时进行了一个上报广告点击,看起来是没有任何问题的。实则是不对的因为该接口除了一个上报广告点击的功能外,还有一个额外的作用就是跳转到广告落地页,这个我们可以在原生广告使用时就可以看出来。

再看下adbutton的描述:

cke_1101.png

描述里是用来下载广告主app的,所以当在adbutton点击后调用reportadclick进行上报的时候看到的就是跳转落地页并下载了。

 

【解决方法】

去掉adbutton中的上报广告点击调用,此按钮是用来进行下载和打开广告主app的。

    onAdButtonClick(event) {

      console.error('result code is : ', event.resultCode)

    }

标签:adData,false,落地,color,adbutton,margin,下载,native
From: https://www.cnblogs.com/mayism123/p/17605311.html

相关文章

  • 腾讯tbsX5内核离线下载
    最近下载X5内核老报错115,干脆直接在QQ浏览器上提取了一下留存。2023.8.464位 32位下载完改名tbsX5.apk放到Android/data/{包名}/tbs下,在对应应用打开http://debugtbs.qq.com,点安装本地内核即可,注意位数对应!这个版本debugx5有密码验证,但是可以通过修改res.apk中的debug.html......
  • 重磅特性 - SpreadJS推出新插件甘特图,预览版下载体验中
    摘要:本文由葡萄城技术团队于博客园原创并首发。转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。甘特图对于业务场景中的工程项目管理、预算执行、生产计划等都能将原有的表格数据,转变为直观的甘特图模式。作为纯前端表格控件SpreadJS......
  • SaaS销售打法:常规有效的四种SaaS营销策略,落地执行增长突破
    在外面常规的认知中:SaaS营销与常规的营销其实没有什么不同,都在遵循着传统的推广和销售策略,简单来说就是将自己的产品卖给更多的用户,从而换取利润。SaaS营销策略但是SaaS产品与其他产品不同的地方在于它本身是没有实体的,并不能实实在在的把握在手里,正是因为这样的产品性质使得它对......
  • python coding style guide 的快速落地实践——业内python 编码风格就pep8和谷歌可以
    pythoncodingstyleguide的快速落地实践机器和人各有所长,如codingstyle检查这种可自动化的工作理应交给机器去完成,故发此文帮助你在几分钟内实现codingstyle的自动检查。1.有哪些著名的PythonCodingStyleGuidePEP8https://www.python.org/dev/peps/pep-0008/发明Python语言......
  • 抖音引流微信的广告推广投放方案梳理(自制落地页)
    主要功能说明:需要在抖音直播下投放自己的广告落地页面,用户在抖音视频或者直播间,进入我们的落地页,引导用户添加公司的企业微信,并需要记录用户的相关信息(如unionid,昵称,头像,直播间名称,广告点击id),按照要求进行广告上报。主要有两种链路模式:一种模式是:抖音——落地页——企微自动客......
  • 【python系列】手把手教你在pypi发布自己的包-他人可pip下载
    前言最近在写一个接口执行引擎用作于接口自动化测试平台的核心。看了挺多资料,做了挺多事情,学了挺多乱七八糟的知识,笔记记得乱糟糟的,以至于一直没有整理发文(啊其实我就是懒),各位见谅。正文如下目前该引擎可以通过pip直接下载,但内容我还在写,预计这个月会完成(大概也许可能可以。)pypi发......
  • 【完结15章】React18+TS 通用后台管理系统解决方案落地实战
    课程下载——【完结15章】React18+TS通用后台管理系统解决方案落地实战 提取码:qwu4 给大家分享一套课程——React18+TS通用后台管理系统解决方案落地实战,已完结15章,附源码+笔记。TypeScript是微软开发的一个开源的编程语言,通过在JavaScript的基础上添加静态类型定义构建而成......
  • 价值100大洋的简体中文汉化补丁下载
    这真逗我啊.....要我怎么说呢...... 总之今天是DT才搞这个汉化补丁 说明两点:1基于繁体中文版,我只是改了简体字库,感谢制作繁体中文的大大(难不成官方做的??)2字库有点挫,我写了下面工具帮忙才搞定总之游戏文字还是有点挫........    中文名:   怪怪水族箱外文名:  ......
  • Illustrator软件-Illustrator下载-中文简体版 软件推荐
    Ai2020功能介绍1、自由渐变全新的混色功能可让您创建更丰富、逼真的渐变,从而呈现出更自然的效果。2、全局编辑可同时修改多个画板中的类似对象,以节省时间。3、直观地浏览字体现在您可以更加轻松地浏览不同的字体类别,更快地找到合适的字体。现在您还可以选择不同的示例文本选项。4......
  • ai软件-Illustrator下载-中文简体版使用 软件推荐
    Ai2020官方版是一款由Adobe公司推出的矢量图形制作软件。Ai2020最新版软件拥有强大的图像处理功能,用户能够轻松的进行布局和组织,创建出色的矢量图稿。AdobeIllustrator2020软件拥有更自然、更丰富逼真的渐变效果,并增强了文件读取机制,适合广告设计、插画回执、海报书籍等方面使......