Custom Actions Beta

Frame.io Actions provide quick access to common media operations like downloading, renaming, and duplicating items – and also allow for integrations with 3rd party tools and services to be surfaced directly within the user interface of Frame.io.

About Actions

With the introduction of custom Actions (beta), developers can configure and manage their own Actions in Frame.io V4. Leveraging the same underlying Event system as Webhooks, custom Actions are an alternative mechanism for developers to connect their assets to the tools that matter most to the users in their Frame.io Account.

Actions can be executed by any user that is a Member of the Frame.io Workspace the Action is enabled in. When executing an Action, Frame.io sends a payload to a URL you provide. The receiving application responds with an HTTP status code to acknowledge receipt, or with a custom callback to render additional form fields in the Frame.io UI. The receiving application can be your own hosted program, service, or even low-code/no-code IPaaS tool like Workfront Fusion or Zapier.

Use the Custom Actions beta to build integrations directly into Frame.io as programmable UI components. This enables workflows that can be triggered by users within the app, leveraging the same underlying events routing as webhooks. You can create user-triggered single or multi-step forms that come back to Frame.io as another form or a basic response. And when a user clicks a Custom Action on an Asset, Frame.io sends a payload to a URL you provide. The receiving application responds with an HTTP status code to acknowledge receipt, or responds with a custom callback that can render additional UI in Frame.io.

Actions Improvements in V4

Leveraging learnings from users of our Legacy version, we’ve included a number of enhancements to the Actions feature set in Frame.io V4:

Migrated Actions

There are a few things to keep in mind when migrating to a Frame.io V4 Account containing custom Actions previously created in the legacy version of Frame.io.

Action Status

Upon Account migration to Frame.io V4, all custom Actions created in earlier versions will have a status of ‘null’ and will be automatically disabled. This provides users the opportunity to first update your Actions to use the V4 API before enabling as any Actions not updated will fail. To identify Actions in this state visit the Actions Settings page and reference the column “Status” or, if using the API, by checking the is_active field.

Actionable Resources: Files, Folders & Version Stacks

Given the separation of asset types as separate resources in the Frame.io V4 API, there may be behavior to consider when interpreting the resource ID received in your Action’s payload. The behavior for individual Files is straight-forward, as the ID will reflect the specific File the Action was executed on. Likewise for Folders, you’ll be receiving the ID for the Folder the Action was executed on; however, depending on your use-case you have multiple options when defining your Action’s behavior. Use the Folder ID to make subsequent calls to the Frame.io API if you want interact with the Folder resource itself. Alternatively, you may want to get the children of that Folder in order to perform further processing on the assets within. When an action is Executed on a Version Stack, your payload will contain the ID for the ‘Head Asset’, which is the top most File in the Stack and is what is shown in the Frame.io UI.

You can read more about the differences between the Frame.io Legacy API and V4 in our Migration Guide.

A Custom Action requires:

Configure Your Custom Action

When a user selects a Custom Action on an Asset, Frame.io sends a payload to a URL you provide. The receiving application can respond with an HTTP status code to acknowledge receipt, or respond with a custom callback that renders additional UI in Frame.io.

Payload From Frame.io

When the user clicks your Custom Action, a payload is sent to the URL you set in the URL field. Use this payload to identify:

1
POST /your/url
2
{
3
    "account_id": "9a44f696-ae69-4e0c-9731-806d27ea46f1",
4
    "action_id": "ecd40785-4485-4f07-9d26-a006ea84efdf",
5
    "interaction_id": "e0a1c945-a8da-480d-92fb-e895cb640a01",
6
    "project":
7
    {
8
        "id": "3dda6833-ec3b-46bd-a7d9-1a77c03a165b"
9
    },
10
    "resource":
11
    {
12
        "id": "f9d5728c-ac1a-4f48-92bb-ea2f9be3c58b",
13
        "type": "file"
14
    },
15
    "type": "two.event",
16
    "user":
17
    {
18
        "id": "50d976e6-27d2-47cb-9388-45b38d55f4f0"
19
    },
20
    "workspace":
21
    {
22
        "id": "382a1fe6-67cf-481e-9b65-79cfd9e9727f"
23
    }
24
}

Interactions, Retries and Timeouts

The interaction_id is a unique identifier to track of the interaction as it evolves over time. If you do not need to respond to the user, return a 200 status code, and you’re done. While optional, we recommend including information about the result of the action, like a success message or error alert. Custom actions support message callbacks.

Create a Message Callback

In your HTTP response to the webhook event, you can return a JSON object describing a message that will be returned to the initiating user in the Frame.io UI.

