애드팝콘 SSP SDK 연동가이드
애드팝콘 홈페이지애드팝콘 SSP 콘솔 바로가기
  • 개요
  • Android
    • 기본 설정
    • 배너 광고
    • 전면 광고
    • 전면 비디오 광고
    • 리워드 비디오 광고
    • 보상형 광고 플러스 연동(beta)
    • 네이티브 광고
    • 스플래시 광고
    • 모달 광고
    • 팝콘텐츠 광고
    • 응답 에러 코드 및 샘플 프로젝트
    • 미디에이션 (Android)
    • 네이티브 광고 레이아웃 구성 가이드
      • 직접 설정
      • 템플릿 사용
    • 네이티브 광고 미디에이션 레이아웃 가이드
      • 공통 설정
      • 애드팝콘 SSP
      • FAN (Facebook Audience Network)
      • Admob
      • GAM (Google Ad Manager)
      • ADOP
      • AdForus
      • Mintegral
      • AdFit-Native
      • AdFit-Bizboard
      • Mobon
      • Pangle
      • NAM - GfpNativeAdView + GfpNativeSimpleAdView
      • NAM - GfpNativeSimpleAdView
      • NAM - GfpNativeAdView
      • AppLovinMax
      • Vungle (LiftOff)
      • Coupang CPM
      • Mobwith
    • Adfit Bizboard 연동 가이드
    • AppLovin Max Android Mediation 가이드
    • 릴리즈 노트
  • iOS
    • 기본 설정
      • SDK 수동 설치
    • 배너 광고
    • 전면 광고
    • 전면 비디오 광고
    • 리워드 비디오 광고
    • 보상형 광고 플러스 연동(beta)
    • 네이티브 광고
    • 스플래시 광고
    • 모달 광고
    • 팝콘텐츠 광고
    • 응답 에러 코드 및 샘플 프로젝트
    • 미디에이션 (iOS)
    • 네이티브 광고 레이아웃 구성 가이드
      • 직접 설정
      • 템플릿 사용
    • 네이티브 광고 미디에이션 레이아웃 구성 가이드
      • ApPopcornSSP
      • FAN(Facebook Audience Network)
      • FAN Banner Native
      • AdMob
      • Google AdManager(GAM)
      • ADOP
      • AdForus
      • Mintegral
      • NAM - GfpNativeAdView + GfpNativeSimpleAdView
      • NAM - GfpNativeAdView
      • NAM - GfpNativeSimpleAdView
      • AppLovinMax
      • AdFit-Native
      • AdFit-BizBoard
      • Vungle
    • Adfit Bizboard 연동 가이드
    • AppLovin Max iOS Mediation 가이드
    • 릴리즈노트
  • HybridWeb(하이브리드 Web)
    • 네이티브 Side 연동(Android)
    • 네이티브 Side 연동(iOS)
    • WebPage Side 연동
    • 광고 ID 수동 세팅
  • 하이브리드 Web-Adfit
    • Android
    • iOS
  • Unity
    • Unity (Android)
      • 기본 설정
      • 배너 광고
      • 전면 광고
      • 리워드 비디오 광고
      • 네이티브 광고
      • 보상형 광고 플러스 연동(beta)
      • 미디에이션 Unity Android
    • Unity (iOS)
      • 기본 설정
      • 배너 광고
      • 전면 광고
      • 리워드 비디오 광고
      • 네이티브 광고
      • 보상형 광고 플러스 연동(beta)
      • 미디에이션 Unity iOS
    • 에러 코드
  • React Native(beta)
    • 기본 설정
    • 배너 광고
    • 전면 광고
    • 전면 비디오 광고
    • 리워드 비디오 광고
    • 네이티브 광고
  • Flutter
    • 기본 설정
    • 배너 광고
    • 전면 광고
    • 전면 비디오 광고
    • 리워드 비디오 광고
    • 보상형 광고 플러스 연동(beta)
    • 네이티브 광고
    • 팝콘텐츠 광고
  • Web SDK
  • 테스트 코드
  • 추가 기능 연동가이드
    • 웹 CS 페이지 연동
    • AppLovin Custom Network
      • Android
      • iOS
    • KT Library
  • 커스텀 타입 연동 가이드
    • 커스텀 타입(Android)
    • 커스텀 타입(iOS)
  • 쿠키 매칭
  • 쿠팡 연동가이드
    • 쿠팡 포스트백 연동
    • 쿠팡 EP 리스트 연동
    • 쿠팡 리포트 API 연동
      • 쿠팡 일별 리포트 API
      • 쿠팡 API - Report
      • 쿠팡 API - Product list
  • 원스토어 연동가이드
    • 애드팝콘 SSP SDK for Onestore
    • 원스토어 Ads 래핑 가이드(내부용)
      • 배너 광고
      • 전면 광고
      • 전면 비디오 광고
      • 리워드 비디오 광고
      • 네이티브 광고
      • SSP 미디에이션
      • 에러 코드 및 외부 노출 함수
      • 테스트 지면 키
      • AAR 라이브러리 목록
  • 리포트 API
    • 애드팝콘 SSP Report API
    • DSP Report API
    • Publisher API (Report)
    • Publisher API (Metadata)
    • Adserver Report API
    • Popcontent Report API
  • Reward Banner 스크립트 연동가이드
    • Reward Banner 스크립트 Android
    • Reward Banner 스크립트 iOS
  • Web Header Bidding(WIP)
  • 차단관리 파일 가이드
  • 팝콘텐츠 연동가이드
    • WebView 직접 연동
    • 리워드 콜백
