10

How can I use electron-builder's auto-update feature with Amazon S3 in my electron app?

Maybe someone who has already implemented it, can give more details than those which are provided in the electron-builder documentation?

gosuto
  • 5,422
  • 6
  • 36
  • 57

2 Answers2

14

Yeah I'm agree with you, I've been through there recently...

Even if i'm late, I will try to tell as much as I know for others!

In my case, I'm using electron-builder to package my electron/anguler app.

To use electron-builder, I suggest you to create a file called electron-builder.json at project root.

Thats the content of mine :

{
  "productName": "project-name",
  "appId": "org.project.project-name",
  "artifactName": "${productName}-setup-${version}.${ext}", // this will be the output artifact name
  "directories": {
    "output": "builds/"  // The output directory...
  },
  "files": [ //included/excluded files 
    "dist/",
    "node_modules/",
    "package.json",
    "**/*",
    "!**/*.ts",
    "!*.code-workspace",
    "!package-lock.json",
    "!src/",
    "!e2e/",
    "!hooks/",
    "!angular.json",
    "!_config.yml",
    "!karma.conf.js",
    "!tsconfig.json",
    "!tslint.json"
  ],
  "publish" : {
    "provider": "generic",
    "url": "https://project-release.s3.amazonaws.com",
    "path": "bucket-path"
  },
  "nsis": {
    "oneClick": false,
    "allowToChangeInstallationDirectory": true
  },
  "mac": {
    "icon": "src/favicon.ico"
  },
  "win": {
    "icon": "src/favicon.ico"
  },
  "linux": {
    "icon": "src/favicon.png"
  }
}

As you can see, you need to add publish config if you want to publish the app automaticly to s3 with electron-buider. The thing I don't like with that, is that all artifacts and files are all located in the same folder. In my case, like you can see in package.json below I decided to package it manually with electron-builder build -p never. This is basically telling never publish it, but I needed it because without it, it would not generate the latest.yml file. I'm using Gitlab-ci to generate the artefacts, then I use a script to publish it on s3, but you can can use -p always option if you want.

Electron-builder need the latest.yml file, because this is how he knoes if the artefact on s3 is more recent.

latest.yml content exemple :

version: 1.0.1
files:
  - url: project-setup-1.0.0.exe
    sha512: blablablablablablablabla==
    size: 72014605
path: project-setup-1.0.0.exe
sha512: blablablablablabla==
releaseDate: '2019-03-10T22:18:19.735Z'

One other important thing to mension is that electron-builder will try to fetch content at the url you provided in electron-builder.json publish config like so :

https://project-release.s3.amazonaws.com/latest.yml

https://project-release.s3.amazonaws.com/project-setup-1.0.0.exe

And this is the default uploaded content

enter image description here

For that, you need to have your s3 bucket public so every one with the app can fetch newest versions...

enter image description here

Here's the policy :

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "PublicReadGetObject",
            "Effect": "Allow",
            "Principal": "*",
            "Action": [
                "s3:GetObject",
                "s3:GetObjectAcl",
                "s3:GetObjectVersion",
                "s3:ListBucket"
            ],
            "Resource": [
                "arn:aws:s3:::your-bucket-name/*",
                "arn:aws:s3:::your-bucket-name"
            ]
        }
    ]
}

Replace your-bucket-name


Second, to package the app, I added a script to package.json. ("build:prod" for angular only)

  "scripts": {
    "build:prod": "npm run build -- -c production",
    "package:linux": "npm run build:prod && electron-builder build --linux -p never",
    "package:windows": "npm run build:prod && electron-builder build --windows -p never",
    "package:mac": "npm run build:prod && electron-builder build --mac -p never",
  },

Finally, here's a really well written article here that work with gitlab-ci.

I might have forgotten some parts, ask for any questions!

Francis Robitaille
  • 575
  • 1
  • 5
  • 18
  • Hi Francis, I am trying to use electron-updater with amazon s3 as well however, I am getting the access denied errors. My AWS_ACCESS_KEY_ID and AWS_SECRET_ACCESS_KEY are in my .env file, however they are not being used anywhere. Do you know what I need to do? – Icecubelegacy Mar 17 '20 at 22:32
  • AWS_ACCESS_KEY_ID and AWS_SECRET_ACCESS_KEY should not be added in the frontend .env file, cause the client could have access to those variable which should be kept secret. What backend are you using? You should be able to access your bucket from your backend by injecting correctly your environment variable. Some tutorial exist on that. – Francis Robitaille Mar 18 '20 at 15:58
  • Hi Francis, I'm not very familiar with these things. I have a React/Electron frontend which serves data through a proxy express server that's packaged in the same electron build, and my electron entry file starts up the server. Would that be considered my backend? or would clients have access to that as well? – Icecubelegacy Mar 18 '20 at 22:37
  • 1
    Then express would be considered as your backend. Also, Electron app can be unpackaged, so yeah, this mean the client could have access to the source code. It depend on what kind of app you want. But for security purpose, it is better to serve the server separately without being packaged in the same electron app. – Francis Robitaille Mar 19 '20 at 14:36
  • 1
    Does this support differential download? – Aniket Chowdhury Oct 12 '20 at 18:48
  • @AniketChowdhury I don't think so... – Francis Robitaille Oct 13 '20 at 14:28
  • hi @FrancisRobitaille how did you update it in main.js – Mahesh Gareja Apr 14 '21 at 11:34
  • How s3 works with generic provider? – Muhammad Jun 26 '23 at 02:51
4

Here is the documentation for S3 autoUpdater in electron-builder

https://www.electron.build/configuration/publish#s3options

You put your configuration inside package.json build tag, for example:

{
  "name": "ps-documentation",
  "description": "Provides a design pattern for Precisão Sistemas",
    "build":{
      "publish": {
        "provider": "s3",
        "bucket": "your-bucket-name"
      },
    }
}