1
{
2
  "title": "Success!",
3
  "description": "The thing worked! Nice."
4
}

Messages close the action loop providing variable context to the user, without asking them to switch contexts. When the initial payload and subsequent calls to the Frame.io API don’t provide enough context for the receiving application, use Form Callbacks.

Create a Form Callback

Let’s say that you need more info before you start your process. For example, you may be uploading content to a system that requires additional details and settings. You can describe a Form in your response, which the user sees snd fills out, and is then sent right back to you! Here’s an example form that renders a Form in the Frame.io UI that the acting user can fill out and submit:

1
{
2
  "title": "Need some more info!",
3
  "description": "Getting ready to submit this file!",
4
  "fields": [
5
    {
6
      "type": "text",
7
      "label": "Title",
8
      "name": "title",
9
      "value": "MyVideo.mp4"
10
    },
11
    {
12
      "type": "select",
13
      "label": "Captions",
14
      "name": "captions",
15
      "options": [
16
        {
17
          "name": "Off",
18
          "value": "off"
19
        },
20
        {
21
          "name": "On",
22
          "value": "on"
23
        }
24
      ]
25
    }
26
  ]
27
}

When the user submits the form, you’ll receive an event on the same URL as the initial POST:

1
POST /your/url
2
{
3
  "type": "your-specified-event-name",
4
  "interaction_id": "the-same-id-as-before",
5
  "action_id": "unique-id-for-this-custom-action",
6
  "data":{
7
    "title": "MyVideo.mp4",
8
    "captions": "off"
9
  }
10
}

All custom fields added on a form appear in the data section of the JSON payload sent by Frame.io. Use the interaction_id to map the initial request and this new form data. And again, you can respond with a message (or even another form!). By chaining Actions, Forms, and Messages, you can effectively program entire Asset workflows in Frame.io with business logic from an external system.

Form Details

Like messages, Forms support title and description attributes that render at the top of the Form. Beyond that, each form field accepts the following base attributes:

Supported Field Types

Text field

A simple text field with no additional parameters.

1
{  
2
  "type": "text",
3
  "label": "Title",
4
  "name": "title",
5
  "value": "MyVideo.mp4"
6
}

Text area

A simple text area with no additional parameters.

1
{  
2
  "type": "textarea",
3
  "label": "Description",
4
  "name": "description",
5
  "value": "This video is really, really popular."
6
}

Select list

Defines a picklist that the user can choose from. Must include an options list, each member of which should include a human-readable name, and a machine-parseable value.

1
{
2
  "type": "select",
3
  "label": "Captions",
4
  "name": "captions",
5
  "value": "off",
6
  "options": [
7
       {
8
         "name": "Off",
9
         "value": "off"
10
       },
11
       {
12
         "name": "On",
13
         "value": "on"
14
      }
15
   ]
16
}

Checkbox

A simple checkbox with no additional parameters.

1
{ 
2
   "type": "boolean", 
3
   "name": "enabled", 
4
   "label": "Enabled", 
5
   "value": "false"
6
}

Link

A simple link with no additional parameters.

1
{
2
  "type": "link",
3
  "name": "videoLink",
4
  "label": "Video Link",
5
  "value": "https://www.youtube.com/watch?v=XtX1zv9CEVc"
6
}

The Frame.io Permissions Model

Custom Actions have a special permissions model: they belong to a Workspace, not to any specific user who exists on an Account. That means:

Security and Verification

By default, all Custom Actions have a signing key generated during their creation. This is not configurable. This key can be used to verify that the request originates from Frame.io. Included in the POST request are the following:

Verifying the Signature

1
import hmac
2
import hashlib
3
4
def verify_signature(curr_time, req_time, signature, body, secret):
5
    """
6
    Verify webhook/custom action signature
7
    :Args:
8
        curr_time (float): Current epoch time
9
        req_time (float): Request epoch time
10
        signature (str): Signature provided by the frame.io API for the given request
11
        body (str): Custom Action body from the received POST
12
        secret (str): The secret for this Custom Action that you saved when you first created it
13
    """
14
    if int(curr_time) - int(req_time) < 500:
15
        message = 'v0:{}:{}'.format(req_time, body)
16
        calculated_signature = 'v0={}'.format(hmac.new(
17
            bytes(secret, 'latin-1'),
18
            msg=bytes(message, 'latin-1'),
19
            digestmod=hashlib.sha256).hexdigest())
20
        if calculated_signature == signature:
21
            return True
22
    return False

Beta Feedback

We’d love to hear from developers and end-users about the ways you’d like to use Actions in Frame.io V4. Be sure to reach out to us with your questions, ideas, and use-cases to help inform our prioritization.