A API WebView para anúncios permite a monetização de anúncios no app usando
WebViewController
.
Se você mostrar conteúdo da Web que implementa anúncios com o
código do AdSense ou a
Tag do editor do Google
no seu app pela WebViewController
, use essa API para ativar a monetização de anúncios. Para saber mais, consulte as
Políticas do AdSense e do Ad Manager.
- Gerar receita fazendo solicitações de anúncios com o SDK dos anúncios para dispositivos móveis do Google
Para gerar receita com seu app, faça solicitações de anúncios à O Ad Manager com o SDK de anúncios para dispositivos móveis do Google implementa formatos de anúncios para apps para dispositivos móveis.
- Gerar receita usando a API WebView para anúncios
Caso seu app use
WebViewController
para mostrar conteúdo da Web que veicula anúncios do Ad Manager ou do AdSense, utilize a API WebView para anúncios para registrar objetosWebViewController
com o SDK dos anúncios para dispositivos móveis do Google. O JavaScript no código do AdSense ou na Tag do editor do Google cria e envia solicitações de anúncios para que você não precise fazer solicitações de anúncios com o SDK. Lembre-se de que somente os formatos de inventário da Web para dispositivos móveis e para computadores estão disponíveis usando essa API.Mesmo que você não tenha o conteúdo da Web em um
WebViewController
, ainda recomendamos usar essa API para ajudar a proteger anunciantes contra spam e melhorar a monetização para os editores da Web que forneceram o conteúdo.
É possível usar qualquer uma das opções (ou até ambas) no mesmo app.
Este guia ajuda a integrar a API WebView para anúncios no seu app iOS.
Antes de começar
Antes de começar a usar a API WebView para anúncios, faça o seguinte:
- Use o plug-in do SDK dos anúncios para dispositivos móveis do Google para Flutter com a versão 3.0.0 ou mais recente no seu app.
- Adicione
webview_flutter
como uma dependência no seu arquivopubspec.yaml
. - Adicione a
webview_flutter_android
com a versão 3.7.0 ou mais recente no seu app.
Ignorar a verificação do identificador do aplicativo
Android
Adicione a seguinte tag <meta-data>
no arquivo AndroidManifest.xml
para ignorar a verificação de APPLICATION_ID
. Se você perder essa etapa, o SDK
dos anúncios para dispositivos móveis do Google poderá gerar uma
IllegalStateException
na inicialização do app.
<!-- Bypass APPLICATION_ID check for WebView API for Ads -->
<meta-data
android:name="com.google.android.gms.ads.INTEGRATION_MANAGER"
android:value="webview"/>
iOS
Atualize o arquivo Runner/Info.plist
com o valor de chave e string abaixo para
ignorar uma verificação de GADApplicationIdentifier
. Se você perder essa etapa,
o SDK dos anúncios para dispositivos móveis do Google poderá gerar uma GADInvalidInitializationException
na inicialização do app.
<!-- Bypass GADApplicationIdentifier check for WebView API for Ads -->
<key>GADIntegrationManager</key>
<string>webview</string>
Registrar o WebViewController
Para melhorar a monetização de anúncios no app em uma
WebViewController
que usa o código do
AdSense ou as Tags do editor do
Google, siga as etapas
listadas abaixo:
Ative o JavaScript no
WebViewController
. Se isso não for feito, os anúncios não serão carregados.Para melhorar a experiência dos usuários com anúncios e manter a consistência com a política de cookies do Chrome, ative os cookies de terceiros na instância
AndroidWebViewController
.Registre a instância do
WebViewController
chamando o métodoregisterWebView()
fornecido pelo SDK dos anúncios para dispositivos móveis do Google.
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:webview_flutter_android/webview_flutter_android.dart';
@override
class WebViewExampleState extends State<WebViewExample> {
late final WebViewController controller;
@override
void initState() {
super.initState();
createWebView();
}
void createWebView() async {
controller = WebViewController();
// 1. Enable JavaScript in the web view.
await controller.setJavaScriptMode(JavaScriptMode.unrestricted);
// 2. Enable third-party cookies for Android.
if (controller.platform is AndroidWebViewController) {
AndroidWebViewCookieManager cookieManager = AndroidWebViewCookieManager(
const PlatformWebViewCookieManagerCreationParams());
await cookieManager.setAcceptThirdPartyCookies(
controller.platform as AndroidWebViewController, true);
}
// 3. Register the web view.
await MobileAds.instance.registerWebView(controller);
}
}
Carregar o URL
Agora você pode carregar um URL e mostrar seu conteúdo da Web pelo WebViewController
.
Recomendamos que você carregue este URL de teste: https://webview-api-for-ads-test.glitch.me/
para testar a integração antes de usar seu próprio URL. A página da Web vai mostrar um erro se o JavaScript não estiver ativado.
import 'package:google_mobile_ads/google_mobile_ads.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:webview_flutter_android/webview_flutter_android.dart';
@override
class WebViewExampleState extends State<WebViewExample> {
late final WebViewController controller;
@override
void initState() {
super.initState();
createWebView();
}
void createWebView() async {
controller = WebViewController();
// 1. Enable JavaScript in the web view.
await controller.setJavaScriptMode(JavaScriptMode.unrestricted);
// 2. Enable third-party cookies for Android.
if (controller.platform is AndroidWebViewController) {
AndroidWebViewCookieManager cookieManager = AndroidWebViewCookieManager(
const PlatformWebViewCookieManagerCreationParams());
await cookieManager.setAcceptThirdPartyCookies(
controller.platform as AndroidWebViewController, true);
}
// 3. Register the web view.
await MobileAds.instance.registerWebView(controller);
// 4. Load the URL.
await controller.loadRequest(Uri.parse('https://webview-api-for-ads-test.glitch.me/'));
}
O URL de teste mostrará barras de status verdes para uma integração bem-sucedida se as seguintes condições se aplicarem:
- A extensão
WebView
está conectada ao SDK dos anúncios para dispositivos móveis do Google - JavaScript ativado
- Cookies de terceiros funcionam (não esperado em dispositivos iOS)
- Os cookies primários funcionam
Confira o código-fonte
do nosso URL de teste. Em seguida, substitua o URL de teste pelo seu URL. Você também pode
usar uma ferramenta de proxy, como Charles, para capturar o
tráfego HTTPS do app e inspecionar as solicitações de anúncios para um parâmetro &scar=
.