App Tracking Transparency(ATT)をreact-native-permissionで実装しました
まえがき
iOS14.5から、「App Tracking Transparency（ATT）」機能が実装されました。
これによりユーザーは自分のデータが広告ターゲティングの目的で共有されるかどうかを、アプリごとにコントロールできるようになりました。
App Store Connectの「Appのプライバシー」にて、トラッキング目的に使用するデータを設定している場合、ユーザーに対してトラッキング許諾の確認をする必要があります。
許諾の確認をしていない場合、新しくアプリをリリースすることができません。（審査で落ちます。）
今回はreact-native-permissionsというライブラリを使って、トラッキング許諾を対応しましたので備忘用として実装方法をまとめます。
個人的には初めて1からReactNativeのライブラリを導入したので、今後他のライブラリを導入するときにも参考になりそうないい経験でした。
参考
react-native-permissions
ATT(AppTrackingTransparency)で審査落ちした時のメモ（Guideline 2.1 – Information Needed）
iOS14 - 理解すべき基本知識
iOS14の広告トラッキング許諾に対応した話
手順
react-native-permissionsのsetup
install
$ npm install --save react-native-permissions
# --- or ---
$ yarn add react-native-permissions
"react-native-permissions": "^3.0.3",
v2.2.0からトラッキングはサポートされているようです。
今回は現在の最新であるv3.0.3を入れました。
すでにこのライブラリを入れている場合は、以下の2点は確認しておいたほうがいいです。
- Q．ブレイキングチェンジがあるか
- Q．影響があるか
実際、許諾状態のステータスがガラッと変わってたり、Setupの方法が変わってたりしました。
詳細はRelease Noteを確認してください。
リリース情報が丁寧に書かれていて分かりやすかったです。
XcodeのCustom iOS Target Propertiesを編集
Xcode > myapp > Info > Custom iOS Target Properties
-
- ボタンで新しい項目を追加
- Key nameを NSUserTrackingUsageDescription にする
Info.plistを編集
<key>NSUserTrackingUsageDescription</key>
<string>[トラッキング許諾のダイアログに表示するテキストを入力]</string>
pod install
$ cd ios
$ pod install
成功したらreact-native-permissionsのsetupは完了！
ラッピングしてUtilとして使用できる状態にする
react-native-permissionsはトラッキング許諾以外にもカメラや写真フォルダ等の許諾確認が行えるものなので、今後汎用的に使用できるようにラッピングしてUtilとして使えるようにしました。
import Permissions, { IOSPermission } from 'react-native-permissions';
const status = {
unavailable: 'unavailable',
blocked: 'blocked',
denied: 'denied',
granted: 'granted',
limited: 'limited',
};
const item = {
tracking: Permissions.PERMISSIONS.IOS.APP_TRACKING_TRANSPARENCY,
};
class Permission {
get status() {
return status;
}
get item() {
return item;
}
// permissionの許諾状況の確認 -> 上で定義しているstatusのどれかが返ってくる
async check(permissionItem: IOSPermission) {
try {
return await Permissions.check(permissionItem);
} catch (e) {
console.error(e, 'permission check error');
}
return false;
}
// permissionの許諾確認を1度だけRequestする
async onceRequest(permissionItem: IOSPermission) {
try {
const checked = await Permissions.check(permissionItem);
if (checked === status.denied) {
return await Permissions.request(permissionItem);
}
return checked;
} catch (e) {
console.error(e, 'permission once request error');
}
return false;
}
}
export default new Permission();
ラッピングした関数を呼び出す
import Permission from './permission';
Permission.onceRequest(Permission.item.tracking);
以下のようにダイアログが出ればOKです。
"Your data will be used to measure advertising effciency"となっている箇所がInfo.plistにて編集できるテキストです。
フロー
ライブラリの内部的に、以下のようなフローで動作しています。
よって、一度ダイアログが出たらアプリを再インストールしないかぎりダイアログは出ません。
また、iOSの設定 > プライバシー > トラッキング から、アプリごとに許諾の設定を変更することが可能です。
┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
┃ check(PERMISSIONS.IOS.CAMERA) ┃
┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
│
Is the feature available
on this device ?
│ ╔════╗
├───────────║ NO ║──────────────┐
│ ╚════╝ │
╔═════╗ ▼
║ YES ║ ┌─────────────────────┐
╚═════╝ │ RESULTS.UNAVAILABLE │
│ └─────────────────────┘
Is the permission
requestable ?
│ ╔════╗
├───────────║ NO ║──────────────┐
│ ╚════╝ │
╔═════╗ ▼
║ YES ║ ┌───────────────────┐
╚═════╝ │ RESULTS.BLOCKED / │
│ │ RESULTS.LIMITED / │
│ │ RESULTS.GRANTED │
▼ └───────────────────┘
┌────────────────┐
│ RESULTS.DENIED │
└────────────────┘
│
▼
┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
┃ request(PERMISSIONS.IOS.CAMERA) ┃
┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
│
Does the user accept
the request ?
│ ╔════╗
├───────────║ NO ║──────────────┐
│ ╚════╝ │
╔═════╗ ▼
║ YES ║ ┌─────────────────┐
╚═════╝ │ RESULTS.BLOCKED │
│ └─────────────────┘
▼
┌─────────────────┐
│ RESULTS.GRANTED │
└─────────────────┘
以上です。
Discussion