如何优雅的插入广告——代码篇

￡神魔★判官ぃ 2023-10-17 04:48 26阅读 0赞

来源：li6185 投稿

当应用发展到一定阶段，一般都会在feeds流中插入广告，来进行广告的变现，这是每个应用都要进行的过程。 比如微信朋友圈，微博，QQ空间等，不列举了，一般有feeds流的都会有广告。

![20160620005315459][]

当你的应用也需要在原有的业务上插入广告，你会怎么做？ 可能你会直接叫接口把广告跟业务数据合并下，就下发给你。然后你在业务层去各种判断。

![20160620005319679][]

曾经这样做的程序猿应该很多，累吗？ 这样子的插入，需要去改各种代码，还可能在一个微小的角落 可能直接调用了

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>-&nbsp;(nullable&nbsp;__kindof&nbsp;UITableViewCell&nbsp;*)cellForRowAtIndexPath:(NSIndexPath&nbsp;*)indexPath;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

然后返回的类型不对，应用直接Crash了

**出栏**

现在有个新框架来解决这种情况啦，该框架前无古人开源（可能我没搜到），超级一流xxxx（呃，不懂吹啥了，发现不说大一点，都没人敢用，有bug可以提哦。目前公司应用加起来，总用户突破1个亿，日活700W。其实代码的稳定性还是可以放心的。）

**要解决的目标：**

1. 旧代码少改动，或者不改动。

2. 业务跟广告模块分离

3. 广告模块可以获取真实数据源。

4. 上手简单

![20160620005324240][]

**用法**

我先下载了[YYKit][]，YYKit作者对代码的极致追求也是我喜欢的。主要原因是因为它里面有Feeds(Twitter,微博)的demo。就像我们以前的业务代码，够复杂，逻辑够多。

开始

我对demo的具体代码是不了解的，但是有了IMYAOPTableView，我已经可以不需要懂内部的实现，就可以对它进行广告的插入。

先找到了初始化 Twitter,微博 的ViewController地方，并且获取TableView的AopUtils。只有3行代码。哦，还有一个声明。

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> 
    <div>
      6 
    </div> 
    <div>
      7 
    </div> 
    <div>
      8 
    </div> 
    <div>
      9 
    </div> 
    <div>
      10 
    </div> 
    <div>
      11 
    </div> 
    <div>
      12 
    </div> 
    <div>
      13 
    </div> 
    <div>
      14 
    </div> 
    <div>
      15 
    </div> 
    <div>
      16 
    </div> 
    <div>
      17 
    </div> 
    <div>
      18 
    </div> 
    <div>
      19 
    </div> 
    <div>
      20 
    </div> 
    <div>
      21 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>///只是声明，防止提前释放</code> 
     </div> 
     <div> 
      <code>@property&nbsp;(nonatomic,&nbsp;strong)&nbsp;IMYAOPDemo*&nbsp;aopDemo;</code> 
     </div> 
     <div> 
      <code>///插入3行代码的地方</code> 
     </div> 
     <div> 
      <code>-&nbsp;(</code> 
      <code>void</code> 
      <code>)tableView:(UITableView&nbsp;*)tableView&nbsp;didSelectRowAtIndexPath:(NSIndexPath&nbsp;*)indexPath&nbsp;{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>NSString&nbsp;*className&nbsp;=&nbsp;self.classNames[indexPath.row];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>Class&nbsp;</code> 
      <code>class</code>&nbsp; 
      <code>=&nbsp;NSClassFromString(className);</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>if</code>&nbsp; 
      <code>(</code> 
      <code>class</code> 
      <code>)&nbsp;{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>UIViewController&nbsp;*ctrl&nbsp;=&nbsp;</code> 
      <code>class</code> 
      <code>.</code> 
      <code>new</code> 
      <code>;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code>&nbsp; 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>///begin&nbsp;插入3行代码</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>self.aopDemo&nbsp;=&nbsp;[IMYAOPDemo&nbsp;</code> 
      <code>new</code> 
      <code>];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>UITableView*&nbsp;feedsTableView&nbsp;=&nbsp;[ctrl&nbsp;valueForKey:@</code> 
      <code>"tableView"</code> 
      <code>];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>self.aopDemo.aopUtils&nbsp;=&nbsp;feedsTableView.aop_utils;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>///end</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code>&nbsp; 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>ctrl.title&nbsp;=&nbsp;_titles[indexPath.row];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>self.title&nbsp;=&nbsp;@</code> 
      <code>"&nbsp;"</code> 
      <code>;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[self.navigationController&nbsp;pushViewController:ctrl&nbsp;animated:YES];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>}</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[self.tableView&nbsp;deselectRowAtIndexPath:indexPath&nbsp;animated:YES];</code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

