Videos

HTML Form Browser Video Uploads

Create a temporary upload URL on your server, then send the video directly from the browser.

1. Generate Upload URL on the Server

GET https://api.dyntube.com/v1/uploads/browser-upload-url

Call this endpoint from your server with your API key. Use the returned URL in the browser to upload files with an HTML form.

Headers

Name / Type / Description
NameTypeDescription
AuthorizationStringBearer \[API TOKEN]

200: OK

example
"https://upload.dyntube.com/v1/videos/browser?token=eyJ..."

2. Upload Videos with an HTML Form

  • Add the video file to a form field named file.
  • Use multipart/form-data.
  • Optional fields, such as projectId, can be included in the same form.

Upload by File

POST ...GENERATED URL IN STEP 1...

Request Body

Name / Type / Description
NameTypeDescription
projectIdStringProject ID
file*FileFile to upload
titleStringVideo title
descriptionStringVideo description
tagsStringVideo tags, add multiple tags by adding the 'tags' field multiple times in your POST request with different values.

200: OK

example
{
    "videoKey": "hgor6PnFQ",
    "uploadId": "3060c035-95ec-76495564",
    "videoId": "DTQ5It1KwNg",
    "channelKey": "u3u0iNPlL1Bg",
    "privateLink": "pheF3ukFQQ",
    "iframeLink": "klGiWrxW0nPzxw"
}

Code samples

HTML + JavaScript (browser)

html
<form id="uploadForm" enctype="multipart/form-data">
  <input type="file" name="file" required />
  <button type="submit">Upload</button>
</form>
<pre id="result"></pre>

<script>
async function getBrowserUrl() {
  // Your server endpoint calls DynTube with the API key and returns only the temporary upload URL.
  const res = await fetch('/api/dyntube-browser-upload-url');
  if (!res.ok) throw new Error('Could not create upload URL');
  return res.text();
}

document.getElementById('uploadForm').addEventListener('submit', async (event) => {
  event.preventDefault();
  const uploadUrl = await getBrowserUrl();
  const formData = new FormData(event.currentTarget);
  const res = await fetch(uploadUrl, { method: 'POST', body: formData });
  document.getElementById('result').textContent = await res.text();
});
</script>

C# (fetch token server-side, post from server if needed)

csharp
using System.Net.Http;
using System.Net.Http.Headers;
using System.Threading.Tasks;

var client = new HttpClient();
client.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer", "YOUR_API_KEY");
var uploadUrl = await client.GetStringAsync("https://api.dyntube.com/v1/uploads/browser-upload-url");
// uploadUrl is the pre-signed endpoint to use from the browser or server with multipart/form-data

Node.js (fetch token server-side)

javascript
import axios from 'axios';

const { data: uploadUrl } = await axios.get(
  'https://api.dyntube.com/v1/uploads/browser-upload-url',
  { headers: { Authorization: 'Bearer YOUR_API_KEY' } }
);
console.log(uploadUrl);

Python (fetch token server-side)

python
import requests

resp = requests.get(
    'https://api.dyntube.com/v1/uploads/browser-upload-url',
    headers={'Authorization': 'Bearer YOUR_API_KEY'}
)
resp.raise_for_status()
print(resp.text)

PHP (fetch token server-side)

php
<?php
$ch = curl_init("https://api.dyntube.com/v1/uploads/browser-upload-url");
curl_setopt_array($ch, [
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_HTTPHEADER => ["Authorization: Bearer YOUR_API_KEY"]
]);
$uploadUrl = curl_exec($ch);
curl_close($ch);
echo $uploadUrl;

Notes

  • The generated URL expires in 24 hours; regenerate daily.
  • The browser POST uses the tokenized URL and does not expose your API key.
  • Video upload via file for server-side file uploads.
  • Video upload via URL when DynTube should fetch the source file.
  • Get video status to check processing after browser upload.
  • Setting up webhooks to receive upload and publish notifications.

Something missing or wrong here? Tell us and we will correct it. New to DynTube? Start with uploading and embedding.