Adobe-CEP使用教程

一：Adobe-CEP介绍

一个 CEP 插件实际上是一个显示在宿主程序面板窗口中的网页。
通过 CEP 提供的接口与宿主程序进行交互。
宿主程序（Photoshop, Illustrator, InDesign, After Effects等等） 有很多内置功能，和一个被称为 ExtendScript 的脚本引擎，通过 ExtendScript 脚本引擎能够调用宿主程序的各种内置功能，比如创建一个图层、设置背景颜色等等。
注意： CEP 和 ExtendScript都使用JavaScript， 但是它们分别运行在两个虚拟机中，并不在一个上下文中，所以互相是独立的。 另外，一个 CEP 扩展可以同时被多个宿主运行。

二：主要目录结构

/CSXS/manifest.xml

/CSXS目录下的manifest.xml是CEP扩展的说明文件，必须要有。
一些重要的标签属性：

<ExtensionManifest Version="5.0" ExtensionBundleId="com.bodymovin.bodymovin" ExtensionBundleVersion="5.7.3"
		ExtensionBundleName="bodymovin" xmlns:xsi="http://www.w3/2001/XMLSchema-instance">

• <MainPath>./index.html</MainPath>
  前端页面入口文件
• <ScriptPath>./jsx/hostscript.jsx</ScriptPath>
  后台ExtendScript脚本文件的入口文件
• <Menu>魔翎 - Magic Effects</Menu>
  设置下拉菜单上扩展的名字
• <Size>
  设置扩展的窗口大小

  <Size>
  	<Height>500</Height>
  	<Width>300</Width>
  </Size>
  

三：Debug调试

1. Adobe ExtendScript Toolkit CC 工具
   这个工具很久没更新了，最新的mac系统已经不支持32位的程序了，可以用下面第3种方法调试。
2. chrome 开发者工具远程调试
   在插件目录里新建设置.debug文件，就可以开启远程调试：

   <?xml version="1.0" encoding="UTF-8"?> 
   <ExtensionList>
       <Extension Id="com.bodymovin.bodymovin">
           <HostList>
               <!-- Photoshop -->
               <Host Name="PHXS" Port="8088"/>
               <!-- Illustrator -->
               <Host Name="ILST" Port="8089"/>
               <!-- InDesign -->
               <Host Name="IDSN" Port="8090" />
               <!-- Premiere -->
               <Host Name="PPRO" Port="8091" />
               <!-- AfterEffects -->
               <Host Name="AEFT" Port="8092" />
               <!-- PRELUDE -->
               <Host Name="PRLD" Port="8093" />
               <!-- FLASH Pro -->
               <Host Name="FLPR" Port="8094" />      
           </HostList>
       </Extension>
   </ExtensionList>
   

3. vscode 插件: ExtendScript， ExtendScript Debugger
   安装教程：https://blog.csdn/greless/article/details/115002763#comments_16600622
   不足：这个似乎没法在项目里直接调试ExtendScript代码。只能把功能拆开来单独调试。

四：After Effects

After Effects对象模型包含如下: project, items, compositions, layers 和 render queue items。
每一个对象都有自己特殊的属性和标识。熟悉它们有助于你编写ExtendScript.

After Effects脚本对象的层次结构图如下：

注意：

• file,folder,socket对象是由ExtendScript定义的。
• ExtendScript还定义了ScriptUI模块。

用户界面的层次结构图如下：

五：ExtendScript

• ExtendScript定义了一个全局调试对象$
• 文件和文件夹对象：由于路径名语法在不同的操作系统中有很大不同，因此Adobe ExtendScript定义了文件和文件夹对象，以提供与平台无关的对底层文件系统的访问
• ScriptUI用户界面模块： 提供了创建用户界面元素和与之交互的功能
• 一些工具如：本地实例化，不同语言的用户界面显示，在对话框中显示提示信息等全局功能。
• 应用程序间的通信： 为所有的Adobe应用程序提供通用的脚本环境，并允许通过脚本进行通信。
• ExtendScript文件是以.jsx结尾的文件

参考资料：
https://ae-scripting.docsforadobe.dev/