这个时候需要新建一个，维护广告逻辑的类，简单的建立了个\`IMYAOPDemo\`文件，核心代码就是设置数据回调，跟选择插入的位置。

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> 
    <div>
      6 
    </div> 
    <div>
      7 
    </div> 
    <div>
      8 
    </div> 
    <div>
      9 
    </div> 
    <div>
      10 
    </div> 
    <div>
      11 
    </div> 
    <div>
      12 
    </div> 
    <div>
      13 
    </div> 
    <div>
      14 
    </div> 
    <div>
      15 
    </div> 
    <div>
      16 
    </div> 
    <div>
      17 
    </div> 
    <div>
      18 
    </div> 
    <div>
      19 
    </div> 
    <div>
      20 
    </div> 
    <div>
      21 
    </div> 
    <div>
      22 
    </div> 
    <div>
      23 
    </div> 
    <div>
      24 
    </div> 
    <div>
      25 
    </div> 
    <div>
      26 
    </div> 
    <div>
      27 
    </div> 
    <div>
      28 
    </div> 
    <div>
      29 
    </div> 
    <div>
      30 
    </div> 
    <div>
      31 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>-&nbsp;(</code> 
      <code>void</code> 
      <code>)injectTableView</code> 
     </div> 
     <div> 
      <code>{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[self.aopUtils.tableView&nbsp;registerClass:[UITableViewCell&nbsp;</code> 
      <code>class</code> 
      <code>]&nbsp;&nbsp;forCellReuseIdentifier:@</code> 
      <code>"AD"</code> 
      <code>];</code> 
     </div> 
     <div>
       &nbsp; 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>///广告回调，跟TableView的Delegate，DataSource&nbsp;一样。</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>self.aopUtils.delegate&nbsp;=&nbsp;self;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>self.aopUtils.dataSource&nbsp;=&nbsp;self;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code>&nbsp; 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>dispatch_async(dispatch_get_main_queue(),&nbsp;^{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[self&nbsp;insertRows];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>});</code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
     <div> 
      <code>///简单的rows插入</code> 
     </div> 
     <div> 
      <code>-&nbsp;(</code> 
      <code>void</code> 
      <code>)insertRows</code> 
     </div> 
     <div> 
      <code>{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>NSMutableArray*&nbsp;insertBodys&nbsp;=&nbsp;[NSMutableArray&nbsp;array];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>///随机生成了5个要插入的位置</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>for</code>&nbsp; 
      <code>(</code> 
      <code>int</code>&nbsp; 
      <code>i&nbsp;=&nbsp;0&nbsp;;&nbsp;i&lt;&nbsp;5;&nbsp;i++)&nbsp;{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>NSIndexPath*&nbsp;indexPath&nbsp;=&nbsp;[NSIndexPath&nbsp;indexPathForRow:arc4random()&nbsp;inSection:0];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[insertBodys&nbsp;addObject:[IMYAOPTableViewInsertBody&nbsp;insertBodyWithIndexPath:indexPath]];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>}</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>///清空&nbsp;旧数据</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[self.aopUtils&nbsp;insertWithSections:nil];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[self.aopUtils&nbsp;insertWithIndexPaths:nil];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code>&nbsp; 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>///插入&nbsp;新数据,&nbsp;同一个&nbsp;row&nbsp;会按数组的顺序&nbsp;row&nbsp;进行&nbsp;递增</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[self.aopUtils&nbsp;insertWithIndexPaths:insertBodys];</code> 
     </div> 
     <div>
       &nbsp; 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>///调用tableView的reloadData，进行页面刷新</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[self.aopUtils.tableView&nbsp;reloadData];</code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

广告的回调，其实看代码，他们也是继承了TableView Delegate，跟DataSource，保持跟TableView回调的一致性，方便把旧的广告代码迁移过来。

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>@protocol&nbsp;IMYAOPTableViewDelegate&nbsp;;</code> 
     </div> 
     <div> 
      <code>@protocol&nbsp;IMYAOPTableViewDataSource</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

接下来就是要实现TableView的广告回调了， 其实下面两个回调是不会调用的，就是返回数据源数量的回调，因为这个是由业务模块决定的。但是没实现xcode会有警告，所以也可以顺手写上。

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>-&nbsp;(NSInteger)numberOfSectionsInTableView:(UITableView&nbsp;*)tableView;&nbsp;</code> 
     </div> 
     <div> 
      <code>-&nbsp;(NSInteger)tableView:(UITableView&nbsp;*)tableView&nbsp;numberOfRowsInSection:(NSInteger)section;</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

<table> 
 <tbody> 
  <tr> 
   <td> 
    <div>
      1 
    </div> 
    <div>
      2 
    </div> 
    <div>
      3 
    </div> 
    <div>
      4 
    </div> 
    <div>
      5 
    </div> 
    <div>
      6 
    </div> 
    <div>
      7 
    </div> 
    <div>
      8 
    </div> 
    <div>
      9 
    </div> 
    <div>
      10 
    </div> 
    <div>
      11 
    </div> 
    <div>
      12 
    </div> 
    <div>
      13 
    </div> 
    <div>
      14 
    </div> 
    <div>
      15 
    </div> 
    <div>
      16 
    </div> 
    <div>
      17 
    </div> 
    <div>
      18 
    </div> 
    <div>
      19 
    </div> 
    <div>
      20 
    </div> 
    <div>
      21 
    </div> 
    <div>
      22 
    </div> 
    <div>
      23 
    </div> 
    <div>
      24 
    </div> 
    <div>
      25 
    </div> 
    <div>
      26 
    </div> 
    <div>
      27 
    </div> </td> 
   <td> 
    <div> 
     <div> 
      <code>-(UITableViewCell&nbsp;*)tableView:(UITableView&nbsp;*)tableView&nbsp;cellForRowAtIndexPath:(NSIndexPath&nbsp;*)indexPath</code> 
     </div> 
     <div> 
      <code>{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>UITableViewCell*&nbsp;cell&nbsp;=&nbsp;[tableView&nbsp;dequeueReusableCellWithIdentifier:@</code> 
      <code>"AD"</code> 
      <code>];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>if</code> 
      <code>(cell.contentView.subviews.count&nbsp;==&nbsp;0)&nbsp;{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>CGFloat&nbsp;screenWidth&nbsp;=&nbsp;[UIScreen&nbsp;mainScreen].bounds.size.width;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>CGFloat&nbsp;imageHeight&nbsp;=&nbsp;162&nbsp;*&nbsp;(screenWidth/320.0f);</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>UIImageView*&nbsp;imageView&nbsp;=&nbsp;[[UIImageView&nbsp;alloc]&nbsp;initWithFrame:CGRectMake(0,&nbsp;0,&nbsp;screenWidth,&nbsp;imageHeight)];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>imageView.image&nbsp;=&nbsp;[UIImage&nbsp;imageNamed:@</code> 
      <code>"aop_ad_image.jpeg"</code> 
      <code>];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>imageView.layer.borderColor&nbsp;=&nbsp;[UIColor&nbsp;blackColor].CGColor;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>imageView.layer.borderWidth&nbsp;=&nbsp;1;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[cell.contentView&nbsp;addSubview:imageView];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code>&nbsp; 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>UILabel*&nbsp;label&nbsp;=&nbsp;[[UILabel&nbsp;alloc]&nbsp;initWithFrame:CGRectMake(200,&nbsp;100,&nbsp;200,&nbsp;50)];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>label.text&nbsp;=&nbsp;@</code> 
      <code>"不要脸的广告!"</code> 
      <code>;</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[cell.contentView&nbsp;addSubview:label];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>}</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>return</code>&nbsp; 
      <code>cell;</code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
     <div> 
      <code>-(</code> 
      <code>void</code> 
      <code>)tableView:(UITableView&nbsp;*)tableView&nbsp;willDisplayCell:(UITableViewCell&nbsp;*)cell&nbsp;forRowAtIndexPath:(NSIndexPath&nbsp;*)indexPath</code> 
     </div> 
     <div> 
      <code>{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>NSLog(@</code> 
      <code>"插入的cell要显示啦"</code> 
      <code>);</code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
     <div> 
      <code>-&nbsp;(</code> 
      <code>void</code> 
      <code>)tableView:(UITableView&nbsp;*)tableView&nbsp;didSelectRowAtIndexPath:(NSIndexPath&nbsp;*)indexPath</code> 
     </div> 
     <div> 
      <code>{ </code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>UIAlertView*&nbsp;alertView&nbsp;=&nbsp;[[UIAlertView&nbsp;alloc]&nbsp;initWithTitle:@</code> 
      <code>"被点击了&gt;&nbsp;&lt;"</code>&nbsp; 
      <code>message:[NSString&nbsp;stringWithFormat:@</code> 
      <code>"我的位置:&nbsp;%@"</code> 
      <code>,indexPath]&nbsp;delegate:nil&nbsp;cancelButtonTitle:@</code> 
      <code>"哦~滚"</code>&nbsp; 
      <code>otherButtonTitles:nil];</code> 
     </div> 
     <div> 
      <code>&nbsp;&nbsp;&nbsp;&nbsp;</code> 
      <code>[alertView&nbsp;show];</code> 
     </div> 
     <div> 
      <code>}</code> 
     </div> 
    </div> </td> 
  </tr> 
 </tbody> 
</table>

效果图是个gif 如果不会动可以看 git 的readme:

![20160620005310241][]

如果有兴趣可以看具体的源码：[源码传送门][Link 1]

[20160620005315459]: https://img-blog.csdn.net/20160620005315459
[20160620005319679]: https://img-blog.csdn.net/20160620005319679
[20160620005324240]: https://img-blog.csdn.net/20160620005324240
[YYKit]: https://github.com/ibireme/YYKit
[20160620005310241]: https://img-blog.csdn.net/20160620005310241
[Link 1]: https://github.com/li6185377/IMYAOPTableView.git