Capgo 채널 스루핑: 런타임에서 업데이트 채널을 Switch하는 방법

업데이트 채널을 전환하여 특정 사용자에게 즉시 변경 사항을 배포하고 피드백을 받으려면 어떻게 해야 하나요?

업데이트를 전송하기 전에 사용자에게 새로운 빌드를 다운로드하고 설치하도록 요청하는 것이 불편했습니다.

고객이 요청한 개선 사항을 빠르게 구현할 수 있었습니다. 그러나 결과를 고객에게 전달하여 검증할 수 있도록 업데이트를 전송하는 것은 실험적인 변경이 위험하다는 것을 의미했고, 고객에게 전용 빌드를 생성하는 것은 모두에게 부담이 되었습니다.

개발자들은 다양한 사용자 그룹에 대해 다른 업데이트를 제공하고 싶었습니다. 예를 들어 비기술적인 이해관계자, QA, 또는 적절한 경우 전체 사용자에게.

그것이 바로 채널 스루핑 을 가능하게 해줍니다. 사용자의 기기에 설치된 앱은 런타임에 업데이트 채널을switch할 수 있으므로, 프로덕션 앱을 리뷰 및 반복적인 작업 공간으로 변환하는 대신 고정된 엔드포인트가 됩니다. 이 기능은 특히 비기술적인 이해관계자와 프로덕션 앱을 작업하는 경우 유용합니다. 사용자가 이미 설치한 앱에서 변경 사항을 테스트하고 직접 피드백을 제공할 수 있기 때문입니다.

업데이트 채널 이해하기

업데이트 채널은 Capgo이 특정 빌드에 대한 업데이트를 목표로 하는 방법입니다. 각 빌드는 채널과 관련이 있으며, 그 채널은 받을 수 있는 업데이트를 결정합니다.

예를 들어, 사용자에게 영향을 미치지 않는 채널에 업데이트를 게시할 수 있습니다. 과거에는 채널을switch하기 위해 다른 네이티브 빌드를 설치하거나 수동으로 장치 할당을 변경해야했습니다. preview __CAPGO_KEEP_0__의 채널은 다음과 같은 기능을 제공합니다: production특정 사용자 그룹에 대한 다양한 기능을 대상으로합니다.

Channels in Capgo allow you to:

새로운 기능을 점진적으로 출시합니다.
업데이트 채널
업데이트 채널
__CAPGO_KEEP_0__ 베타 테스트 프로그램을 만들기
개별 사용자와의 프로덕션 문제를 디버그하기

업데이트 채널에 대해 익숙하지 않다면, Capgo 채널 문서에서 더 자세히 설명되어 있습니다. 채널 서핑이란 무엇인가?

채널 서핑은 설치된 앱이 재설치 없이 다른 업데이트스트림으로부터 업데이트를 pulls 할 수 있도록 해줍니다. 설치된 앱은 런타임에 업데이트 채널을 switch 할 수 있고, 새로 선택한 채널에서 업데이트를 계속 받을 때까지 앱이 삭제되거나 다른 채널로 switch 될 때까지.

실제로, 제품 관리자나 QA는 예를 들어,

채널로 빌드를 switch 할 수 있고, 최신 변경 사항을 테스트할 수 있습니다. 테스트가 끝나면 다시 production 채널로 switch 할 수 있습니다. 재설치나 별도의 프리뷰 빌드가 필요하지 않습니다. preview 채널 서핑의 내부 동작은 앱이 업데이트 클라이언트에 사용할 채널을 알려주는 것입니다. 이 선택은 런타임에 변경될 수 있고, 삭제되거나 대체될 때까지 유지됩니다. production __CAPGO_KEEP_0__ 채널을 사용하여 빌드를 switch 할 수 있습니다.

__CAPGO_KEEP_0__ 채널을 사용하여 빌드를 switch 할 수 있습니다.

How to Implement Channel Surfing

채널 서핑을 시도하기 전에, 프로젝트가 Capgo Live Updates와 설정되어 있어야 합니다. 이를 설정하려면 Capgo Live Updates의 빠른 시작 가이드를 따르세요. Capgo Live Updates의 빠른 시작 가이드.

채널 서핑을 위해 필요한 설정은 각 채널에서 '장치가 자체적으로 연결되도록 허용'을 활성화하는 것입니다. 이를 Capgo Live Updates의 대시보드에서 수행하세요. code Live Updates의 변경이나 설정 수정이 필요 없습니다.

채널 서핑의 핵심은 단일 API 호출에 의해 구동됩니다.

import { CapacitorUpdater } from '@capgo/capacitor-updater';

await CapacitorUpdater.setChannel({ channel: 'your-channel' });

이것은 Capgo Live Updates에서 업데이트를 조회할 때 사용하는 채널을 설정합니다. API Live Updates의 setChannel에 대해 더 알아보세요..

