Packaging signing Adobe CEP Panel in details

In more details

simplified automated steps see here

Build the app in one folder

if you only want to build the app without packaging as zxp or signing then use this command.

npm run adobe-panel-build

Packages all the parts needed for the extension to work in the ./adobe-panel-build This directory is added to .gitignore to avoid merge conflicts.

Download the ZXPSignCmd terminal utility

This SDK provides the low-level tools that you need to build extensions. Extensions that you build using these tools must be packaged as ZXP files in order to be seen and loaded by Extension Manager. You can offer extensions as free or paid products through our marketing portals (Adobe Exchange, the Add-ins website, the Creative Cloud desktop app). When you do this, you upload the extension to Adobe as a single ZXP file.

Resources you will need include:

• CEP JavaScript libraries for communicating with the operating system and Extension Manager and for communicating with the host application and other extensions.

• Sample code for how to use these libraries

• The ZXP packager, a command-line utility

From Adobe docs

download the binary for ZXPSignCmdfrom the Adobe CEP Resources github repo see bewlo for direct. Downlaod as dmg and then move the binary where most suited in the project.

https://github.com/Adobe-CEP/CEP-Resources/blob/master/ZXPSignCMD/4.0.7/osx10/ZXPSignCmd.dmggithub.com

Creating a self signing certificate certificate

You need to use the ZXPSignCmd to generate your self signed certificate. See below for how

So: fire the Terminal (or the Win Command line), get to the directory where you’ve moved the ZXPSignCmd file (if you don’t know how to do this, just type “cd ” – mind you there’s a space – in the terminal and drag and drop the folder, then hit Enter) and create a certificate using this pattern:

from

ZXPSignCmd -selfSignedCert <countryCode> <stateOrProvince> <organization> <commonName> <password> <outputPath.p12>

dummy example for clarity

`./ZXPSignCmd -selfSignedCert IT BO DBCompany "Davide Barranca" OcaMorta selfDB.p12`

This command generate a certificate file selfDB.p12on your system, this certificate can be used in the next step to package the app.

Package and sign the extension

Packaging and signing the extension happens in one step

Let’s assume the extension you’ve made has the ID com.example.helloworld and it’s contained within a directory named accordingly.

Gather together the Extension with the ZXPSignCmd and the selfDB.p12 in one folder, then build the ZXP using this pattern

from

HTML Panels Tips: #10 Packaging / ZXP Installersundavide

eg in our case eg com.autoedit2.it as indicated in the adobe CEP manifest xml file

ZXPSignCmd -sign <inputDirectory> <outputZxp> <p12> <p12Password> -tsa <timestampURL>

code example with dummy

./ZXPSignCmd -sign com.example.helloworld com.example.helloworld.zxp selfDB.p12 OcaMorta -tsa http://timestamp.digicert.com/

If everything’s OK you should find a newly created com.example.helloworld.zxp file. That’s your self signed, timestamped installer; submit it to the Add Ons website and/or privately and enjoy.

from

HTML Panels Tips: #10 Packaging / ZXP Installersundavide

Other links

• CEP Guide Part 7: Packaging and Distribution, with bash script example to automate step.
• HTML Panels Tips: #10 Packaging / ZXP Installers
• Packaging and signing, more details in adobe's docs
• There is also an npm tool create-zxp, but have not tried it.

  • If using the npm tool it also signs the extension so can skip next step about signing and go straight to upload to marketplace

• Extension Manager command-line basics
• From Adobe-CEP/Samples: 6. Package and deploy your panel

Exchange Program

Submitting extensions

Adobe apps available for download

Adobe apps available for download