DEV Community

Cover image for Stream video with open web services
Jonas Birmé for Eyevinn Video Dev-Team Blog

Posted on • Edited on

3

Stream video with open web services

Upload and play back your video files in your application using open web services in Eyevinn Open Source Cloud in five minutes or less.

Eyevinn Open Source Cloud was developed to reduce the barrier to getting started with open source and at the same time contribute to a sustainable model for open source by giving back a share of the revenue to the creator.

In this guide

  1. Get an API Access Token and setup project.
  2. Setup a video processing pipeline for streaming.
  3. Upload and process video

Prerequisites

Get an API Access Token and setup project

Navigate to Settings / API in the Eyevinn Open Source Cloud web console.

Skärmavbild 2025-01-30 kl  22 54 07

Copy this token and store in your shell's environment in the environment variable OSC_ACCESS_TOKEN.

% export OSC_ACCESS_TOKEN=<access-token-copied-above>
Enter fullscreen mode Exit fullscreen mode

Setup a NodeJS project.

% mkdir vod
% cd vod
% npm init
Enter fullscreen mode Exit fullscreen mode

Install the Javascript client SDK.

% npm install --save @osaas/client-core @osaas/client-transcode
Enter fullscreen mode Exit fullscreen mode

Create a file called vod.js and open it in your favorite editor.

Setup video processing pipeline

Add the following code to your file to setup the video processing pipeline.

const { Context } = require('@osaas/client-core');
const { createVodPipeline, createVod } = require('@osaas/client-transcode');

async function setup(context) {
  const pipeline = await createVodPipeline('devguide', context);
  return pipeline;
}

async function main() {
  const ctx = new Context();
  const pipeline = await setup(ctx);
}

main();
Enter fullscreen mode Exit fullscreen mode

Run the script.

% node vod.js
Enter fullscreen mode Exit fullscreen mode

After a few minutes it will have created a video processing pipeline.

Upload and process video

Now we can use the pipeline we created to upload and process a video. Here is a demo video you can use:

We will add the following to the main function.

  const vod = await createVod(pipeline,
    'https://testcontent.eyevinn.technology/mp4/VINN.mp4',
    ctx
  );
  console.log(vod);
Enter fullscreen mode Exit fullscreen mode

Now when we run the script it will return the following.

% node vod.js
{
  id: '52e124b8-ebe8-4dfe-9b59-8d33abb359ca',
  vodUrl: 'https://eyevinnlab-devguide.minio-minio.auto.prod.osaas.io/devguide/VINN/52e124b8-ebe8-4dfe-9b59-8d33abb359ca/index.m3u8'
}
Enter fullscreen mode Exit fullscreen mode

When the video processing has completed we can now paste the vodURL in a video player.

Skärmavbild 2025-01-31 kl  00 21 56

Next post: Creating a web video application

SurveyJS custom survey software

Build Your Own Forms without Manual Coding

SurveyJS UI libraries let you build a JSON-based form management system that integrates with any backend, giving you full control over your data with no user limits. Includes support for custom question types, skip logic, an integrated CSS editor, PDF export, real-time analytics, and more.

Learn more

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs