Skip to main content
DeMatthias
DeMatthias
Inspiring
June 25, 2021
Question

Read an external API in After Effects

  • June 25, 2021
  • 2 replies
  • 1723 views

Hi, 

 

Is there a way to read an external API to load JSON sports data into After Effects?

Maybe via an easy extendscript? A load button than imports the data.

 

The manual way is to download the JSON file and replace footage.

 

Thanks

Matthias

This topic has been closed for replies.

2 replies

Justin Taylor-Hyper Brew
Justin Taylor-Hyper Brew
Braniac
June 30, 2021

You can use the built-in Socket object in After Effects, but it's pretty complicated with hardly any documentation. Check out this library for making HTTP requests:

 

https://github.com/buraktamturk/adobe-javascript-http-client

 

Once you've included that library, making HTTP requests are pretty straightforward:

 

var data = $http({

   method: 'GET',

   url: 'example.com/

   headers: {'Accept': 'application/json','Content-Type': 'application/json'} });

alert(data.payload);

A
Arie Stavchansky
Braniac
June 25, 2021

You can do this by scripting a CEP panel, but you can also use the Templater plugin from Dataclay to work with API data pretty easily.  You point Templater to the API's end-point that responds with JSON object arrays and the values can be mapped to specific layers quite easily.

 

There is documentation about using URL Feeds with Templater as well.  Many users in the Sports-tech world use Templater + AE in their workflow to save time.  You can preview the data live within comps.

    DeMatthias
    DeMatthiasAuthor
    Inspiring
    June 28, 2021

    Hi Arie,

     

    I've tried the Dataclay Templater. It doesn't fetch the data because the URL is behind a protected login. Any tips for that?

     

    Thanks

    A
    Arie Stavchansky
    Braniac
    June 30, 2021

    If the API is behind basic authentication scheme, you can enter the username and password into the "Remote JSON Configuration" dialog.  If it requires some kind of OAuth token, then you would need to see what the headers look like from another application that are required to make that request and then get those headers into the "Optional Request Headers".  For example, if there was an "Authorization" header that look liked

     

    "Authorization" : "Bearer <long token here>"

     

    In each request that was authorized, you can take that value and paste it onto a new line in the "Optional Request Headers" field.  In this case, you would write on one line:

    Authorization : Bearer <long token here> 

     

     So essentially, you login via your normal app, maybe a browser, and then look at how that browser is making requests, and try to emulate that via the Optional Headers in Templater's Remote JSON configuration dialog.  It's not ideal, and is hacky because once the token you grabbed from the authenticated app expires, you would have to change it once more.  However, this is the best that can be done given that each API will always have a different method for authentication and authorization.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices