I'm trying to grok the Stream pricing. Did I get this right? Starting to use the service costs me 5$

B

bqm•8/18/23, 12:02 PM

Another question about webrtc live streaming: if I create a live stream via API and stream right away, should I expect it to work or do I need to wait some amount of time?

Aarggh I'm trying to grok the Stream pricing. Did I get this right? Starting to use the...

K

kev-ac•8/18/23, 1:50 PM

I don't see why you can't upgrade from just Stream to the Starter Bundle later on.

The $5/mo. plan includes 1.000 minutes of stored video and no delivery ($1 / 1.000min). You can use the 1000 minutes or not, its always $5.
The $10/mo. plan includes (besides Image) 5.000 minutes of video delivery ($1 / 1.000min for minutes above that)

I

iamakaradech•8/18/23, 4:05 PM

Is anyone has problem with Audio Track CORS error?

Kkev-ac I don't see why you can't upgrade from just Stream to the Starter Bundle later o...

A

argghOP•8/19/23, 7:53 AM

Thanks for the clarification

As feedback for Cloudflare, I found the pricing section regarding Cloudflare Stream extremely confusing, even though the pricing is quite simple. I think it would be beneficial to include the bundles on the pricing page, together with a clear data table that explains the pricing per X minutes of video/viewing. Now I need to study an "example scenario" and decipher the price from there, cherry picking other price-related tidbits of information from elsewhere on the product page / dashboard.

A

argghOP•8/19/23, 7:58 AM

Also, the clarification regarding my question about what's included in the bundles was clarified in the next step after I selected the no-bundle option. Would be better to explain that before I have to choose.

M

Md Muhaiminul•8/20/23, 4:26 PM

hi, can anyone help me with cloudflare images setup for my react project. i have tried many method but those are blocked by cors policy

Z

Zeke•8/23/23, 2:44 AM

hi, I'm attempting to use cloudflare stream as an OEmbed into a Squarespace template.. the standard embed code threw an error, any known work arounds for getting the oembed?

ZZeke hi, I'm attempting to use cloudflare stream as an OEmbed into a Squarespace temp...

G

Geano•8/23/23, 12:07 PM

I'm experimenting with the HLS manifest, using HLS.js....(https://github.com/video-dev/hls.js/) works a lot better in several aspects for me, anyway... eg 'bare bones' test vid here,https://ourspecial.net/AudioFix-HardTimes.html view the source, see if it can fit for you???... download dist package at https://github.com/video-dev/hls.js/releases/download/v1.4.10/release.zip

GitHub

GitHub - video-dev/hls.js: HLS.js is a JavaScript library that play...

HLS.js is a JavaScript library that plays HLS in browsers with support for MSE. - GitHub - video-dev/hls.js: HLS.js is a JavaScript library that plays HLS in browsers with support for MSE.

TEST HLS

GGeano I'm experimenting with the HLS manifest, using HLS.js....(https://github.com/vid...

Z

Zeke•8/23/23, 12:28 PM

thanks, I'll check it out

J

Jonathan Malko•8/23/23, 9:15 PM

trying to upload videos client-side with Uppy in a PHP project. When I hit my php endpoint, I end up creating multiple video objects, no upload, no location header in response, infact when all seems to go right, response is completely empty.

J

Jonathan Malko•8/23/23, 9:16 PM

tried to basically copy/paste then adapt from docs

J

Jonathan Malko•8/23/23, 9:17 PM

https://developers.cloudflare.com/api/operations/stream-videos-initiate-video-uploads-using-tus

Cloudflare API Documentation

Interact with Cloudflare's products and services via the Cloudflare API

J

Jonathan Malko•8/23/23, 9:18 PM

https://developers.cloudflare.com/stream/uploading-videos/direct-creator-uploads/#step-1-create-your-own-api-endpoint-that-returns-an-upload-url

Direct creator uploads · Cloudflare Stream docs

Direct creator uploads let your end users to upload videos directly to Cloudflare Stream, without exposing your API token to clients.

D

DrLele08•8/24/23, 12:02 AM

