Assets

Twilio provides you with three different types of Assets: public, protected, and private. The primary difference between the types is how they are accessed:

• Public Assets are served over HTTPS from the Twilio CDN to ensure that they are highly available and secure, and are accessible by anyone with the Asset's URL.
• Protected Assets are accessible via the Twilio CDN by URL as well, but require a valid Twilio request signature, or they will return a 403 error.
• Private Assets are not accessible by URL or exposed to the web; instead, they are packaged with your Twilio Functions at build time.

If you would like to learn more about Asset visibility, we have a document that goes over the distinctions between public, protected, and private assets in greater detail.

Start by opening one of your existing Services, or by creating a new one. Once you're in the Functions Editor UI for your Service there are three points of interest:

1. The Assets pane, which lists your Assets, their Visibility, a context menu for adjusting visibility, and another menu for other actions.
2. The Add+ button which allows you to upload files as Assets, or create a new Asset.
3. The Deploy All button, which will trigger an upload and deploy of your Assets (along with any Functions)

Expand image

Upload a file by clicking Add+ and then Upload File in the resulting menu, which will open up a standard file upload dialogue. Once you've selected a file or files, you'll be presented with options to set the visibility of each Asset, as well as the ability to remove or add other files. Click Upload to begin uploading your selection of files with the desired settings.

Expand image

While the Asset has been uploaded, it will not be immediately accessible via a URL or in your Functions yet. This will be indicated by the gray circle next to the Asset's name. To deploy the Asset (and the rest of your Service), click the Deploy All button. After a brief period, the deployment will finish, and you should see a green check appear next to all deployed Assets.

Expand image

In general the URL of one of your Assets can be determined by taking the URL of your Service, for example https://example-1234.twil.io, and appending the name of your Asset.

In the case of an Asset such as example.json in that Service, it can be accessed at https://example-1234.twil.io/example.json.

For a point and click solution, the Functions Editor UI also provides two ways to copy the URL of an Asset to your clipboard:

• Open the context menu of an Asset, and click Copy URL
• Open an Asset in the Functions Editor, and click the Copy URL button that will appear below the content editor and above the logs pane

Expand image

Public assets are publicly accessible once deployed, and can be used by referencing their URL. For example: given a Service with the URL of https://example-1234.twil.io and a public Asset named ahoy.mp3, the Asset will be available at https://example-1234.twil.io/ahoy.mp3.

The process for determining the URL of a protected Asset is the same as that of a public Asset. However, the Asset will only be accessible from Twilio code such as a Function, Studio Flow, or Flex.

For example, suppose we have an image grumpy.jpg that's been deployed to https://twilio-assets-1967.twil.io/grumpy.jpg. We would like to be able to send this image to users as part of an MMS, but have the file be inaccessible in all other cases. If the following code were deployed to a Function in the same Service and executed, the recipient will receive the image of grumpy cat, but anybody else trying to access the file by URL will be returned a 403 Forbidden error instead.

1
exports.handler = (context, event, callback) => {
2
  // Access the NodeJS Helper Library by calling context.getTwilioClient()
3
  const client = context.getTwilioClient();
4
  // Query parameters or values sent in a POST body can be accessed from `event`
5
  const from = event.From || "+15017122661";
6
  const to = event.To || "+15558675310";
7
  const body = event.Body || "Ahoy, World!";
8

9
  client.messages
10
    .create({
11
      to,
12
      from,
13
      body,
14
      // You will get a 403 if you try to view this image, but Twilio will
15
      // be able to access it and send it as part of the outgoing MMS
16
      mediaUrl: "https://twilio-assets-1967.twil.io/grumpy.jpg",
17
    })
18
    .then((message) => {
19
      console.log(`Success! MMS SID: ${message.sid}`);
20
      return callback(null, message.sid);
21
    })
22
    .catch((error) => {
23
      console.error(error);
24
      return callback(error);
25
    });
26
};

Similarly, suppose you have audio or messaging to include in your Studio Flow, but don't want that audio to be accessible to the entire internet. If the audio were uploaded as protected Asset, you could then reference its URL in the Studio Say/Play widget, and the audio will play for anybody that hits that part of your Flow.

For example, if the audio were a protected Asset deployed at https://twilio-assets-1967.twil.io/sensitive-message.mp3, it could be referenced in your Studio Flow as shown below:

Expand image

When Twilio builds your Function for deployment it will bundle any and all Private Assets that you have uploaded. This makes Private Assets perfect for storing sensitive configuration files, templates, and shared code that supports your application.

In order to access a private Asset, you will need to leverage the Runtime.getAssets method and open the file directly using either the open helper method, or by using helper methods from the fs module as shown in the following examples.

Example of how to read the contents of a Private Asset

1
exports.handler = (context, event, callback) => {
2
  // Access the open helper method for the Asset
3
  const openFile = Runtime.getAssets()["/my_file.txt"].open;
4

5
  // Open the Private Asset and read the contents.
6
  // Calling open is equivalent to using fs.readFileSync(asset.filePath, 'utf8')
7
  const text = openFile();
8
  console.log("Your file contents: " + text);
9

10
  return callback();
11
};

Example of how to serve an audio file from a Private Asset

1
// Load the fs module
2
const fs = require("fs");
3

4
exports.handler = (context, event, callback) => {
5
  // Get the path to the Private Asset
6
  const mp3Path = Runtime.getAssets()["/audio.mp3"].path;
7

8
  // Read the file into the buffer and get its metadata
9
  const buffer = fs.readFileSync(mp3Path);
10
  const stat = fs.statSync(mp3Path);
11
  // Create a new Response object
12
  const response = new Twilio.Response();
13
  // Send the audio file in the response
14
  response.setBody(buffer);
15
  response.appendHeader("Content-Type", "audio/mpeg");
16
  response.appendHeader("Content-Length", stat.size);
17

18
  return callback(null, response);
19
};

In some cases, such as when hosting an app with a landing page, you want the root URL of your Service to return an Asset in the browser. For example, you can visit root-asset-5802.twil.io/ which serves static HTML solely via Assets.

To reproduce this behavior, you will need to use one of two special paths for a public Asset for your file (whether it be HTML, an image, or anything else).

You may rename an Asset's path to /, and that Asset will be served on requests to the root URL of your Service. In the Console UI, it would look like this:

Expand image

This path applies only to HTML files. Renaming an HTML file's path to /assets/index.html will cause the Service to return that page on requests to the root URL of your Service. It would look like this in the Console UI:

Expand image

You can practice this yourself using the following index.html example code:

All Builds have limitations on the maximum allowable file size and quantity of each Asset type that can be included:

These limits apply only to individual Builds, so Assets used in a Build by a Subaccount won't affect the limits of other Subaccounts or the main Account.

Using Environments further expands your options, as you can create Builds containing different sets of Assets and deploy them to separate Environments.