Electron-开发实践:Mac应用包签名和公证
【前言】
Electron-开发实践:使用Monorepo管理Electron项目
当你通过上面这些文章使用Electron开发好一个桌面应用,
并通过这个文章在本地打包好了mac的应用包和安装包,
接着肯定想将你的应用分发出去,
分发出去前还有一步要做,
就是mac应用的签名和公证,
本文讲一下怎么将一个mac应用签名。
签名前你需要注册一个苹果开发者账号,
可以看下面这篇文章,
【@electron/osx-sign】
本文使用electron-packager签名mac应用,
https://github.com/electron/electron-packager
electron-packager是用来给electron打包的,
其中签名的部分使用了另一个npm包,
https://github.com/electron/osx-sign
阅读这个包的文档,可以看到很重要的一条,

如果要签名的平台是mas,
mas平台代表要将应用发布到app store,
那么需要的证书是3rd Party Mac Developer Application: * (*)
同样,如果要签名的平台是darwin,
darwin代表要将应用发布到mac端,但是不经过app store,
那么需要的证书是Developer ID Application: * (*)
这一点很重要,涉及后续使用哪种证书,
本文是要将应用发布到darwin平台。
【csr】
从苹果开发者网站申请一个证书前,
需要在本地生成一个csr文件,
钥匙串访问——证书助理——从证书颁发机构请求证书,

接着输入自己的姓名和邮箱,并选择保存到本地,

本地就会生成一个csr文件,

【创建证书】
csr文件准备好后,就可以在苹果开发者网站创建证书了,
地址: https://developer.apple.com/account/resources/certificates/list
点击加号创建证书,

按之前的结论需要创建的证书类型是:Developer ID Application: * (*)
也就是最后一种。

接着按提示选择刚准备好的csr文件,

接着证书就创建好了,点击下载到本地。

【导入和查看证书】
双击下载好的证书,即可导入证书,

在钥匙串中就能看到导入的证书了,

我的电脑双击会安装到钥匙串-系统-证书中,
其实也可以拖拽到钥匙串-登录-证书中,
只要在命令行执行下面命令可以列出该证书即可,
security find-identity -v

【identifier】
接着还需要创建app对应的identifier,
同样的在下面这个地址进行创建,
https://developer.apple.com/account/resources/identifiers/list/bundleId
点击加号后选择第一种类型,

接着选择app类型,

接着填写你的bundle id就行,就是类似com.xx.xx,

【修改配置文件】
上面说到使用electron-packager进行打包,
对应的有一个配置文件,配置文件详情可以看这个文章,
搞定证书和bundleid后,可以修改配置文件如下,
// darwin
if (process.platform === "darwin") {
// app bundle id
config.appBundleId = "com.xx.xx";
// sign
config.osxSign = {
identity: "Developer ID Application: xx",
};
}
修改配置文件后再次打开,效果如下,

可以看到打包mac应用包并且签名成功
【公证】
在创建证书的时候有过提示,
大概意思是如果想分发应用,不但要签名还要公证,
签名是使用本地的证书对应用内的文件进行签名,
公证是讲应用包上传到苹果服务器公证。

osxNotarize
electron-packager具备mac公证的能力,
对应的属性是osxNotarize, https://electron.github.io/electron-packager/main/interfaces/electronpackager.options.html#osxnotarize
对应的npm包是electron-notarize, https://github.com/electron/notarize
关键的几个配置项是
tool:使用notarytool进行公证还是atool,进行公证,推荐前者,后者马上会废弃
teamId:上面申请证书名称中括号内的内容
appleId:苹果id
appleIdPassword:苹果id对应的专用密码,可以查看这篇文章生成, https://support.apple.com/zh-cn/HT204397
配置文件
再次修改配置文件,内容如下
// darwin
if (process.platform === "darwin") {
// app bundle id
config.appBundleId = "com.xx.xx";
// sign
config.osxSign = {
identity: "Developer ID Application: xx (xxx)",
};
// notarize
config.osxNotarize = {
tool: "notarytool",
teamId: "xxx",
appleId: "xx",
appleIdPassword: "xx",
};
}
再次打包,就会进行mac应用本地签名和苹果服务器公证。
【效果】
如果你的mac应用已经签名和公证了,
那么分发给用户首次打开的提示如下,

【qiao-electron-cli】
将electron打包mac应用,dmg,以及签名公证封装了一个npm包,欢迎使用
https://qiao-electron-cli.vincentqiao.com/#/
1.mac-制作icns图标
2.mac-打应用包
3.mac-打dmg包
4.mac-签名和公证
【总结】
1.创建本地csr文件
2.使用本地csr在苹果开发者网站创建证书
3.使用本地证书对mac应用签名
4.使用苹果appleId专用密码对本地应用公证
5.qiao-electron-cli, https://qiao-electron-cli.vincentqiao.com/#/
6.本文对应代码库: https://github.com/uikoo9/dishi-monorepo/tree/mac-sign
7.本文对应应用(Mac M1): https://static-insistime.vincentqiao.com/21_dishi/dmg/dishi-2.0.9-arm64.dmg
8.本文对应应用(Mac Intel): https://static-insistime.vincentqiao.com/21_dishi/dmg/dishi-2.0.9-x64.dmg
相关推荐
Electron-开发实践:注册苹果开发者账号
【前言】 当使用electron开发完一个mac应用后, 如果想正常在mac电脑上使用, 还需要对你的应用进行签名和公证, 而签名和公证都需要一个苹果开发者账号, 这个过程中有一些坑,记录一下。 【注册】 注册地址: https://developer.apple.com/cn/programs/e
Electron-开发实践:clipboard剪切板
【前言】 Electron提供获取和写入系统剪切板的操作, 详见:https://www.electronjs.org/docs/latest/api/clipboard 【进程】 clipboard支持主进程使用,支持没有开启sandbox的渲染进程使用 【系统】 大部分clipboard的api
Electron-开发实践:crash上报及解析
【前言】 electron开发实践中,crash的上报不可避免, electron中可以通过crashReporter来上报crash, https://www.electronjs.org/docs/latest/api/crashreporter , 而处理crash使用的是crashpad,有
Electron-开发实践:DMG安装包定制
【前言】 dmg文件是mac端常见的安装包格式, 前面几篇文章已经使用electron开发并打包好一个应用了, 本文主要讲下定制dmg安装包, 前面几篇文章: 一篇文章学会Electron Electron开发实践:本地数据库SQLite Electron开发实践:使用Monorepo管理Elect
Electron-开发实践:包体积精简
【前言】 前面几篇文章讲了从开发electron应用到mac打包, 相关文章: 一篇文章学会Electron Electron开发实践:本地数据库SQLite Electron开发实践:使用Monorepo管理Electron项目 Electron开发实践:Mac打包 Electron开发实践:注册
Electron-开发实践:制作icns图标
【省流】 封装了一个mac上将png转为icns的应用, 欢迎大家使用: https://electronicns.com/ 【前言】 将Electron应用打包为Mac应用包的时候, 这里以electronpackager打包为例, 默认打包运行后的应用图标是这样, 【icns】 按electro
Electron-开发实践:本地日志
【前言】 使用electron开发好本地应用后, 本地日志记录必不可少, 这样可以通过日志获取用户操作信息以及定位bug等, 本地日志与实时性的埋点上报稍微有不同, 本地日志量更大,信息更全,且不是所有信息都时候上报。 【与nodejs本地日志的异同】 electron写本地日志和nodejs写本地
Electron-开发实践:定制Mac菜单
【前言】 前面几篇文章讲了从开发electron应用到mac打包, 相关文章: 一篇文章学会Electron Electron开发实践:本地数据库SQLite Electron开发实践:使用Monorepo管理Electron项目 Electron开发实践:Mac打包 Electron开发实践:注册
Electron-开发实践:Mac打包
【前言】 当本地开发好一个 electron 应用后, 最想做的事情就是打包然后分享出去。 如何用 monorepo 管理一个 electron 项目, 可以看这里: Electron开发实践:使用Monorepo管理Electron项目 【构建】 接上一篇,打包是在 packages/dishie
Electron-开发实践:使用Monorepo管理Electron项目
【前言】 本文讲如何用 monorepo 来管理一个 electron 项目 代码地址: https://github.com/uikoo9/dishimonorepo/tree/electronmonorepo 【初始化】 首先需要初始化一个 monorepo 前端项目, 具体步骤可以看这里: 初
Electron-开发实践:注册快捷键
【前言】 本文介绍一下electron应用中如何注册快捷键 【主进程】 主进程注册快捷键比较简单,需要注意的是在app ready后使用, 常见键盘映射: https://www.electronjs.org/docs/latest/api/accelerator 另外在推出app时需要将所有注册的
Electron-开发实践:几种更新方式
【前言】 Electron开发桌面APP后, 接着涉及一个问题就是如何更新后续的版本, 本文介绍几种更新的方式。 【Electron架构】 用Electron开发的桌面APP, 其实包含几个部分: 1\. Electron本身的环境 2\. 主进程,主进程中又分为Nodejs部分,和非Nodejs部
Electron-开发实践:创建Window
【前言】 Electron入门就需要创建一个window, window是用来展示ui的, window是在渲染进程。 【创建window】 新建一个前端项目, package.json内容如下, 可以看到安装了Electron的开发依赖, 即执行过下面的命令, 且有一个start命令用来本地启动E
一篇文章学会Electron
【前言】 javascript语言的强大生命力,为前端开发拓展了很多业务 网页端业务:基于js,html,css开发网页相关业务 服务端业务:基于nodejs开发服务端业务 桌面端业务:基于chromium和nodejs开发桌面业务 移动端业务:基于webview开发移动端业务 【electron简
Electron-开发实践:本地数据库SQLite
【前言】 本地存取数据的一些常见的手段:Cookie,LocalStorage,IndexedDB,SQLite等, 这里做下简单的对比 Cookie 存储大小:4k 设置有效期:可以 服务端获取:可以 特点:简单数据存取 LocalStorage 存储大小:5M 设置有效期:不行 服务端获取:不行