채널 전환 (v5.34.0+)

플러그인 버전 5.34.0, 6.34.0, 7.34.0, 또는 8.0.0 (대부분 버전)에 따라 (대부분 버전에 따라), setChannel() 채널 전환은 훨씬 빠르게 작동합니다.

백엔드 유효성 검사 (읽기 전용): Capgo 백엔드에 요청을 보내 Capgo 채널이 허용되는지 유효성 검사합니다.
로컬 스토리지 업데이트: 유효성 검사 통과 시, 채널은 장치의 로컬 스토리지에 저장됩니다.
즉시 효과: 다음 업데이트 체크에서는 새로운 채널을 즉시 사용합니다.

이전에는 setChannel() API 백엔드 데이터베이스 (예: API 변경 사항 또는 대시보드)에서 채널 오버라이드 저장했습니다. 장치들은 백엔드 복제가 완료될 때까지 (최대 2분) 새로운 채널이 인식되기까지 기다려야 했습니다. 새로운 동작은 유효성 검사만 백엔드에서 읽고 로컬에서 저장하기 때문에 채널 Switching이 즉시 발생합니다.

채널 Switching 완전한 흐름

사용자 경험을 개선하기 위해, 채널 Switching만 하고 다음 앱 재시작을 기다리기보다 일반적으로 더 많은 작업을 수행하고 싶습니다. 일반적인 접근 방식은 즉시 업데이트를 확인하고, 다운로드가 가능하면 다운로드하고, 앱을 다시 로드하여 사용자가 선택한 채널의 업데이트로 직접 이동하도록 합니다.

일반적인 흐름은 다음과 같습니다.

채널 변경 (setChannel)
업데이트 확인 (getLatest)
업데이트를 가져와 적용 (download, set 또는 next)
앱을 다시 로드할 필요가 있는 경우 (reload)

이것이 완전한 예시입니다:

import { CapacitorUpdater } from '@capgo/capacitor-updater';

async function switchChannel(selectedChannel: string) {
  try {
    // 1. Set the updates channel (with optional auto-update trigger)
    await CapacitorUpdater.setChannel({
      channel: selectedChannel,
      triggerAutoUpdate: true // Immediately check for updates
    });

    console.log(`Switched to channel: ${selectedChannel}`);

    // If you want more control, handle the update manually:
    // const latest = await CapacitorUpdater.getLatest();
    // if (latest.url) {
    //   const bundle = await CapacitorUpdater.download({
    //     url: latest.url,
    //     version: latest.version
    //   });
    //   await CapacitorUpdater.set({ id: bundle.id });
    // }

  } catch (error) {
    console.error('Failed to switch channel:', error);
  }
}

// Switch to the beta channel
switchChannel('beta');

이 흐름을 어떻게 구조화할지는 여러분의 선택입니다. 이러한 단계를 여러 상호 작용에 걸쳐 나누거나 한 번에 모두 실행할 수 있습니다. 흐름을 구조화하는 방법에 관계없이, 실패를 고려하십시오. 네트워크 문제나 유효하지 않은 채널은 모두 업데이트를 적용하는 것을 방지할 수 있습니다.

단 하나의 요구 사항: 자체 할당 활성화

이것이 채널 스루핑을 활성화하는 데 필요한 유일한 일입니다. 앱이 채널을 switch하기 전에 setChannel()채널의 자체 할당을 Capgo 대시보드에서 활성화해야 합니다:

다음으로 이동하세요: 채널 Capgo 내 섹션
__CAPGO_KEEP_0__ 내 섹션에서 채널 이름을 클릭하세요.
활성화 “Allow devices to self associate”
변경 사항을 저장하세요.

채널 설정에서 스스로 할당을 활성화하세요.

앱에서 설정 변경이 필요 없습니다. 단지 채널에서 스스로 할당을 활성화하세요. defaultChannel 이 설정이 비활성화된 경우, 이 채널을 호출하는 시도는 실패하고 이벤트는 발생합니다.

채널 목록 setChannel() __CAPGO_KEEP_0__ 내 섹션에서 채널 이름을 클릭하세요. channelPrivate 이 설정이 비활성화된 경우, 이 채널을 호출하는 시도는 실패하고 이벤트는 발생합니다.

__CAPGO_KEEP_0__ 내 섹션

채널 목록을 가져와 자체 할당을 위해 사용할 수 있는 채널을 확인할 수 있습니다:

const { channels } = await CapacitorUpdater.listChannels();

console.log('Available channels:', channels.map(c => c.name));
// Use this to build a channel selector UI

이것은 자체 할당이 활성화된 채널만 반환합니다.

현재 채널 가져오기

장치가 현재 할당된 채널을 확인하려면:

