# Capacitor updater
[](https://discord.com/invite/VnYRvBfgA6)
[](https://www.npmjs.com/package/@capgo/capacitor-updater)
[](https://GitHub.com/Cap-go/capacitor-updater/commit/)
[](https://good-labs.github.io/greater-good-affirmation)
[](https://sonarcloud.io/summary/new_code?id=Cap-go_capacitor-updater)
[](https://sonarcloud.io/summary/new_code?id=Cap-go_capacitor-updater)
[](https://sonarcloud.io/summary/new_code?id=Cap-go_capacitor-updater)
[](https://sonarcloud.io/summary/new_code?id=Cap-go_capacitor-updater)
[](https://sonarcloud.io/summary/new_code?id=Cap-go_capacitor-updater)
[](https://sonarcloud.io/summary/new_code?id=Cap-go_capacitor-updater)
[](https://sonarcloud.io/summary/new_code?id=Cap-go_capacitor-updater)
[](https://console.algora.io/org/Capgo/bounties?status=open)
[](https://console.algora.io/org/Capgo/bounties?status=completed)
Update Ionic Capacitor apps without App/Play Store review (Code-push / hot-code updates).
You have 3 ways possible :
- Use [capgo.app](https://capgo.app) a full featured auto update system in 5 min Setup, to manage version, update, revert and see stats.
- Use your own server update with auto update system
- Use manual methods to zip, upload, download, from JS to do it when you want.
## Community
Join the [discord](https://discord.gg/VnYRvBfgA6) to get help.
## Documentation
I maintain a more user friendly and complete [documentation here](https://docs.capgo.app/).
## Installation
```bash
npm install @capgo/capacitor-updater
npx cap sync
```
## Auto-update setup
Create your account in [capgo.app](https://capgo.app) and get your [API key](https://capgo.app/app/apikeys)
- Login to CLI `npx @capgo/cli@latest init API_KEY`
And follow the steps by step to setup your app.
See more there in the [Auto update documentation](https://docs.capgo.app/plugin/auto-update).
## Manual setup
Download update distribution zipfiles from a custom url. Manually control the entire update process.
- Edit your `capacitor.config.json` like below, set `autoUpdate` to false.
```json
// capacitor.config.json
{
"appId": "**.***.**",
"appName": "Name",
"plugins": {
"CapacitorUpdater": {
"autoUpdate": false,
}
}
}
```
- Add to your main code
```javascript
import { CapacitorUpdater } from '@capgo/capacitor-updater'
CapacitorUpdater.notifyAppReady()
```
This informs Capacitor Updator that the current update bundle has loaded succesfully. Failing to call this method will cause your application to be rolled back to the previously successful version (or built-in bundle).
- Add this to your application.
```javascript
const version = await CapacitorUpdater.download({
url: 'https://github.com/Cap-go/demo-app/releases/download/0.0.4/dist.zip',
})
await CapacitorUpdater.set(version); // sets the new version, and reloads the app
```
- Failed updates will automatically roll back to the last successful version.
- Example: Using App-state to control updates, with SplashScreen:
You might also consider performing auto-update when application state changes, and using the Splash Screen to improve user experience.
```javascript
import { CapacitorUpdater, VersionInfo } from '@capgo/capacitor-updater'
import { SplashScreen } from '@capacitor/splash-screen'
import { App } from '@capacitor/app'
let version: VersionInfo;
App.addListener('appStateChange', async (state) => {
if (state.isActive) {
// Ensure download occurs while the app is active, or download may fail
version = await CapacitorUpdater.download({
url: 'https://github.com/Cap-go/demo-app/releases/download/0.0.4/dist.zip',
})
}
if (!state.isActive && version) {
// Activate the update when the application is sent to background
SplashScreen.show()
try {
await CapacitorUpdater.set(version);
// At this point, the new version should be active, and will need to hide the splash screen
} catch () {
SplashScreen.hide() // Hide the splash screen again if something went wrong
}
}
})
```
TIP: If you prefer a secure and automated way to update your app, you can use [capgo.app](https://capgo.app) - a full-featured, auto update system.
### Packaging `dist.zip` update bundles
Capacitor Updator works by unzipping a compiled app bundle to the native device filesystem. Whatever you choose to name the file you upload/download from your release/update server URL (via either manual or automatic updating), this `.zip` bundle must meet the following requirements:
- The zip file should contain the full contents of your production Capacitor build output folder, usually `{project directory}/dist/` or `{project directory}/www/`. This is where `index.html` will be located, and it should also contain all bundled JavaScript, CSS, and web resources necessary for your app to run.
- Do not password encrypt the bundle zip file, or it will fail to unpack.
- Make sure the bundle does not contain any extra hidden files or folders, or it may fail to unpack.
## API
* [`notifyAppReady()`](#notifyappready)
* [`download(...)`](#download)
* [`next(...)`](#next)
* [`set(...)`](#set)
* [`delete(...)`](#delete)
* [`list()`](#list)
* [`reset(...)`](#reset)
* [`current()`](#current)
* [`reload()`](#reload)
* [`setMultiDelay(...)`](#setmultidelay)
* [`cancelDelay()`](#canceldelay)
* [`getLatest()`](#getlatest)
* [`setChannel(...)`](#setchannel)
* [`getChannel()`](#getchannel)
* [`setCustomId(...)`](#setcustomid)
* [`addListener('download', ...)`](#addlistenerdownload)
* [`addListener('noNeedUpdate', ...)`](#addlistenernoneedupdate)
* [`addListener('updateAvailable', ...)`](#addlistenerupdateavailable)
* [`addListener('downloadComplete', ...)`](#addlistenerdownloadcomplete)
* [`addListener('majorAvailable', ...)`](#addlistenermajoravailable)
* [`addListener('updateFailed', ...)`](#addlistenerupdatefailed)
* [`addListener('downloadFailed', ...)`](#addlistenerdownloadfailed)
* [`addListener('appReloaded', ...)`](#addlistenerappreloaded)
* [`getDeviceId()`](#getdeviceid)
* [`getPluginVersion()`](#getpluginversion)
* [`isAutoUpdateEnabled()`](#isautoupdateenabled)
* [`removeAllListeners()`](#removealllisteners)
* [`addListener(string, ...)`](#addlistenerstring)
* [`removeAllListeners()`](#removealllisteners)
* [Interfaces](#interfaces)
* [Type Aliases](#type-aliases)
### notifyAppReady()
```typescript
notifyAppReady() => Promise
```
Notify Capacitor Updater that the current bundle is working (a rollback will occur of this method is not called on every app launch)
By default this method should be called in the first 10 sec after app launch, otherwise a rollback will occur.
Change this behaviour with {@link appReadyTimeout}
**Returns:** Promise<BundleInfo>
--------------------
### download(...)
```typescript
download(options: { url: string; version: string; sessionKey?: string; checksum?: string; }) => Promise
```
Download a new bundle from the provided URL, it should be a zip file, with files inside or with a unique id inside with all your files
| Param | Type |
| ------------- | -------------------------------------------------------------------------------------- |
| **`options`** | { url: string; version: string; sessionKey?: string; checksum?: string; } |
**Returns:** Promise<BundleInfo>
--------------------
### next(...)
```typescript
next(options: { id: string; }) => Promise
```
Set the next bundle to be used when the app is reloaded.
| Param | Type |
| ------------- | ---------------------------- |
| **`options`** | { id: string; } |
**Returns:** Promise<BundleInfo>
--------------------
### set(...)
```typescript
set(options: { id: string; }) => Promise
```
Set the current bundle and immediately reloads the app.
| Param | Type |
| ------------- | ---------------------------- |
| **`options`** | { id: string; } |
--------------------
### delete(...)
```typescript
delete(options: { id: string; }) => Promise
```
Delete bundle in storage
| Param | Type |
| ------------- | ---------------------------- |
| **`options`** | { id: string; } |
--------------------
### list()
```typescript
list() => Promise<{ bundles: BundleInfo[]; }>
```
Get all available bundles
**Returns:** Promise<{ bundles: BundleInfo[]; }>
--------------------
### reset(...)
```typescript
reset(options?: { toLastSuccessful?: boolean | undefined; } | undefined) => Promise
```
Set the `builtin` bundle (the one sent to Apple store / Google play store ) as current bundle
| Param | Type |
| ------------- | -------------------------------------------- |
| **`options`** | { toLastSuccessful?: boolean; } |
--------------------
### current()
```typescript
current() => Promise<{ bundle: BundleInfo; native: string; }>
```
Get the current bundle, if none are set it returns `builtin`, currentNative is the original bundle installed on the device
**Returns:** Promise<{ bundle: BundleInfo; native: string; }>
--------------------
### reload()
```typescript
reload() => Promise
```
Reload the view
--------------------
### setMultiDelay(...)
```typescript
setMultiDelay(options: { delayConditions: DelayCondition[]; }) => Promise
```
Set DelayCondition, skip updates until one of the conditions is met
| Param | Type | Description |
| ------------- | --------------------------------------------------- | ------------------------------------------------------------------------ |
| **`options`** | { delayConditions: DelayCondition[]; } | are the {@link DelayCondition} list to set |
**Since:** 4.3.0
--------------------
### cancelDelay()
```typescript
cancelDelay() => Promise
```
Cancel delay to updates as usual
**Since:** 4.0.0
--------------------
### getLatest()
```typescript
getLatest() => Promise
```
Get Latest bundle available from update Url
**Returns:** Promise<latestVersion>
**Since:** 4.0.0
--------------------
### setChannel(...)
```typescript
setChannel(options: SetChannelOptions) => Promise
```
Set Channel for this device
| Param | Type | Description |
| ------------- | --------------------------------------------------------------- | -------------------------------------------------------------------------------- |
| **`options`** | SetChannelOptions | is the {@link SetChannelOptions} channel to set |
**Returns:** Promise<channelRes>
**Since:** 4.7.0
--------------------
### getChannel()
```typescript
getChannel() => Promise
```
get Channel for this device
**Returns:** Promise<getChannelRes>
**Since:** 4.8.0
--------------------
### setCustomId(...)
```typescript
setCustomId(options: SetCustomIdOptions) => Promise
```
Set Channel for this device
| Param | Type | Description |
| ------------- | ----------------------------------------------------------------- | ----------------------------------------------------------------------------------- |
| **`options`** | SetCustomIdOptions | is the {@link SetCustomIdOptions} customId to set |
**Since:** 4.9.0
--------------------
### addListener('download', ...)
```typescript
addListener(eventName: "download", listenerFunc: DownloadChangeListener) => Promise & PluginListenerHandle
```
Listen for download event in the App, let you know when the download is started, loading and finished
| Param | Type |
| ------------------ | ------------------------------------------------------------------------- |
| **`eventName`** | 'download' |
| **`listenerFunc`** | DownloadChangeListener |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 2.0.11
--------------------
### addListener('noNeedUpdate', ...)
```typescript
addListener(eventName: "noNeedUpdate", listenerFunc: NoNeedListener) => Promise & PluginListenerHandle
```
Listen for no need to update event, usefull when you want force check every time the app is launched
| Param | Type |
| ------------------ | --------------------------------------------------------- |
| **`eventName`** | 'noNeedUpdate' |
| **`listenerFunc`** | NoNeedListener |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 4.0.0
--------------------
### addListener('updateAvailable', ...)
```typescript
addListener(eventName: "updateAvailable", listenerFunc: UpdateAvailabledListener) => Promise & PluginListenerHandle
```
Listen for availbale update event, usefull when you want to force check every time the app is launched
| Param | Type |
| ------------------ | ----------------------------------------------------------------------------- |
| **`eventName`** | 'updateAvailable' |
| **`listenerFunc`** | UpdateAvailabledListener |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 4.0.0
--------------------
### addListener('downloadComplete', ...)
```typescript
addListener(eventName: "downloadComplete", listenerFunc: DownloadCompleteListener) => Promise & PluginListenerHandle
```
Listen for download event in the App, let you know when the download is started, loading and finished
| Param | Type |
| ------------------ | ----------------------------------------------------------------------------- |
| **`eventName`** | 'downloadComplete' |
| **`listenerFunc`** | DownloadCompleteListener |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 4.0.0
--------------------
### addListener('majorAvailable', ...)
```typescript
addListener(eventName: "majorAvailable", listenerFunc: MajorAvailableListener) => Promise & PluginListenerHandle
```
Listen for Major update event in the App, let you know when major update is blocked by setting disableAutoUpdateBreaking
| Param | Type |
| ------------------ | ------------------------------------------------------------------------- |
| **`eventName`** | 'majorAvailable' |
| **`listenerFunc`** | MajorAvailableListener |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 2.3.0
--------------------
### addListener('updateFailed', ...)
```typescript
addListener(eventName: "updateFailed", listenerFunc: UpdateFailedListener) => Promise & PluginListenerHandle
```
Listen for update fail event in the App, let you know when update has fail to install at next app start
| Param | Type |
| ------------------ | --------------------------------------------------------------------- |
| **`eventName`** | 'updateFailed' |
| **`listenerFunc`** | UpdateFailedListener |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 2.3.0
--------------------
### addListener('downloadFailed', ...)
```typescript
addListener(eventName: "downloadFailed", listenerFunc: DownloadFailedListener) => Promise & PluginListenerHandle
```
Listen for download fail event in the App, let you know when download has fail finished
| Param | Type |
| ------------------ | ------------------------------------------------------------------------- |
| **`eventName`** | 'downloadFailed' |
| **`listenerFunc`** | DownloadFailedListener |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 4.0.0
--------------------
### addListener('appReloaded', ...)
```typescript
addListener(eventName: "appReloaded", listenerFunc: AppReloadedListener) => Promise & PluginListenerHandle
```
Listen for download fail event in the App, let you know when download has fail finished
| Param | Type |
| ------------------ | ------------------------------------------------------------------- |
| **`eventName`** | 'appReloaded' |
| **`listenerFunc`** | AppReloadedListener |
**Returns:** Promise<PluginListenerHandle> & PluginListenerHandle
**Since:** 4.3.0
--------------------
### getDeviceId()
```typescript
getDeviceId() => Promise<{ deviceId: string; }>
```
Get unique ID used to identify device (sent to auto update server)
**Returns:** Promise<{ deviceId: string; }>
--------------------
### getPluginVersion()
```typescript
getPluginVersion() => Promise<{ version: string; }>
```
Get the native Capacitor Updater plugin version (sent to auto update server)
**Returns:** Promise<{ version: string; }>
--------------------
### isAutoUpdateEnabled()
```typescript
isAutoUpdateEnabled() => Promise<{ enabled: boolean; }>
```
Get the state of auto update config. This will return `false` in manual mode.
**Returns:** Promise<{ enabled: boolean; }>
--------------------
### removeAllListeners()
```typescript
removeAllListeners() => Promise
```
Remove all listeners for this plugin.
**Since:** 1.0.0
--------------------
### addListener(string, ...)
```typescript
addListener(eventName: string, listenerFunc: (...args: any[]) => any) => Promise
```
| Param | Type |
| ------------------ | --------------------------------------- |
| **`eventName`** | string |
| **`listenerFunc`** | (...args: any[]) => any |
**Returns:** Promise<PluginListenerHandle>
--------------------
### removeAllListeners()
```typescript
removeAllListeners() => Promise
```
--------------------
### Interfaces
#### BundleInfo
| Prop | Type |
| ---------------- | ----------------------------------------------------- |
| **`id`** | string |
| **`version`** | string |
| **`downloaded`** | string |
| **`checksum`** | string |
| **`status`** | BundleStatus |
#### DelayCondition
| Prop | Type | Description |
| ----------- | --------------------------------------------------------- | ---------------------------------------- |
| **`kind`** | DelayUntilNext | Set up delay conditions in setMultiDelay |
| **`value`** | string | |
#### latestVersion
| Prop | Type | Description | Since |
| ---------------- | -------------------- | ----------------------- | ----- |
| **`version`** | string | Res of getLatest method | 4.0.0 |
| **`major`** | boolean | | |
| **`message`** | string | | |
| **`sessionKey`** | string | | |
| **`error`** | string | | |
| **`old`** | string | | |
| **`url`** | string | | |
#### channelRes
| Prop | Type | Description | Since |
| ------------- | ------------------- | ----------------------------- | ----- |
| **`status`** | string | Current status of set channel | 4.7.0 |
| **`error`** | any | | |
| **`message`** | any | | |
#### SetChannelOptions
| Prop | Type |
| ------------- | ------------------- |
| **`channel`** | string |
#### getChannelRes
| Prop | Type | Description | Since |
| -------------- | -------------------- | ----------------------------- | ----- |
| **`channel`** | string | Current status of get channel | 4.8.0 |
| **`error`** | any | | |
| **`message`** | any | | |
| **`status`** | string | | |
| **`allowSet`** | boolean | | |
#### SetCustomIdOptions
| Prop | Type |
| -------------- | ------------------- |
| **`customId`** | string |
#### PluginListenerHandle
| Prop | Type |
| ------------ | ----------------------------------------- |
| **`remove`** | () => Promise<void> |
#### DownloadEvent
| Prop | Type | Description | Since |
| ------------- | ------------------------------------------------- | ---------------------------------------------- | ----- |
| **`percent`** | number | Current status of download, between 0 and 100. | 4.0.0 |
| **`bundle`** | BundleInfo | | |
#### noNeedEvent
| Prop | Type | Description | Since |
| ------------ | ------------------------------------------------- | ---------------------------------------------- | ----- |
| **`bundle`** | BundleInfo | Current status of download, between 0 and 100. | 4.0.0 |
#### updateAvailableEvent
| Prop | Type | Description | Since |
| ------------ | ------------------------------------------------- | ---------------------------------------------- | ----- |
| **`bundle`** | BundleInfo | Current status of download, between 0 and 100. | 4.0.0 |
#### DownloadCompleteEvent
| Prop | Type | Description | Since |
| ------------ | ------------------------------------------------- | ------------------------------------ | ----- |
| **`bundle`** | BundleInfo | Emit when a new update is available. | 4.0.0 |
#### MajorAvailableEvent
| Prop | Type | Description | Since |
| ------------- | ------------------- | ------------------------------------------ | ----- |
| **`version`** | string | Emit when a new major bundle is available. | 4.0.0 |
#### UpdateFailedEvent
| Prop | Type | Description | Since |
| ------------ | ------------------------------------------------- | ------------------------------------- | ----- |
| **`bundle`** | BundleInfo | Emit when a update failed to install. | 4.0.0 |
#### DownloadFailedEvent
| Prop | Type | Description | Since |
| ------------- | ------------------- | -------------------------- | ----- |
| **`version`** | string | Emit when a download fail. | 4.0.0 |
### Type Aliases
#### BundleStatus
"success" | "error" | "pending" | "downloading"
#### DelayUntilNext
"background" | "kill" | "nativeVersion" | "date"
#### DownloadChangeListener
(state: DownloadEvent): void
#### NoNeedListener
(state: noNeedEvent): void
#### UpdateAvailabledListener
(state: updateAvailableEvent): void
#### DownloadCompleteListener
(state: DownloadCompleteEvent): void
#### MajorAvailableListener
(state: MajorAvailableEvent): void
#### UpdateFailedListener
(state: UpdateFailedEvent): void
#### DownloadFailedListener
(state: DownloadFailedEvent): void
#### AppReloadedListener
(state: void): void
### Listen to download events
```javascript
import { CapacitorUpdater } from '@capgo/capacitor-updater';
CapacitorUpdater.addListener('download', (info: any) => {
console.log('download was fired', info.percent);
});
```
On iOS, Apple don't allow you to show a message when the app is updated, so you can't show a progress bar.
### Inspiration
- [cordova-plugin-ionic](https://github.com/ionic-team/cordova-plugin-ionic)
- [capacitor-codepush](https://github.dev/mapiacompany/capacitor-codepush)
### Contributors
[jamesyoung1337](https://github.com/jamesyoung1337) Thanks a lot for your guidance and support, it was impossible to make this plugin work without you.