hello to everyone, hope that somebody can help me.
i have a buffer video file and i want to upload to CloudFlare streams, this is the snippet:
let axios = require("axios").default;
console.log(video);
let options = {
method: 'POST',
url: 'https://api.cloudflare.com/client/v4/accounts/???????/stream',
headers: {
'Authorization': "Bearer "+process.env.CLOUDFLARE_API_VIDEO
},
body:{
file: video
}
};
axios.request(options).then((response)=>{
console.log(response);
}).catch((error)=>{
console.log(error.response.data);
});

the video variable is the buffer, but evety time i do the request the response is:
{
result: null,
success: false,
errors: [ { code: 10004, message: 'Decoding Error' } ],
messages: null
}

G

Gagan Suie•8/24/23, 1:33 AM

hi, Is there an API to get the customer ID?

I'd prefer not to hardcode the customer ID in the url:
https://customer-/<some-random-id>.cloudflarestream.com/

is there a way to retrieve this ID via API? or should i just hardcode it?

S

sl0wik•8/24/23, 4:30 PM

Hello everyone. Any projections when https://developers.cloudflare.com/stream/webrtc-beta/ could go alpha? Simulcasting going to be amazing.

WebRTC (beta) · Cloudflare Stream docs

Sub-second latency live streaming (using WHIP) and playback (using WHEP) to unlimited concurrent viewers.

S

sl0wik•8/24/23, 4:39 PM

Sharing use case: https://www.roomcast.io

Roomcast

