ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • Swift - iOS앱 구글애드몹 광고 연동 방법
    모바일 앱 개발 2020. 3. 9. 00:51

    iOS앱에 구글애드몹을 연동하고, 구현하는 방법을 간략하게 소개합니다. 

    처음 연동하면서 막혔던 부분 위주로 정리했으며, 초보라... 공식문서를 토대로 기능 구현에 초점을 둔 코드입니다.

     

     

    일반적으로 많이 사용한다고 느꼈던 배너 광고, 전면 광고 2가지를 구현 해보겠습니다.

    대략적인 개념은 다음과 같고, 자세한 내용은 하이퍼링크를 통해 구글 공식 문서 참고 바랍니다. 

    • 배너 광고 : 무료 앱에서 가장 자주보이는 광고 형태, 화면 하단에 광고 상시 노출 
    • 전면 광고 : 화면 전체를 덮는 광고, 주로 특정 조건 도달시 화면을 전환하면서 노출됨 

    애드몹 구현은 크게 세 단계로 같이 진행됩니다.

    1. 애드몹 프로젝트 생성과 키 발급 
    2. Xcode프로젝트와 구글애드몹 프로젝트 연동 
    3. 코드 구현

     

    1. 애드몹 프로젝트 생성 


    코드 작성 전 필요한 단계는 아래와 같습니다.

    3) ~ 7) 단계는 구글 공식문서에 매우 자세하게 정리되어 있으므로, 줄이고 2)까지의 단계를 자세히 다루겠습니다.

    • 1) 구글 애드몹 로그인 후 iOS 프로젝트 생성 
    • 2) 원하는 광고형태로 광고 단위 ID 생성
    • 3) 프로젝트 생성 후 해당 디렉토리에서 pod init 명령어로 pod file 생성
    • 4) pod file내에 pod 'Google-Mobile-Ads-SDK' 입력 후 저장
    • 5) pod install --repo-update 명령어를 통해 구글애드몹이 설치된 xcworkspace 파일 생성
    • 6) info.plist에 프로젝트 생성시 발급받았던 광고ID 키 값 추가
    • 7) 프로젝트 AppDelegate에 구글애드몹 import 

    먼저 구글 애드몹에 로그인 한뒤, [앱 추가] 버튼을 통해 앱을 추가 합니다.

     

    저의 경우 테스트용 앱이기 때문에 스토어 게시여부는 [아니오]를 선택했습니다.

     

    앱 이름을 입력하고, 플랫폼(iOS)를 선택 한 뒤, [추가] 버튼을 누릅니다.

     

    그럼 기본적인 설정은 끝났습니다! 이때 해당 프로젝트의 [앱ID]가 나오는데 한번만 나오므로 꼭 메모해놔야 합니다. 

     

    그럼 본인이 원하는 광고 단위ID를 만들것인지 물어보는데, 저는 전면 광고용 단위ID를 만들어 보겠습니다.

    추후, 애드몹 콘솔에서 단위ID를 만드는 것도 얼마든지 가능합니다.

     

    원하는 광고 단위 이름을 입력하면 Xcode 연동 전에 해야할 작업은 끝납니다.

     

    마지막으로 한번 더 앱ID, 광고 단위ID를 알려줍니다, 추후 연동을 위해 꼭 메모해야 합니다. 

     

    2. Xcode프로젝트와 구글애드몹 연동


    구글애드몹을 연동하는 단계는 아래를 참고해서 진행하면 됩니다. 

    이때 위에서 발급 받았던 광고ID가 필요 합니다 (단위 ID는 추후 코드 작업에서 사용)

    https://developers.google.com/admob/ios/quick-start?hl=ko

     

    시작하기  |  iOS  |  Google Developers

    iOS 앱을 제작 중인 AdMob 게시자를 위한 모바일 광고 SDK입니다.

    developers.google.com

     

    3. 코드 구현 - 배너 광고 


    공식 레퍼런스 : https://developers.google.com/admob/ios/banner?hl=ko

     

    배너 광고는 정말 간단하게 구현 가능합니다. 

    주의할 점은 광고 단위ID에 관한 것인데요. 

     

    구글 문서에도 나와있듯이 개인이 발급 받은 광고 단위ID는 바로 테스트가 불가능한 것 같습니다.

    저도 그랬었고, 이럴 때는 구글에서 제공하는 테스트용 단위ID를 사용하면 바로 가능하므로, 

    광고가 제대로 안나온다면 아래 키 값을 사용됩니다. 

    • ca-app-pub-3940256099942544/2934735716
    import UIKit
    import GoogleMobileAds //구글애드몹 라이브러리 임포트 
    
       class SomeViewController: UIViewController{
       var bannerView : GADBannerView! //배너뷰 객체 생성
       
        override func viewDidLoad() {
            DispatchQueue.main.async { // view 생성시 배너뷰를 불러오는 함수 호출
                self.makeAndPresentBanner()
            }
    	}
        
        func makeAndPresentBanner() {
        	// adSize의 인자값을 변경하여 노출될 광고배너 사이즈 조정 가능 
            bannerView = GADBannerView(adSize: kGADAdSizeLargeBanner)
            addBannerViewToView(bannerView)
            // 본인이 발급받은 광고단위ID 입력
            bannerView.adUnitID = "광고단위ID"
            bannerView.rootViewController = self
            bannerView.load(GADRequest())
        }
    	
        // 생성된 GADBannerView 객체의 포지션을 잡아주는 함수
        func addBannerViewToView(_ bannerView: GADBannerView) {
          bannerView.translatesAutoresizingMaskIntoConstraints = false
          view.addSubview(bannerView)
          view.addConstraints(
            [NSLayoutConstraint(item: bannerView,
                                attribute: .bottom,
                                relatedBy: .equal,
                                toItem: bottomLayoutGuide,
                                attribute: .top,
                                multiplier: 1,
                                constant: 0),
             NSLayoutConstraint(item: bannerView,
                                attribute: .centerX,
                                relatedBy: .equal,
                                toItem: view,
                                attribute: .centerX,
                                multiplier: 1,
                                constant: 0)
            ])
         }
    }

     

    3. 코드 구현 - 전면 광고


    전면 광고도 공식 문서를 참고해 진행하면 되지만, 전면 광고의 생성과 소멸을 주의해야 합니다.

    전면 광고는 한번 생성되고, 소멸되는 일회성 객체이기 때문에 광고 종료와 동시에 새로운 광고 객체를 생성해야 합니다.

     

    또한 배너 광고 단위ID와 마찬가지로 구글에서 제공하는 테스트 단위 ID를 사용해야 바로 테스트 해볼 수 있습니다.

    import UIKit
    import GoogleMobileAds //구글애드몹 라이브러리 임포트 
    
    // 구글에서 제공하는 테스트용 광고단위 ID
    let interstitialID = "ca-app-pub-3940256099942544/4411468910" 
    
    // 전면광고 객체의 Delegate설정을 위해 GADInterstitialDelegate 상속 
    class SomeViewController: UIViewController, GADInterstitialDelegate{ 
           var interestitial : GADInterstitial! // 전면 광고 객체 생성
       
        override func viewDidLoad() {
            DispatchQueue.main.async { // view생성시 함수를 통해 전면광고 호출
            	self.interestitial = self.createAndLoadInterstitial()
            }
          // qos로 전면광고 객체를 먼저 불러온 이후에 전면 광고 노출 조건 확인 
          if checkAdsPopup() == true {
              self.interestitial.present(fromRootViewController: self)
          }
        }
        
        func checkAdsPopup() -> Bool { 
        	// 광고 노출 여부 판단을 위한 코드 
        }
        
        // 전면광고를 로드하여 반환하는 함수
        func createAndLoadInterstitial() -> GADInterstitial {
          let interstitial =
              GADInterstitial(adUnitID: interstitialID )
          interstitial.delegate = self
          interstitial.load(GADRequest())
          return interstitial
        }
        
        // 전면광고를 닫았을때(즉 광고가 끝나는 시점을 트래킹하는 함수) 끝나는 시점을 기준으로 신규 전면광고 생성
        func interstitialDidDismissScreen(_ ad: GADInterstitial) {
            print("play interestitial is finished")
            self.interestitial = createAndLoadInterstitial()
        }
    }

     

    그리고! 전면 광고는 델리게이트를 통해 상태을 쉽게 모니터링할 수 있는데요.

    이를 활용해 상황에 맞게 핸들링이 가능합니다. 공식문서에서 소개하고 있는 예시는 아래와 같습니다.  

    일반적인 view의 생명주기와 비슷하게 광고 노출시점을 기준으로 모니터링이 가능합니다.

    /// 전면광고를 정상적으로 불러오는 경우 
    func interstitialDidReceiveAd(_ ad: GADInterstitial) {
      print("interstitialDidReceiveAd")
    }
    
    /// 전면광고 로드에 실패한 경우
    func interstitial(_ ad: GADInterstitial, didFailToReceiveAdWithError error: GADRequestError) {
      print("interstitial:didFailToReceiveAdWithError: \(error.localizedDescription)")
    }
    
    /// 전면광고가 노출되기 직전 시점
    func interstitialWillPresentScreen(_ ad: GADInterstitial) {
      print("interstitialWillPresentScreen")
    }
    
    /// 전면광고창이 닫히기 직전 시점
    func interstitialWillDismissScreen(_ ad: GADInterstitial) {
      print("interstitialWillDismissScreen")
    }
    
    /// 전면광고창을 닫은 시점
    func interstitialDidDismissScreen(_ ad: GADInterstitial) {
      print("interstitialDidDismissScreen")
    }
    
    /// 전면광고가 포함된 앱이 백그라운드로 이동됐을때
    /// (such as the App Store), backgrounding the current app.
    func interstitialWillLeaveApplication(_ ad: GADInterstitial) {
      print("interstitialWillLeaveApplication")
    }

    댓글

Designed by Tistory.