Expoを使った多言語アプリでReact Native Google Mobile AdsのATTダイアログを表示する方法
広告表示のための React Native Google Mobile Ads
React Native アプリで広告（Admob）を表示する際、React Native Google Mobile Ads が使えます。
iOS の場合は App Tracking Transparency（以下、ATT）の対応が必要なわけですが、それもライブラリ側で対応してくれています。
１言語のアプリの場合はapp.jsonに以下のように書けばダイアログのメッセージを初期のものから変更して表示することが可能です。
{
...
{
"react-native-google-mobile-ads": {
"android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
"ios_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
"user_tracking_usage_description": "あなたの嗜好に合わせた広告を表示することができるようになります"
}
}
}
ただ、メッセージは１つしか設定できないため、多言語化したアプリだとこれだけでは足りません。
日本語しか表示できなくなってしまいますね。
Expo で ATT メッセージを含んだ info.plist を多言語化する
ATT メッセージは Xcode で開発する場合は info.plist に設定します。
そのため、ATT メッセージの多言語化＝ info.plist の多言語化となります。
Expo では info.plist を多言語化するための設定を app.json でできるようにしてくれています。
{
"expo": {
"ios": {
"infoPlist": {
"CFBundleAllowMixedLocalizations": true
}
},
"locales": {
"ja": "./languages/japanese.json"
}
}
}
このようにCFBundleAllowMixedLocalizationsを true に設定し、localesセクションでロケールごとの設定ファイルへのパスを設定します。
{
"CFBundleDisplayName": "アプリ表示名",
"NSUserTrackingUsageDescription": "関連性の高い広告を表示するためにIDをトラッキングいたします。",
"NSPhotoLibraryUsageDescription": "〇〇に添付する画像を選択するために写真へのアクセスが必要です。"
}
設定ファイルの中はこんな感じで、info.plist に設定する Key と設定する値を組にしておきます。
Xcode での開発時に info.plist を多言語化する際に string ファイルを用意するのと同じですね。
上記設定だと、アプリの表示名（ホーム画面に追加される際のアプリ名）と ATT メッセージ、あと写真の選択時のダイアログメッセージが設定されています。
あとは英語の場合はenのロケールで同様に設定をしてあげれば OK です。
React Native Google Mobile Ads を使っている場合の注意点
これで問題なく多言語化されるはずなのですが、React Native Google Mobile Ads を使っている場合の ATT メッセージだけはちょっと注意点があります。
多言語化のためにlanguages/japanese.jsonを作成したので、以下のuser_tracking_usage_descriptionはなくても動作するように思えます。
むしろ、多言語化されないように見えてしまうので、消したくなるところです。
{
...
{
"react-native-google-mobile-ads": {
"android_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
"ios_app_id": "ca-app-pub-xxxxxxxx~xxxxxxxx",
"user_tracking_usage_description": "あなたの嗜好に合わせた広告を表示することができるようになります"
}
}
}
なのですが、これを消してしまうと ATT のメッセージ自体が設定されなくなってしまうということが発生します。
そのため、多言語化したはずなのに審査に上げたら「メッセージがデフォルトのままだから変えるように」とリジェクトされてしまいます。
ちょっと気持ち悪いのですが、user_tracking_usage_descriptionは残してあげる必要があります。
ちなみに、残しておいても多言語化の設定は生きているようで、ちゃんとそれぞれの言語でのメッセージが表示されます。
宣伝
Admob とか課金の設定・実装を解説した Zenn 本を出してます。
バナー広告のあたりは無料で読めるようになってますので、広告表示したいなぁとか思ってる方は読んでみてください。
Discussion