[

[FMU][BR] Alexandre Schneider•8/25/23, 1:11 AM

Hey! First time been here o/

Just a quick intro: MY name is Alex, i'm from Brasil and work for a High Education Institution, FMU. We just signed for Stream and i'm playing with the apis so i can import my kaltura videos into stream (got like 17k+ videos to do it).

my doubts are:

I just created 125 videos from my recent created c# client, but i was trying to bulk delete this videos, but did not found the delete api to use, is there one?

My another question is about import limits: I can send as many api calls for importing videos i want or is there a limit i need to have in mind?

if this is not the place for this, please direct me for the right one and feel free to delete this post.

M

matlo•8/25/23, 2:28 PM

hi there! is there a way to get a URL that we can just put in a <video> tag? without the whole <iframe> thing? I'm asking because I need to add an

object-fit: cover

object-fit: cover

object-fit: cover

object-fit: cover css property to the video, but I can't access it until the iframe loads. Anyone here had the same issue? Thanks

N

Nat•8/25/23, 2:33 PM

@matlo you'll want to use something like hls.js and the HLS manifest URL

NNat @matlo you'll want to use something like hls.js and the HLS manifest URL

M

matlo•8/25/23, 2:34 PM

thanks! I'll try that.

NNat @matlo you'll want to use something like hls.js and the HLS manifest URL

M

matlo•8/25/23, 3:05 PM

thanks so much, it works.
Leaving here my svelte component if anyone needs it in the future:

<script>
  import Hls from "hls.js";
  import { onMount } from "svelte";
  export let src;

  let videoElement;
  let hlsInstance;

  // force to 1080p
  const targetQualityIndex = 4; 

  onMount(() => {
    if (Hls.isSupported()) {
      hlsInstance = new Hls();
      hlsInstance.loadSource(src);
      hlsInstance.attachMedia(videoElement);

      hlsInstance.on(Hls.Events.MANIFEST_PARSED, () => {
        // Check if the chosen quality index is valid
        console.log(hlsInstance.levels);
        if (targetQualityIndex < hlsInstance.levels.length) {
          hlsInstance.currentLevel = targetQualityIndex;
        }
      });
    } else if (videoElement.canPlayType("application/vnd.apple.mpegurl")) {
      videoElement.src = src;
    }

    return () => {
      if (hlsInstance) {
        hlsInstance.destroy();
      }
    };
  });
</script>

<video
  bind:this={videoElement}
  muted
  autoplay
  playsinline
  loop
  class="w-full h-full object-cover"
>
  Your browser does not support the video tag.
</video>

<script>
  import Hls from "hls.js";
  import { onMount } from "svelte";
  export let src;

  let videoElement;
  let hlsInstance;

  // force to 1080p
  const targetQualityIndex = 4; 

  onMount(() => {
    if (Hls.isSupported()) {
      hlsInstance = new Hls();
      hlsInstance.loadSource(src);
      hlsInstance.attachMedia(videoElement);

      hlsInstance.on(Hls.Events.MANIFEST_PARSED, () => {
        // Check if the chosen quality index is valid
        console.log(hlsInstance.levels);
        if (targetQualityIndex < hlsInstance.levels.length) {
          hlsInstance.currentLevel = targetQualityIndex;
        }
      });
    } else if (videoElement.canPlayType("application/vnd.apple.mpegurl")) {
      videoElement.src = src;
    }

    return () => {
      if (hlsInstance) {
        hlsInstance.destroy();
      }
    };
  });
</script>

<video
  bind:this={videoElement}
  muted
  autoplay
  playsinline
  loop
  class="w-full h-full object-cover"
>
  Your browser does not support the video tag.
</video>

<script>
  import Hls from "hls.js";
  import { onMount } from "svelte";
  export let src;

  let videoElement;
  let hlsInstance;

  // force to 1080p
  const targetQualityIndex = 4; 

  onMount(() => {
    if (Hls.isSupported()) {
      hlsInstance = new Hls();
      hlsInstance.loadSource(src);
      hlsInstance.attachMedia(videoElement);

      hlsInstance.on(Hls.Events.MANIFEST_PARSED, () => {
        // Check if the chosen quality index is valid
        console.log(hlsInstance.levels);
        if (targetQualityIndex < hlsInstance.levels.length) {
          hlsInstance.currentLevel = targetQualityIndex;
        }
      });
    } else if (videoElement.canPlayType("application/vnd.apple.mpegurl")) {
      videoElement.src = src;
    }

    return () => {
      if (hlsInstance) {
        hlsInstance.destroy();
      }
    };
  });
</script>

<video
  bind:this={videoElement}
  muted
  autoplay
  playsinline
  loop
  class="w-full h-full object-cover"
>
  Your browser does not support the video tag.
</video>

<script>
  import Hls from "hls.js";
  import { onMount } from "svelte";
  export let src;

  let videoElement;
  let hlsInstance;

  // force to 1080p
  const targetQualityIndex = 4; 

  onMount(() => {
    if (Hls.isSupported()) {
      hlsInstance = new Hls();
      hlsInstance.loadSource(src);
      hlsInstance.attachMedia(videoElement);

      hlsInstance.on(Hls.Events.MANIFEST_PARSED, () => {
        // Check if the chosen quality index is valid
        console.log(hlsInstance.levels);
        if (targetQualityIndex < hlsInstance.levels.length) {
          hlsInstance.currentLevel = targetQualityIndex;
        }
      });
    } else if (videoElement.canPlayType("application/vnd.apple.mpegurl")) {
      videoElement.src = src;
    }

    return () => {
      if (hlsInstance) {
        hlsInstance.destroy();
      }
    };
  });
</script>

<video
  bind:this={videoElement}
  muted
  autoplay
  playsinline
  loop
  class="w-full h-full object-cover"
>
  Your browser does not support the video tag.
</video>

M

matlo•8/25/23, 3:05 PM

most of it was generated by chatgpt but it works

N

Nat•8/25/23, 3:06 PM

That was fast

right on!

NNat That was fast 😄 right on!

M

matlo•8/25/23, 3:07 PM

thanks chatgpt

[[FMU][BR] Alexandre Schneider Hey! First time been here o/ Just a quick intro: MY name is Alex, i'm from Bra...

S

sl0wik•8/25/23, 5:26 PM

Bom dia. Yes. "The global rate limit for the Cloudflare API is 1200 requests per five minutes." and to lift it up you need enterprise account. As far I know it can be lifted to 9999 per 5 minutes but you would need to spend $2k+ per month.

J

Jonathan Malko•8/25/23, 7:35 PM

figured out how to craft the tus endpoint in PHP. The sample code in the docs is wrong. Can I PR those?

Ttsmith Yeah that'd be awesome! Where did you find the error?

J

Jonathan Malko•8/25/23, 7:46 PM

on https://developers.cloudflare.com/api/operations/stream-videos-initiate-video-uploads-using-tus

the PHP cURL and guzzle samples read like this:

<?php

$curl = curl_init();

curl_setopt_array($curl, [
  CURLOPT_URL => "https://api.cloudflare.com/client/v4/accounts/account_identifier/stream",
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "POST",
  CURLOPT_POSTFIELDS => "",
  CURLOPT_HTTPHEADER => [
    "Content-Type: application/json",
    "Tus-Resumable: 1.0.0",
    "Upload-Creator: ",
    "Upload-Length: ",
    "Upload-Metadata: ",
    "X-Auth-Email: "
  ],
]);

$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}

<?php

$curl = curl_init();

curl_setopt_array($curl, [
  CURLOPT_URL => "https://api.cloudflare.com/client/v4/accounts/account_identifier/stream",
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "POST",
  CURLOPT_POSTFIELDS => "",
  CURLOPT_HTTPHEADER => [
    "Content-Type: application/json",
    "Tus-Resumable: 1.0.0",
    "Upload-Creator: ",
    "Upload-Length: ",
    "Upload-Metadata: ",
    "X-Auth-Email: "
  ],
]);

$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}

