Adobe CEP connections to a SPA webapp

[logan_7548]

Hello,  i have been tasked with finding a way to integrate a client's different tools and systems, and specifically their premiere pro, so I have a few questions regarding integration & CEP extensions.  Specifically a react webapp with premiere pro, and integrating communication between them, or more if possible.  My problem is, I first need to know what is possible with the tools that exist today before I learn how to do it.  

I have been reading about CEP extensions trying to understand the flow, because there's a number of posts here and elsewhere about react webapp integration with premiere pro.   From what I have read, it seems like most people are talking about building a react app inside of premiere pro's cep extensions folder, and loading the react app INSIDE of premiere pro itself.  But I'm wondering, can I communicate from an external react webapp to premiere pro?  

so a few questions:
- if there's an interface on an external react webapp that can send video files to different api endpoints, can i have that be sent to adobe premiere pro OR a premiere pro workspace, like the cloud.  (i see on photoshop i can save to creative cloud, but i dont see that option on premiere pro.) so can i send a file to premiere pro and have it save the file to the cloud from an external app?

- if so, can i have premiere pro perform certain actions as well, not just receive a video file, but let's say i want the video file clipped at 5:25 into two separate parts, is that possible from the external webapp?   I THINK I've read that i can have an app inside the CEP extensions that listens as a websocket or node.js/express server, that could run extendscripts, but that's fairly vague as to what capabilities those extendscripts can have.  can they do almost anything premiere pro can do? 

-im pretty sure i already know this one, but i'll ask anyways, is it possible to embed some sort of iframe to an external premiere pro into a react webapp?   

Anyways,  any information available you might have on how CEP extensions work with webapps & react, OR any other strategies/tools that exist for sending/accessing/performing/etc processes between external react webapps/anything external to premiere pro, would be greatly appreciated.   

[Bruce Bullis · Accepted solution]

>...But I'm wondering, can I communicate from an external react webapp to premiere pro?  

Yes, once you write a CEP panel that's hosted within PPro, and listens to your external webapp. 

>can i send a file to premiere pro and have it save the file to the cloud from an external app?

I know that sounds like a simple question... 😉

A CEP panel is a web page, with some super powers; it can talk to the local file system, and drive the host app's scripting interface. As the frame.io panels show, it's possible for a panel to download files to the local system.

PPro itself only works with local files; no web assets. However, your panel can render sequences, thereby creating a new media file, then upload that new media. 

>is that possible from the external webapp? 

Again, that's up to your CEP 'listener' panel. Your PPro panel can listen to [whatever you want], then use the PPro API [however you want].

>...can they [ExtendScript APIs] do almost anything premiere pro can do? 

Yes; here's the documentation. 

> is it possible to embed some sort of iframe to an external premiere pro into a react webapp? 

Yes. 

Best approach = Spend some time with the PProPanel sample, set a bunch of breakpoints in the ExtendScript (using VSCode). 

[logan_7548]

Wow, thanks for all the great info, this is exactly what I needed before going down a rabbit hole that I wasn't sure was going to lead to an actual solution.  Great to hear premiere pro has such wide ranging features.  

So correct me if i'm wrong, but my understanding of your message is that I could create a flow that could work like so:  i have an external/independent webapp that sends api calls to a CEP panel webapp that then executes scripts that do various things within premiere pro, whether that be cutting videos, saving, etc, etc.  That's amazing.  

I just have 2 additional questions:

1: if the cep panel webapp is hosted by a local premiere pro that is running, how does that work for like, availability of that cep panel app FOR the external app?  Like... i mean, that would mean having that premiere pro up and running on a local machine would be crucial for being able to execute those calls successfully from that external app, right?    (Now I'm thinking, if thats how it is, i could have a user enter their credentials in the external webapp which would then connect to their respective premiere pro installations, assuming i deploy the cep panel in each member's premiere pro that will use this flow) 

> is it possible to embed some sort of iframe to an external premiere pro into a react webapp? 

Yes. 

Best approach = Spend some time with the PProPanel sample, set a bunch of breakpoints in the ExtendScript (using VSCode). 

By Bruce Bullis

2: wait, are you saying i can render an iframe sort of setup inside an external react webapp, that is showing premiere pro itself in a browser?  if so, would this would be possible by the external react webapp communicating with the cep panel webapp which would grab some sort of feed from the premiere pro itself?

[Bruce Bullis]

> So correct me if i'm wrong...

You have it right.

>  i can render an iframe sort of setup inside an external react webapp...

You've successfully gone beyond my experience with React apps. 🙂 I know iFrames are possible.

>if so, would this would be possible...grab some sort of feed from the premiere pro itself?

There is no such thing as  a 'feed from PPro'; there is only 'your CEP panel, which can communicate [whatever you want] to your external web app'.

Note: CEP+ExtendScript integration is being superseded in PPro, by UXP extensibility. UXP is currently in beta.

If you're just starting PPro integration, we recommend starting with UXP; it can already do most of what CEP+ExtendScript could do, and you could save yourself future work, of moving from CEP to UXP, by just skipping ahead. 🙂

https://community.adobe.com/t5/premiere-pro-discussions/reminder-uxp-pre-release-sdk-available-for-u...