React Native Codepush 서비스 종료(?)로 standalone으로 변경

 

 

앱센터가 서비스 종료를 한다는 공지를 보았다ㅠㅠ

 

 

 

그래서 평소에 문의를 자주 했었던 담당자에게 진짜 서비스를 종료하나? 대체제가 있냐고 메일을 보냈었다.

 

이틀뒤에 답변이 왔었는데

 

 

 

 

 알려줄순 없지만 대체제를 준비중이다! 라고 들었다.

 

(메뉴얼 제공한다는 공지도 봐서 있으면 달라했더니 준비되면 준다고 하더라)

 

그리고 따로 답변은 하지않았는데 5월에 메일이 전달 잘되었는지 확인 메일이 왔었다.

(예전에 설치Metrics 적재수가 이상해서 문의 메일을 자주 보냈었는데 너무 친절한 담당자였다. 답변도 빠르고!!)

 

그리고 9월에 code-push-standalone 관련해서 메일이 왔었다.

 

그리고 다른일이 바빠서 계속 보류(사실 까먹음) 하고있다가 12월에 작업을 시작했다.

 

 

https://github.com/microsoft/code-push-server

GitHub - microsoft/code-push-server: Standalone CodePush server from App Center

 

 

이 라이브러리를 이용해서 서버를 구동하고 azure에서 제공하는 blob storage(azurite)에 번들파일을 저장해서 내려받는식으로 바뀌는거같다.

 

그래서 서버에 node서버와 azurite 설치 후에 각각 도메인을 따고 로그인을 해야하는데 생각해보니 계정은??

(앱센터 계정은 안될꺼아냐..?)

 

 

https://github.com/microsoft/code-push-server/tree/main/api#oauth-apps

code-push-server/api at main · microsoft/code-push-server

 

oauth로 2가지 방법이 있는데 github과 azure 인데 난 azure 젬병이니

 

github으로 선택했다.

 

 

 

내 앱의 호스트와 로그인 콜백을 등록 한 뒤에

 

cli를 이용해서 로그인을 시도해보면

 

code-push-standalone login {내 서버}

(내 서버를 비우면 localhost로 시도함, 그러면 codepush server를 local에 실행해둬야함)

 

 

 

 

이런 사이트가 하나 뜬다. 저기서 github를 이용하면 accessKey를 주는데

 

그거를 로그인 cli 를 입력했던곳에 붙여넣기 하면 로그인 성공

 

 

어때요 참쉽죠?

 

 

그다음으로 진행 할 것은 앱 생성, 그 이후에 deploytment 생성이다.

 

처음에 커맨드에 code-push-standalone를 쳐보자

(안나오면 github에 cli 설치하기)

 

 

익숙한게 나올것이다.

 

여기서

code-push-standalone app add {앱네임}

 

를 쳐보자

 

그러면 앱네임 생성 성공과 함께 Production, Staging 용 deployment Key가 생성 될 것이다.

(다른이름으로도 추가 가능하다 굳이 Prod,Staging 안써도 된다!)

 

이게 스테이징, 운영용 배포키이다. 중요한거다 유출이 되면안된다.

 

나는 앱네임을 test 로 만들었다.

 

code-push-standalone deployment ls test

 

라고 검색하면 프로필별로 나올것이다.

 

 

 

내가 key를 까먹었으면 뒤에 -k 를 붙이면 된다.

 

여기서 Update Metadata는 내가 코드푸시를 올린 최근라벨이 나올것이다.

 

Install Metrics는 설치정보가 나오는데 active와 Rollback 퍼센테이지가 나온다.

 

아쉽게도 standalone은 azure를 사용해서 redis 캐시서버를 붙여야만 적재가 된다.

 

하지만 난 개인서버에 올려놨기때문에 Metrics관련은 내가 api를 따로 만들어야한다.

 

그리고 설치실패가 발생해서 앱이 재시작되었을때는 설치를 시도하면 안되는데 Metrics정보가 없으니

 

이것 또 한 별도로 만들어야한다.

 

그리고 이제 해야할점은 

 

#안드로이드
#strings.xml

<string moduleConfig="true" name="CodePushServerUrl">내 서버주소(standalone설치한거)</string>



#ios
#info.plist

<key>CodePushServerURL</key>
<string>내 서버주소(standalone설치한거)</string>

 

를 추가한다.

그리고 codepush 코드를 조금 더 수정해야한다.
(참고로 난 codepush sync 사용을 하지않는다)

const update = await codePush.checkForUpdate();

 

deploymentKey를 넣지않아도 plist나 strings.xml에서 잘 셋팅이 되었는데 이상하게 되지않았다.

 

그런데 배포키를 확인하라는 오류가 나길래 깊게 들어가서 확인하기엔 번거로워서

(옵셔널 인자값인데 강제로 넣을수밖에 없다..)

 

       const dpKey = Platform.OS === 'ios' ? Config.IOS_DEPLOYMENT_KEY : Config.AOS_DEPLOYMENT_KEY;
        if(!dpKey){
            return;
        }
        const update = await codePush.checkForUpdate(dpKey);

 

이렇게 때워버렸다.

 

그리고 여기서 또 한가지 문제점이 나왔는데

 

checkForUpdate api가 수행되면 응답값을 확인해보면

 

 

지금은 업데이트 할 게 없어서 이렇게 나오지만 만약에 있다고 하면 다운로드할 번들파일의 상세정보가 나오는데

 

여기서 download_url이 localhost:10000 으로 azurite 포트가 찍히는데 왜 localhost로 찍히는지는 모르겠다.

 

깃헙issue에서 replace를 해야한다고 해서 

 

update.downloadUrl = update.downloadUrl.replace("http://127.0.0.1:10000", Config.MY_CODEPUSH_URL);

 

이렇게 변경을 해주었다.

 

그리고 변경한 url를 크롬에 넣어보면 번들파일이 다운로드 되는걸 확인이 된다.

 

그리고 다운로드나 설치 실패가 발생했을 땐

 

 setCodePushUpdateState('INSTALL_ERROR');
 setData("FAIL_CODEPUSH", update.label);
  codePush.restartApp(false);

(대충 state나 mmkv나 asyncStorage나 zustand에 넣어두자..)

 

미적용으로 재시작 한후에 mmkv에 실패한 라벨정보를 넣어두었다.

 

아무래도 올렸던 코드푸시에 롤백수가 많아지게 되면 수정해서 다시 올리던지 해당 코드푸시를 비활성화 해야하기 때문에

 

metrics정보는 꼭 필요하다.

 

(기존에 appcenter metrcis 는 이렇게 나온다.)

 

 

그리고 코드푸시를 올려보자

 

code-push-standalone release-react {deploytment 이름} ios -t '버전' -d Staging --description "패치내용"

 

여기에 -m을 넣으면 필수설치이다.

 

나는 필수설치일때는 다운로드 프로그레스바 화면으로 전환을 한뒤에 설치가 완료되면 즉시 설치를 수행하게 해두었다.

 

const installType = update.isMandatory ? codePush.InstallMode.IMMEDIATE : codePush.InstallMode.ON_NEXT_RESTART;
update
.//다운로드관련 코드
.then(localPackage => {
	localPackage.install(installType)
	//기타 코드   
})

 

로그를 확인해보자

 

code-push-standalone deployment ls {내 deployment이름}

최근 코드푸시 정보

 

 

얼렁뚱땅 완료!