<?php

$curl = curl_init();

curl_setopt_array($curl, [
  CURLOPT_URL => "https://api.cloudflare.com/client/v4/accounts/account_identifier/stream",
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "POST",
  CURLOPT_POSTFIELDS => "",
  CURLOPT_HTTPHEADER => [
    "Content-Type: application/json",
    "Tus-Resumable: 1.0.0",
    "Upload-Creator: ",
    "Upload-Length: ",
    "Upload-Metadata: ",
    "X-Auth-Email: "
  ],
]);

$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}

<?php

$curl = curl_init();

curl_setopt_array($curl, [
  CURLOPT_URL => "https://api.cloudflare.com/client/v4/accounts/account_identifier/stream",
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "POST",
  CURLOPT_POSTFIELDS => "",
  CURLOPT_HTTPHEADER => [
    "Content-Type: application/json",
    "Tus-Resumable: 1.0.0",
    "Upload-Creator: ",
    "Upload-Length: ",
    "Upload-Metadata: ",
    "X-Auth-Email: "
  ],
]);

$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}

Cloudflare API Documentation

Interact with Cloudflare's products and services via the Cloudflare API

J

Jonathan Malko•8/25/23, 7:47 PM

but this does not prompt curl to return headers (1) and it does not help you to return headers for any tus uploader (2)

J

Jonathan Malko•8/25/23, 7:51 PM

in order to fetch headers from curl the way we need, gotta slot in a couple extra params:

CURLOPT_HEADER => true,
CURLOPT_NOBODY => true,

CURLOPT_HEADER => true,
CURLOPT_NOBODY => true,

CURLOPT_HEADER => true,
CURLOPT_NOBODY => true,

CURLOPT_HEADER => true,
CURLOPT_NOBODY => true,