const { channel } = await CapacitorUpdater.getChannel();

console.log('Current channel:', channel);

기본 채널로 되돌리기

기본 채널로 되돌아가기 위해 채널 오버라이드 제거하고:

await CapacitorUpdater.unsetChannel({});

이것은 장치를 특정 채널에 할당된 채널에서 해제하고, 기본 defaultChannel 설정에서 또는 클라우드 기본값에서 다시 돌아갑니다.

채널 스루핑 테스트 방법

채널 스루핑을 실제로 확인하려면, @capgo/capacitor-updater API은 릴리스 빌드에만 설계되었습니다. 디버그 빌드의 경우, 앱은 일반 업데이트 흐름을 우회하는 개발 서버에서 자바스크립트를 로드하는 대신,

기본 요구 사항

The only requirement for channel surfing is enabling “__CAPGO_KEEP_0__을 위한 장치에 대한 자체 연결 허용” on each channel you want to allow switching to. No config changes are needed in your app.

테스트 빌드 생성

Build your app as usual:

bun run build && npx cap sync

그 다음 Xcode 또는 Android Studio를 사용하여 네이티브 빌드를 생성하거나 CI/CD pipeline을 사용하세요. 앱은 Capgo 대시보드에서 설정된 클라우드 기본 채널에 따라 시작됩니다.

다양한 채널에 대한 업데이트를 게시하는 방법

Once the app is installed, publish updates to different channels:

# Publish to preview channel
npx @capgo/cli@latest bundle upload --channel preview

# Publish to production channel
npx @capgo/cli@latest bundle upload --channel production

그 다음 앱 내의 채널 전환 UI로 이동하여 채널 전환을 트리거하세요. 선택한 채널에서 업데이트를 가져와 새 업데이트로 로드해야 합니다.

채널 전환 UI 빌드

채널 전환은 일반적으로 사용자에게 노출시키고 싶지 않은 기능입니다. 예를 들어, 인증된 직원만이 앱을 프리뷰 채널로 전환하는 버튼을 사용할 수 있습니다.

채널 전환 UI 예제

import { useState, useEffect } from 'react';
import { CapacitorUpdater } from '@capgo/capacitor-updater';

export function ChannelSwitcher() {
  const [currentChannel, setCurrentChannel] = useState<string>('');
  const [availableChannels, setAvailableChannels] = useState<string[]>([]);
  const [isLoading, setIsLoading] = useState(false);

  useEffect(() => {
    loadChannelInfo();
  }, []);

  async function loadChannelInfo() {
    const { channel } = await CapacitorUpdater.getChannel();
    setCurrentChannel(channel || 'default');

    const { channels } = await CapacitorUpdater.listChannels();
    setAvailableChannels(channels.map(c => c.name));
  }

  async function handleChannelSwitch(channel: string) {
    setIsLoading(true);
    try {
      await CapacitorUpdater.setChannel({
        channel,
        triggerAutoUpdate: true
      });
      setCurrentChannel(channel);
      // App will update in background or on next restart
    } catch (error) {
      console.error('Failed to switch channel:', error);
    } finally {
      setIsLoading(false);
    }
  }

  return (
    <div>
      <p>Current channel: {currentChannel}</p>
      <div>
        {availableChannels.map(channel => (
          <button
            key={channel}
            onClick={() => handleChannelSwitch(channel)}
            disabled={isLoading || channel === currentChannel}
          >
            Switch to {channel}
          </button>
        ))}
      </div>
    </div>
  );
}

OTA 업데이트 주의사항

__CAPGO_KEEP_0__의 업데이트는 채널을 전환하는 동안 나타나는 일반적인 문제가 아님에도 불구하고, 채널을 전환하는 즉시 이러한 문제가 드러나기 시작합니다.

런타임 버전 불일치

Capgo의 업데이트는 네이티브 앱 버전과 연관되어 있습니다. 네이티브 버전이 업데이트된 버전과 일치하지 않으면 업데이트가 다운로드되거나 적용되지 않습니다. 채널을 전환하는 경우 일반적으로 앱이 채널을 전환하지만 업데이트가 적용되지 않는데, 실제로 업데이트가 존재하는 채널에 업데이트가 존재하는 경우에 나타납니다.

이 일반적으로 네이티브 앱의 업데이트가 다른 네이티브 버전으로 게시된 경우입니다. 채널의 번들 파일이 기기에 설치된 네이티브 버전과 호환되는지 확인하십시오.

업데이트 삭제 또는 취소

앱이 이미 채널에 대한 업데이트를 다운로드한 경우, Capgo 대시보드에서 업데이트를 삭제하면 기기에 이미 다운로드된 업데이트를 삭제하지 않습니다. 삭제는 미래 다운로드만 중단합니다.

