hi, I'm attempting to use cloudflare stream as an OEmbed into a Squarespace template.. the standard

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

ZekeOP•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

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...

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.

뽀

뽀삐2•8/27/23, 5:50 AM

Does Cloudflare Stream charge $1 per 1,000 minutes of streaming regardless of the number of viewers when streaming with the whip protocol?

Y

yapa•8/27/23, 7:44 PM

hey guys, i have a 201MB video, ( DOWNLOAD Mbps 125.85,UPLOAD Mbps 11.18)i cannot upload long videos whereas 36MB videos upload smoothly what might be getting wrong(once uploaded it plays seamlessly ), what might be wrong

Y

yapa•8/27/23, 7:44 PM

?

J

jivan•8/28/23, 4:44 AM

Streams webhook are not working.
I want webhooks to fire when stream start & stop, but it seems they are not being fired.
Here's my account ID - 51f88263baaa48f7b80752a2b3f6576a
Is it a bug or it needs to be enable ?

A

alphaβiota | Ekonavi•8/28/23, 5:36 PM

Hi! How can I get bundle without canceling images and risking interruption of service? I just want to add video steaming. This feels like bad UX to me. Please help!

M

mailman•8/28/23, 5:53 PM

Hi! I've had some videos that I've streamed get stuck with their status as "Live" even when I stop streaming to that Live Input. Whenever I go to delete the video, I get a "Not Implemented (Code: 10046)" error with message "You cannot delete in-progress live video. Conclude the live stream and try again.". Because of this, I've slowly had a pile up of videos that are stuck on "Live" that I cannot delete. Does anyone know how to resolve this issue? Alternatively, is there an API-based workaround to reset/force deletion?

Here is the video id of one such video: d2561f193e79399456e9e52a1ed163a0

Aalphaβiota | Ekonavi Hi! How can I get bundle without canceling images and risking interruption of se...

N

Nat•8/28/23, 6:06 PM

I got stuck on the same thing. I thankfully ran into this before launching my product but I agree, its rough UX for anyone building a user-facing product.

Jjivan Streams webhook are not working. I want webhooks to fire when stream start & sto...

J

jivan•8/29/23, 1:49 PM

Webhook notifications for stream start and stop are not triggering. Can anyone help here please ?

J

Jeff•8/29/23, 2:02 PM

Is it possible to specify allowed origins within a signed URL?

I need to dynamically change the domains allowed for a stream often enough that hitting the Cloudflare API to do this for each video wouldn't be possible

J

Jeff•8/29/23, 7:29 PM

Is there a way to start a video at a specific point in time when the video loads?

Normally on youtube you can add ?t=120 to the URL to do this...does Stream have that functionality?

Lla.x.rc Did it happen recently or it has been happening for a while?

M

mailman•8/29/23, 8:16 PM

I have 6 videos stuck in this state, the oldest one is from 3 months ago and the most recent one is from 22 days ago

hi, I'm attempting to use cloudflare stream as an OEmbed into a Squarespace template.. the standard

Similar Threads

Similar Threads

Similar Threads