react native 카카오링크 설정하기 (+APP KEY 숨기기)

1. 사용 라이브러리

1) react-native-kakao-share-link
2) react-native-config

2. .env파일 생성

1) react-native-config 설치 및 guide대로 설정
2) .gitignore에 *.env 추가
   (.env 파일의 APP KEY를 노출시키지 않게 하기 위함)
3) https://developers.kakao.com/
내 애플리케이션 > 앱 선택 > 앱 키의 네이티브 앱 키 사용
4) 최상위 디렉토리에 .env 파일 생성 후 아래 내용 입력

KAKAO_NATIVE_APP_KEY=네이티브 앱 키
KAKAO_NATIVE_APP_KEY_WITH_KAKAO=kakao{네이티브 앱 키}

• 변수명은 자유이며, {}는 빼고 입력
• react-native-kakao-share-link 라이브러리 사용 시 두 개의 변수가 각각 필요하여 변수를 두 개 설정하였지만 AndroidManifest.xml에서 kakao와 네이티브 앱 키를 붙이는 것이 가능하다면 두 번째 변수는 필요 없음
  (두 개의 string을 이어보려고 하였으나 실패하고 포기)

3. Android Studio에서 파일 수정

1) react-native-kakao-share-link의 Android 부분 참고하되, 카카오 네이티브 앱키 부분은 .env의 변수명 사용
2) react-native-config의 guide 중 Native Usage 부분 참고

AndroidManifest.xml 설정

<manifest>
    ...
+   <uses-permission android:name="android.permission.INTERNET" />
    ...
    <application
+     android:allowBackup="true"
      ...>
      <intent-filter>
        <action android:name="android.intent.action.MAIN" />
        <category android:name="android.intent.category.LAUNCHER" />
      </intent-filter>
+     <intent-filter>
+       <action android:name="android.intent.action.VIEW" />
+       <category android:name="android.intent.category.DEFAULT" />
+       <category android:name="android.intent.category.BROWSABLE" />
+       <!--<data android:host="kakaolink" android:scheme="kakao{카카오 네이티브 앱키}" />-->
+       <data android:host="kakaolink"
              android:scheme="@string/KAKAO_NATIVE_APP_KEY_WITH_KAKAO" />
+     </intent-filter>
    </application>
  </manifest>

app/src/main/res/values/string.xml 설정

<resources>
  ...
+   <!--<string name="kakao_app_key">{카카오 네이티브 앱키}</string>-->
+   <string name="kakao_app_key">@string/KAKAO_NATIVE_APP_KEY</string>
  ...
</resources>