업데이트가 잘못된 경우 가장 신뢰할 수 있는 방법은 동일한 채널에 알려진 좋은 업데이트를 게시하는 것입니다. 이로 인해 클라이언트가 최신 버전으로 처리하고 적용하는 새로운 업데이트가 채널의 역사 맨 위에 생성됩니다.

Capgo도 이전에 안정적인 업데이트를 재적용하거나 빌드에 포함된 업데이트로 되돌아가도록 클라이언트에게 지시하는 롤백 메커니즘을 제공합니다.

데이터 마이그레이션 고려사항

채널 전환은 앱이 실행하는 JavaScript 번들을 변경합니다. 앱이 채널 간에 호환되지 않는 마이그레이션 또는 데이터 형식에 의존하는 경우, 전환을 반복하면 문제가 발생할 수 있습니다.

예를 들어, 베타 업데이트가 데이터베이스 마이그레이션을 적용하면, 프로덕션 버전은 새로운 스키마를 이해하지 못할 수 있습니다. 개발자는 업데이트가 전환 가능하도록 유지하거나 필요할 때 전환을 한 방향으로 제한해야 합니다.

채널 전환의 이점

채널 전환은 특히 프로덕션 환경에서 변경 사항을 빠르게 검토할 필요가 있는 경우 유용합니다.

빠른 검증

긴급한 버그 수정이 널리 배포되기 전에 검증이 필요할 때 생각해 보세요. 채널 전환을 사용하면 변경 사항이 지정된 사용자만의 작은 그룹으로 격리되어 검토될 수 있습니다.

주주 검토

제품 소유자 또는 QA 담당자는 설치된 프로덕션 빌드를 다른 업데이트 채널로 전환하여 수정 또는 기능을 검토한 후 다시 프로덕션으로 전환할 수 있습니다.

streamlined 테스트

이것은 비기술적인 주주가 검토 및 결정을 내릴 수 있도록 workflow를 smooth하게 유지하면서 테스트, 피드백 및 검증을 위한 유연한 도구로 프로덕션 빌드를 사용할 수 있도록 합니다.

사용 사례

QA 테스트: QA 팀은 기능 branch 간에 switch 할 수 있습니다.
Beta 프로그램: 사용자는 출시 전 일찍 접근하기 위해 beta 채널에 가입 할 수 있습니다.
주주 검토: 제품 소유주가 출시 전 변경 사항을 미리 볼 수 있습니다.
A/B 테스트: 사용자를 실험을 위해 다른 채널에 assign 할 수 있습니다.
디버깅: 특정 사용자를 디버깅 채널로 switch 하여 문제를 진단 할 수 있습니다.

채널 변경 방법 비교

방법	효과 시간	__CAPGO_KEEP_0__ 채널 할당	사용 사례
`setChannel()` 플러그인에서	즉시	기기만(로컬)	앱 내에서 사용자가 채널을 전환하는 경우
기기 오버라이드	최대 2분	백엔드 데이터베이스	관리자-initiated 특정 기기 변경
API 채널 할당	최대 2분	데이터베이스	자동화된 백엔드 통합

채널 전환 UI를 빌드할 때 최상의 사용자 경험을 제공하기 위해, 항상 플러그인의 setChannel() 메소드를 사용하세요.

최선의 방법

권한 제한: 채널 전환은 일반적으로 내부 사용자에게만 제공되므로 모든 사용자에게 노출하지 마세요.
오류 처리: 채널 전환 시 항상 오류를 부드럽게 처리하세요.
호환성 확인: 설치된 네이티브 버전과 호환되는 업데이트를 다른 채널에서 확인하세요.
채널 문서화: __CAPGO_KEEP_0__에 대한 각 채널의 목적을 명확하게 문서화하세요.
사용량 모니터링: 디버깅을 위해 채널을 확인할 때 사용하는 장치의 목록을 추적하세요.

자원

결론

채널 전환은 Capacitor 앱의 개발을 어떻게 바꿀 수 있는지에 대한 새로운 관점을 제공합니다. 프로덕션 빌드가 고정된 엔드포인트가 아닌 유연한 도구로 변환되기 때문입니다. 테스트, 검증 및 빠른 반복을 위해.

최근 플러그인 버전에서 소개된 즉각적인 채널 전환 기능 덕분에 사용자 경험은 이제 더 이상 기다리지 않고도 채널을 전환하고 새로운 채널에서 즉시 업데이트를 받을 수 있습니다.

버그 수정을 검증하기 위해 이해관계자와 협력하거나 베타 프로그램을 실행하거나 특정 사용자와 문제를 디버깅하는 등, 채널 전환은 사용자에게 필요한 업데이트를 정확한 시간에 정확한 사용자에게 제공할 수 있는 유연성을 제공합니다.

Capgo 채널 전환 방법: 런타임 채널 전환