Powered by GitBook
On this page
  • 1. 유저 식별값 입력
  • 2. 팝콘텐츠 페이지 오픈
  • 3. 이벤트 연동
  • 4. 샘플 코드
  • 5. Flutter WebView 활용한 연동.

Was this helpful?

  1. 팝콘텐츠 연동가이드

팝콘텐츠 광고(For GS)

팝콘텐츠(룰렛, 출석체크, 날씨 등) 형태의 페이지와 광고를 하나의 화면에서 제공 합니다.

팝콘텐츠 광고는 Flutter plugin v1.0.9(Android v3.7.4, iOS v2.9.4 이상)부터 지원합니다.

팝콘텐츠 광고를 노출 시키고자 할 경우, 반드시 유저 식별값 설정을 진행해 주어야 합니다.

1. 유저 식별값 입력

유저 식별값은 콘텐츠 광고 페이지내 광고 완료 시 유저에게 정확한 리워드를 지급하기 위해 사용되는 값입니다.

주의 사항

  1. 1명의 유저는 1개의 고유한 유저 식별값을 가져야 하며, 가변적인 값을 사용해서는 안됩니다.

  2. 개인정보(이메일, 이름, 전화번호, 식별 가능한 유저 아이디 등)이 포함되어서는 안됩니다.

  3. 한글, 특수 문자, 공백 등이 포함된 경우에는 반드시 URL 인코딩 처리를 하여 사용하여야 합니다.

  4. openPopContents API를 호출하기 전에 설정되어야 합니다.

위 주의사항에 유의하여 유저 식별값을 입력합니다.

AdPopcornSSP.setUserId('TEST_USN');

2. 팝콘텐츠 페이지 오픈

openPopContents() API를 호출하여 콘텐츠 페이지를 오픈합니다.

Dart
AdPopcornSSP.openPopContents('your_app_key', 'your_placement_id');

3. 이벤트 연동

팝콘텐츠 페이지 이벤트를 받는 설정을 진행할 수 있습니다. 원하는 이벤트만 연동하여 사용하면 됩니다.

Dart
AdPopcornSSP.popContentsAdOpenSuccessListener = () {
};
AdPopcornSSP.popContentsAdOpenFailListener = () {
};
AdPopcornSSP.popContentsAdClosedListener = () {
};
이벤트
설명

AdPopcornSSP.popContentsAdOpenSuccessListener

팝콘텐츠 페이지 오픈 성공

AdPopcornSSP.popContentsAdOpenFailListener

팝콘텐츠 페이지 오픈 실패

AdPopcornSSP.popContentsAdClosedListener

팝콘텐츠 페이지 닫기

4. 샘플 코드

Dart
AdPopcornSSP.openPopContents('your_app_key', 'your_placement_id');
AdPopcornSSP.popContentsAdOpenSuccessListener  = () {
};

AdPopcornSSP.popContentsAdOpenFailListener = () {
};

AdPopcornSSP.popContentsAdClosedListener = () {
};

5. Flutter WebView 활용한 연동.

Flutter webview에서 Javascript 호출을 통해 위에 popContents api를 호출하는 예시입니다.

import 'package:flutter/material.dart';
import 'dart:async';
import 'dart:io' show Platform;

import 'package:flutter/services.dart';
import 'package:adpopcornssp_flutter/adpopcornssp_flutter.dart';
import 'package:webview_flutter/webview_flutter.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});

  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late final WebViewController _webViewController;

  @override
  void initState() {
    super.initState();

    _initializeAdPopcorn();
    _setupWebViewController();
  }

  void _initializeAdPopcorn() {
    if (Platform.isAndroid) {
      AdPopcornSSP.init('436579265');
    } else if (Platform.isIOS) {
      AdPopcornSSP.init('537048423');
    }
    AdPopcornSSP.setUserId('TEST_USN');
  }

  void _setupWebViewController() {
    _webViewController = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted)
      ..addJavaScriptChannel(
        'AdPopcornSSPBridge',
        onMessageReceived: (JavaScriptMessage message) {
          _handleJsMessage(message.message);
        },
      )
      ..loadHtmlString('''
        <!DOCTYPE html>
        <html>
        <head>
          <title>Ad Trigger</title>
          <meta name="viewport" content="width=device-width, initial-scale=1.0">
        </head>
        <body>
          <h3>WebView에서 팝콘텐츠 호출</h3>
          <button onclick="AdPopcornSSPBridge.postMessage('openPopContents')">팝콘텐츠 광고 보기</button>
        </body>
        </html>
      ''');
  }

  void _handleJsMessage(String message) {
    print('WebView JS message: $message');
    if (message == 'openPopContents') {
        if (Platform.isAndroid) {
            AdPopcornSSP.openPopContents('436579265', 'ZlOXGQbuuX');
        }
        else if (Platform.isIOS) {
            AdPopcornSSP.openPopContents('537048423', 'bjJoq2QZcQ');
        }
    }
  }

  Widget _webViewWithBridge() {
    return WebViewWidget(controller: _webViewController);
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('AdPopcornSSP flutter WebView Demo'),
        ),
        body: ListView(
          children: [
            SizedBox(height: 500, child: _webViewWithBridge()),
            const Divider(),
          ],
        ),
      ),
    );
  }
}

Last updated 1 month ago

Was this helpful?