Skip to main content

Building Applications

There are four options for building an application using the Eluvio Media Wallet:

Build a site with Creator Studio

Using Creator Studio, you can configure a Media Property — a custom website and marketplace — with no code required.

Embed the Eluvio Media Wallet in your site with the Wallet Frame Client

With @eluvio/elv-wallet-frame-client, you can include the entire wallet experience on your own website. The Eluvio Media Wallet is loaded into an embedded iframe, and the client allows you to control the experience, including navigating the application, retrieving user, marketplace, secondary listing and NFT information, and performing actions like purchasing.

Build your own application with the Eluvio Wallet Client

The Eluvio Wallet Client in @eluvio/elv-client-js, the same client the Eluvio Media Wallet uses, allows you to take full control of the Eluvio Wallet experience and build your own application from the ground up.

Additionally, the Eluvio Wallet Client contains a full instance of @eluvio/elv-client-js that can be accessed via walletClient.client.

Integrate directly against the REST APIs

If you'd rather not use the client libraries, the Media Wallet's authentication, purchase/entitlement and playback flows are also available via REST APIs. See the API Reference for an overview and links to various components.

Authentication

The first step in building an application is deciding the authentication model.

Here are your options:

  1. Use the Eluvio Custodial Wallet
  2. Use your own open ID system
  3. Use your own 'signer' - basically using any wallet(s) that can create signed messages

Eluvio Media Wallet Login - Custodial & MetaMask

The standard Eluvio Media Wallet application login can be used to authenticate. It supports both our Eluvio Custodial Wallet, an open ID system, as well as MetaMask.

As an application developer you can use the standard wallet login as follows:

Using Eluvio Wallet Client

Using the Eluvio Wallet Client, you can use the LogIn method. This will redirect your application to the Eluvio Media Wallet, where the user will log in with the standard Media Wallet login flow (using either the custodial wallet or MetaMask), and redirect back with a signed token that your client will use to perform actions on behalf of the user.

Using the Eluvio Wallet Frame Client

If you've embedded the Eluvio Media Wallet into your site with the frame client, there are two options for dealing with login.

The simplest option is to just allow the Eluvio Media Wallet application handle login natively. If the frame is visible, the user can simply navigate through the login flow with the standard Media Wallet UI. The frame client also offers a LogIn method that you can use in your application, but please note that this often runs afoul of popup blockers, as login via the embedded media wallet uses a popup and browsers require a deliberate user action in the frame to generate a popup without being blocked. It is recommended to use the method below instead.

The other option is to use the full Eluvio Wallet Client login flow (see above), retrieve the token, then pass that token to the embedded wallet via the frame client. This is recommended if you are using both clients, as the frame client cannot access the auth token from the embedded application, so if the user logs in via the frame client, you cannot set up the full wallet client to use that authentication.

Using both clients can be useful if you want to implement your own login screen separate from the Media Wallet application, or if you need to access wallet functionality on pages where the wallet application is not embedded.

To see code examples of all three options, see this example and/or the live DApp Sample and its source code.

Custom Open ID System

If you already use an open ID system you can set up you tenancy to recognize your open ID issuer and create a tenant-specific custodial wallet function.

The basic application flow starts by logging on the user using your open ID system and retrieving a JWT ID token.

Option A: use the elv-media-wallet library as an embedded iframe

You can initialize the elv-media-wallet library using your custome JWT ID token and use it to access all content and marketplace functions (the same way as using the built-in Eluvio Custodial Wallet)

Option B: use the tenant-specific custodial wallet to create a client-signed token and access the content and marketplace functions directly over the API.

External Signer

If you use an external signer, you can create a client-signed token and access content and marketplace functions directly.

Using the elv-media-wallet library with an external signer is not supported at this moment but will be supported in the near future.

References

Eluvio Media Wallet user applications:

Content Fabric core tenant applications: