MVC Ads追踪方案咨询：广告浏览、曝光及点击统计实现是否合理？

Let’s break down the strengths of your initial plan, the key gaps you’ll need to address, and a refined, more reliable solution.

What’s Working Well in Your Current Approach #

• Separating tracking logic into distinct methods (Updatebannerviews, UpdateBannerClicks, UpdateBannerImpressions) is a smart organizational choice—it keeps code maintainable and easy to extend later.
• Focusing on core metrics (views, impressions, daily clicks/impressions) aligns with standard ad tracking best practices, so your goals are on target.

Key Issues & Gaps to Fix #

1. View Count Inflation
   Your current GetBanners action adds a view record when the server returns the ad data, but this counts a "view" even if the user never scrolls to see the ad (e.g., if the banner is below the fold). This will overcount views unless you define "Views" strictly as server-side ad requests. If you want views to reflect user engagement, this metric overlaps with impressions and may be redundant.

2. Click Tracking Race Condition
   The <a onclick="ClickMethod()" href="@item.TargetUrl"> setup creates a problem: when the user clicks, the browser starts navigating to the target URL immediately, which often aborts the AJAX call to ClickMethod before it completes. This leads to lost click data.

3. Impressions Tracking Isn’t Hooked Up
   You have an Impressions action, but there’s no frontend logic to trigger it when the ad enters the user’s viewport. Without visibility detection, this metric won’t work as intended.

4. Missing Daily Metric Support
   Your tracking methods don’t include timestamps or date filtering, so you won’t be able to calculate "今日曝光量" (today’s impressions) or "今日点击量" (today’s clicks) later. You need to store a UTC timestamp with every tracking entry.

Optimized Technical Solution #

Let’s refine this with frontend and backend improvements:

Backend Adjustments #

1. Track Individual Banners & Timestamps
   Update your tracking methods to associate records with specific banner IDs and timestamps:

   public void UpdateBannerViews(int bannerId)
   {
       // Insert into UserAds: BannerId = bannerId, Type = "View", Timestamp = DateTime.UtcNow
   }
   
   public void UpdateBannerClicks(int bannerId)
   {
       // Insert into UserAds: BannerId = bannerId, Type = "Click", Timestamp = DateTime.UtcNow
   }
   
   public void UpdateBannerImpressions(int bannerId)
   {
       // Insert into UserAds: BannerId = bannerId, Type = "Impression", Timestamp = DateTime.UtcNow
   }
   

   To get daily metrics, query the UserAds table filtered by Timestamp.Date == DateTime.UtcNow.Date and the relevant banner ID.

2. Fix Click Tracking with Server-Side Redirect
   Replace the client-side onclick with a server-side action that records the click before redirecting:

   public ActionResult TrackClick(int bannerId, string targetUrl)
   {
       UpdateBannerClicks(bannerId);
       return Redirect(targetUrl); // Ensure the user lands on the target after tracking
   }
   

Frontend Improvements #

1. Update Click Tracking Markup
   Point your links to the new tracking action instead of the direct target URL:

   @foreach (var item in Model)
   {
       <tr>
           <td>
               <a href="@Url.Action("TrackClick", new { bannerId = item.Id, targetUrl = item.TargetUrl })">
                   <img src="@item.ImageUrl" data-banner-id="@item.Id" class="banner-ad" />
               </a>
           </td>
       </tr>
   }
   

   This eliminates the race condition by ensuring the click is recorded before navigation.

2. Implement Impression Tracking with Intersection Observer
   Use the modern Intersection Observer API to detect when the ad enters the viewport (performant and reliable):

   document.addEventListener('DOMContentLoaded', function() {
       const bannerAds = document.querySelectorAll('.banner-ad');
       const observer = new IntersectionObserver((entries) => {
           entries.forEach(entry => {
               if (entry.isIntersecting) {
                   const bannerId = entry.target.dataset.bannerId;
                   // Send impression request with keepalive to avoid abort on navigation
                   fetch('@Url.Action("Impressions")', {
                       method: 'POST',
                       headers: {
                           'Content-Type': 'application/json',
                           'X-CSRF-TOKEN': '@Html.AntiForgeryToken()' // Don't skip CSRF protection
                       },
                       body: JSON.stringify({ bannerId: bannerId }),
                       keepalive: true
                   });
                   // Stop observing after first impression to avoid duplicates
                   observer.unobserve(entry.target);
               }
           });
       }, { threshold: 0.5 }); // Adjust threshold (e.g., 0.5 = 50% of ad visible)
   
       bannerAds.forEach(ad => observer.observe(ad));
   });
   

   Update your Impressions action to accept the banner ID:

   [HttpPost]
   [ValidateAntiForgeryToken]
   public ActionResult Impressions(int bannerId)
   {
       UpdateBannerImpressions(bannerId);
       return Json("Success", JsonBehavior.AllowGet);
   }
   

3. Refine View Tracking
   If "Views" mean server-side ad requests, update GetBanners to track each banner individually:

   public ActionResult GetBanners()
   {
       List<BannerImage> bannerImages = new List<BannerImage>();
       // Populate bannerImages...
   
       foreach (var banner in bannerImages)
       {
           UpdateBannerViews(banner.Id);
       }
   
       return View(bannerImages);
   }
   

   If "Views" should reflect user visibility, drop this metric and rely on impressions instead to avoid duplication.

Additional Best Practices #

• Prevent Duplicate Impressions: Use localStorage to track which banners a user has already had impressions for, so scrolling up/down doesn’t inflate counts.
• Error Handling: Add frontend error logging for failed tracking requests to identify issues with data collection.
• Performance: Intersection Observer is far more efficient than scroll event listeners—avoid using scroll events unless you have legacy browser support needs.

Final Thoughts #

Your initial plan has solid foundations, but the key fixes are:

• Using server-side redirects for click tracking to avoid lost data.
• Implementing Intersection Observer for reliable impression detection.
• Adding timestamps and banner IDs to all tracking entries for daily metric calculations.

These changes will make your tracking data accurate, reliable, and aligned with industry standards.

内容的提问来源于stack exchange，提问作者Billy