and then we get the headers back as a string - so I ended up doing this:

          if ($err) {    
      
            echo "cURL Error #:" . $err;    
                                                         
          } else {    
              // parse response headers from string to array    
              $response_headers = [];    
              $response_headers_string = substr($response, 0, strpos($response, "\r\n\r\n"));    
              foreach (explode("\r\n", $response_headers_string) as $i => $line) {    
                  if ($i === 0) {    
                      $response_headers['http_code'] = $line;    
                  } else {    
                      list ($key, $value) = explode(': ', $line);    
                      $response_headers[$key] = $value;    
                  }    
              }                                                 
                                                            
              $destination = $response_headers["Location"];    
              return response()    
                  ->noContent()    
                  ->header('Access-Control-Expose-Headers', 'Location')    
                  ->header('Access-Control-Allow-Headers', '*')    
                  ->header('Access-Control-Allow-Origin', '*')                                              
                  ->header('Location', $destination);    
          }

          if ($err) {    
      
            echo "cURL Error #:" . $err;    
                                                         
          } else {    
              // parse response headers from string to array    
              $response_headers = [];    
              $response_headers_string = substr($response, 0, strpos($response, "\r\n\r\n"));    
              foreach (explode("\r\n", $response_headers_string) as $i => $line) {    
                  if ($i === 0) {    
                      $response_headers['http_code'] = $line;    
                  } else {    
                      list ($key, $value) = explode(': ', $line);    
                      $response_headers[$key] = $value;    
                  }    
              }                                                 
                                                            
              $destination = $response_headers["Location"];    
              return response()    
                  ->noContent()    
                  ->header('Access-Control-Expose-Headers', 'Location')    
                  ->header('Access-Control-Allow-Headers', '*')    
                  ->header('Access-Control-Allow-Origin', '*')                                              
                  ->header('Location', $destination);    
          }

          if ($err) {    
      
            echo "cURL Error #:" . $err;    
                                                         
          } else {    
              // parse response headers from string to array    
              $response_headers = [];    
              $response_headers_string = substr($response, 0, strpos($response, "\r\n\r\n"));    
              foreach (explode("\r\n", $response_headers_string) as $i => $line) {    
                  if ($i === 0) {    
                      $response_headers['http_code'] = $line;    
                  } else {    
                      list ($key, $value) = explode(': ', $line);    
                      $response_headers[$key] = $value;    
                  }    
              }                                                 
                                                            
              $destination = $response_headers["Location"];    
              return response()    
                  ->noContent()    
                  ->header('Access-Control-Expose-Headers', 'Location')    
                  ->header('Access-Control-Allow-Headers', '*')    
                  ->header('Access-Control-Allow-Origin', '*')                                              
                  ->header('Location', $destination);    
          }

          if ($err) {    
      
            echo "cURL Error #:" . $err;    
                                                         
          } else {    
              // parse response headers from string to array    
              $response_headers = [];    
              $response_headers_string = substr($response, 0, strpos($response, "\r\n\r\n"));    
              foreach (explode("\r\n", $response_headers_string) as $i => $line) {    
                  if ($i === 0) {    
                      $response_headers['http_code'] = $line;    
                  } else {    
                      list ($key, $value) = explode(': ', $line);    
                      $response_headers[$key] = $value;    
                  }    
              }                                                 
                                                            
              $destination = $response_headers["Location"];    
              return response()    
                  ->noContent()    
                  ->header('Access-Control-Expose-Headers', 'Location')    
                  ->header('Access-Control-Allow-Headers', '*')    
                  ->header('Access-Control-Allow-Origin', '*')                                              
                  ->header('Location', $destination);    
          }

J

Jonathan Malko•8/25/23, 7:52 PM

making these changes would make it work in place of the JS/webworker example in your "get it working fast" example, which I assume you want devs to copy-paste to see how easy it is: https://developers.cloudflare.com/stream/uploading-videos/direct-creator-uploads/#advanced-upload-flow-using-tus-for-large-videos

Direct creator uploads · Cloudflare Stream docs

Direct creator uploads let your end users to upload videos directly to Cloudflare Stream, without exposing your API token to clients.

J

Jonathan Malko•8/25/23, 7:52 PM

*the response would need to be reworked for plain PHP, i'm using laravel

J

Jonathan Malko•8/25/23, 7:53 PM

you're welcome, I hope it helps!

S

Spunkie•8/25/23, 8:50 PM

Does the

Run and edit this code...

Run and edit this code...

Run and edit this code...

Run and edit this code... link here work for anyone else?
https://developers.cloudflare.com/stream/examples/stream-player/

Stream Player · Cloudflare Stream docs

Run and edit this code in your browser on StackBlitz.

I'm trying to grok the Stream pricing. Did I get this right? Starting to use the service costs me 5$

Similar Threads