← Cloudflare Stream / stream / edit-videos

Použití vodoznaků

K videím nahraným přes Stream API můžete přidávat vodoznaky.

Chcete-li k videím přidat vodoznaky, nejprve vytvořte profil vodoznaku. Profil vodoznaku popisuje obrázek, který chcete použít jako vodoznak, a jeho polohu. Jakmile profil vodoznaku vytvoříte, můžete ho použít jako volbu při nahrávání videí.

Rychlý start

Profil vodoznaku nabízí řadu možností přizpůsobení, výchozí parametry ale ve většině případů postačí. Podrobnosti najdete níže v části „Profiles“.

Krok 1: Vytvořte profil

curl -X POST -H 'Authorization: Bearer <API_TOKEN>' \
-F file=@/Users/rchen/cloudflare.png \
https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream/watermarks

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

const watermark = await client.stream.watermarks.create({
	account_id: '<ACCOUNT_ID>',
	file: '@/path/to/image.png',
	name: 'marketing videos',
});

Podívejte se na celý Stream Referenční dokumentace REST API a SDK kde najdete podrobnosti o používání REST API z externích aplikací, včetně předpřipravených SDK pro externí aplikace v TypeScriptu, Pythonu nebo Go.

export default {
	async fetch(request, env, ctx): Promise<Response> {
		const response = await fetch("https://example.com/cloudflare.png");
		const readableStream = response.body!;
		const watermark = await env.STREAM.watermarks.generate(readableStream, {
			name: "marketing videos",
		});
		return new Response(JSON.stringify({ watermark }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

Krok 2: Zadejte UID profilu při nahrávání

tus-upload --chunk-size 5242880 \
--header Authentication 'Bearer <API_TOKEN>' \
--metadata watermark <WATERMARK_UID> \
/Users/rchen/cat.mp4 https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

const video = await client.stream.copy.create({
	account_id: '<ACCOUNT_ID>',
	url: 'https://example.com/video.mp4',
	watermark: { uid: '<WATERMARK_UID>' },
});

export default {
	async fetch(request, env, ctx): Promise<Response> {
		const video = await env.STREAM.upload(
			"https://example.com/video.mp4",
			{ watermarkId: "<WATERMARK_UID>" },
		);
		return new Response(JSON.stringify({ video }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

Krok 3: Hotovo

Snímek obrazovky videa s vodoznakem Cloudflare vpravo nahoře

Profily

Chcete-li profil vytvořit, vypsat, odstranit nebo o něm získat informace, budete potřebovat svůj Token Cloudflare API ↗.

Volitelné parametry

name řetězec, výchozí hodnota: prázdný řetězec
- Krátký popis profilu, například „marketingová videa“.
opacity float výchozí: 1.0
- Průhlednost vodoznaku. Hodnota 0.0 znamená úplně průhledný, hodnota 1.0 úplně neprůhledný. Pokud je vodoznak již částečně průhledný, nastavení hodnoty na 1.0 ho zcela neprůhledným neudělá.
padding float výchozí: 0.05
- Prázdný prostor mezi přiléhajícími okraji (určenými polohou) videa a vodoznaku. Hodnota 0.0 znamená bez odsazení, hodnota 1.0 znamená odsazení na celou šířku nebo délku videa.
- Stream zajistí, že vodoznak zůstane přibližně na stejné pozici i u videí s různými rozměry.
scale float výchozí: 0.15
- Velikost vodoznaku vzhledem k celkové velikosti videa. Tento parametr se automaticky přizpůsobí horizontálním i vertikálním videím. Hodnota 0.0 znamená bez změny velikosti (použije se původní velikost vodoznaku) a hodnota 1.0 vyplní celé video.
- Algoritmus zajistí, že vodoznak bude vypadat přibližně stejně velký u videí s různými rozměry.
position řetězec (enum), výchozí hodnota: "upperRight"
- Umístění vodoznaku. Platné hodnoty jsou: upperRight, upperLeft, lowerLeft, lowerRight, a center.
  
  Poznámka
  Poznámka
  Upozorňujeme, že center bude ignorovat padding .

Vytvoření profilu vodoznaku

Případ použití 1: Přímé nahrání místního souboru obrázku

Chcete-li nahrát obrázek přímo, odešlete požadavek POST pomocí multipart/form-data jako content-type a soubor zadejte pod file klíč. Všechna ostatní pole jsou volitelná.

curl -X POST -H "Authorization: Bearer <API_TOKEN>" \
-F file=@{path-to-image-locally} \
-F name='marketing videos' \
-F opacity=1.0 \
-F padding=0.05 \
-F scale=0.15 \
-F position=upperRight \
https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream/watermarks

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

const watermark = await client.stream.watermarks.create({
	account_id: '<ACCOUNT_ID>',
	file: '@/path/to/image.png',
	name: 'marketing videos',
	opacity: 1.0,
	padding: 0.05,
	scale: 0.15,
	position: 'upperRight',
});

export default {
	async fetch(request, env, ctx): Promise<Response> {
		const response = await fetch("https://example.com/cloudflare.png");
		const readableStream = response.body!;
		const watermark = await env.STREAM.watermarks.generate(readableStream, {
			name: "marketing videos",
			opacity: 1.0,
			padding: 0.05,
			scale: 0.15,
			position: "upperRight",
		});
		return new Response(JSON.stringify({ watermark }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

Případ použití 2: Předání URL obrázku

Chcete-li zadat adresu URL pro nahrání, odešlete požadavek POST pomocí application/json jako content-type a umístění souboru zadejte pomocí url klíč. Všechna ostatní pole jsou volitelná.

export default {
	async fetch(request, env, ctx): Promise<Response> {
		const watermark = await env.STREAM.watermarks.generate(
			"https://example.com/logo.png",
			{
				name: "marketing videos",
				opacity: 1.0,
				padding: 0.05,
				scale: 0.15,
				position: "upperRight",
			},
		);
		return new Response(JSON.stringify({ watermark }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

curl -X POST -H "Authorization: Bearer <API_TOKEN>" \
-H 'Content-Type: application/json' \
-d '{
  "url": "{url-to-image}",
  "name": "marketing videos",
  "opacity": 1.0,
  "padding": 0.05,
  "scale": 0.15,
  "position": "upperRight"
}' \
https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream/watermarks

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

// The TypeScript SDK does not support URL-based watermark creation.
// Use the file-based approach instead:
const watermark = await client.stream.watermarks.create({
	account_id: '<ACCOUNT_ID>',
	file: '@/path/to/image.png',
	name: 'marketing videos',
	opacity: 1.0,
	padding: 0.05,
	scale: 0.15,
	position: 'upperRight',
});

Ukázková odpověď na vytvoření profilu vodoznaku

{
  "result": {
    "uid": "d6373709b7681caa6c48ef2d8c73690d",
    "size": 11248,
    "height": 240,
    "width": 720,
    "created": "2020-07-29T00:16:55.719265Z",
    "downloadedFrom": null,
    "name": "marketing videos",
    "opacity": 1.0,
    "padding": 0.05,
    "scale": 0.15,
    "position": "upperRight"
  },
  "success": true,
  "errors": [],
  "messages": []
}

downloadedFrom bude vyplněno, pokud byl profil vytvořen stažením z URL adresy.

Použití profilu vodoznaku na video

Po vytvoření profilu watermarku ho můžete použít při nahrávání videí k jejich označení watermarkem.

Základní nahrávání

Stream bohužel v současnosti neumožňuje zadat profil vodoznaku při nahrávání pomocí Basic Uploads.

Nahrání videa pomocí odkazu

export default {
	async fetch(request, env, ctx): Promise<Response> {
		const video = await env.STREAM.upload(
			"https://example.com/video.mp4",
			{ watermarkId: "<WATERMARK_UID>" },
		);
		return new Response(JSON.stringify({ video }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

curl -X POST -H "Authorization: Bearer <API_TOKEN>" \
-H 'Content-Type: application/json' \
-d '{
  "url": "{url-to-video}",
  "watermark": {
    "uid": "<WATERMARK_UID>"
  }
}' \
https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream/copy

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

const video = await client.stream.copy.create({
	account_id: '<ACCOUNT_ID>',
	url: 'https://example.com/video.mp4',
	watermark: { uid: '<WATERMARK_UID>' },
});

Ukázková odpověď na nahrání videa pomocí odkazu

{
  "result": {
    "uid": "8d3a5b80e7437047a0fb2761e0f7a645",
    "thumbnail": "https://customer-f33zs165nr7gyfy4.cloudflarestream.com/6b9e68b07dfee8cc2d116e4c51d6a957/thumbnails/thumbnail.jpg",

    "playback": {
      "hls": "https://customer-f33zs165nr7gyfy4.cloudflarestream.com/6b9e68b07dfee8cc2d116e4c51d6a957/manifest/video.m3u8",
      "dash": "https://customer-f33zs165nr7gyfy4.cloudflarestream.com/6b9e68b07dfee8cc2d116e4c51d6a957/manifest/video.mpd"
    },
    "watermark": {
      "uid": "d6373709b7681caa6c48ef2d8c73690d",
      "size": 11248,
      "height": 240,
      "width": 720,
      "created": "2020-07-29T00:16:55.719265Z",
      "downloadedFrom": null,
      "name": "marketing videos",
      "opacity": 1.0,
      "padding": 0.05,
      "scale": 0.15,
      "position": "upperRight"
    }

}

Nahrání videa pomocí tus

tus-upload --chunk-size 5242880 \
--header Authentication 'Bearer <API_TOKEN>' \
--metadata watermark <WATERMARK_UID> \
<PATH_TO_VIDEO> https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream

Direct creator uploads

Video nahrané pomocí vygenerované jedinečné jednorázové adresy URL bude opatřeno vodoznakem podle zadaného profilu.

export default {
	async fetch(request, env, ctx): Promise<Response> {
		const directUpload = await env.STREAM.createDirectUpload({
			maxDurationSeconds: 3600,
			watermark: { id: "<WATERMARK_UID>" },
		});
		return new Response(JSON.stringify({ directUpload }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

curl -X POST -H "Authorization: Bearer <API_TOKEN>" \
-H 'Content-Type: application/json' \
-d '{
  "maxDurationSeconds": 3600,
  "watermark": {
    "uid": "<WATERMARK_UID>"
  }
}' \
https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream/direct_upload

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

const directUpload = await client.stream.directUpload.create({
	account_id: '<ACCOUNT_ID>',
	maxDurationSeconds: 3600,
	watermark: { uid: '<WATERMARK_UID>' },
});

Ukázková odpověď na přímá nahrávání uživatelů

{
  "result": {
    "uploadURL": "https://upload.videodelivery.net/c32d98dd671e4046a33183cd5b93682b",
    "uid": "c32d98dd671e4046a33183cd5b93682b",
    "watermark": {
      "uid": "d6373709b7681caa6c48ef2d8c73690d",
      "size": 11248,
      "height": 240,
      "width": 720,
      "created": "2020-07-29T00:16:55.719265Z",
      "downloadedFrom": null,
      "name": "marketing videos",
      "opacity": 1.0,
      "padding": 0.05,
      "scale": 0.15,
      "position": "upperRight"
    }
  },
  "success": true,
  "errors": [],
  "messages": []
}

watermark bude null pokud nebyl zadán žádný vodoznak.

Získání profilu vodoznaku

Chcete-li zobrazit vámi vytvořený profil vodoznaku:

export default {
	async fetch(request, env, ctx): Promise<Response> {
		const watermark = await env.STREAM.watermarks.get("<WATERMARK_UID>");
		return new Response(JSON.stringify({ watermark }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

curl -H "Authorization: Bearer <API_TOKEN>" \
https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream/watermarks/<WATERMARK_UID>

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

const watermark = await client.stream.watermarks.get(
	'<WATERMARK_UID>',
	{ account_id: '<ACCOUNT_ID>' },
);

Ukázková odpověď na získání profilu vodoznaku

{
  "result": {
    "uid": "d6373709b7681caa6c48ef2d8c73690d",
    "size": 11248,
    "height": 240,
    "width": 720,
    "created": "2020-07-29T00:16:55.719265Z",
    "downloadedFrom": null,
    "name": "marketing videos",
    "opacity": 1.0,
    "padding": 0.05,
    "scale": 0.15,
    "position": "center"
  },
  "success": true,
  "errors": [],
  "messages": []
}

Výpis profilů vodoznaků

Chcete-li vypsat vámi vytvořené profily vodoznaku:

export default {
	async fetch(request, env, ctx): Promise<Response> {
		const watermarks = await env.STREAM.watermarks.list();
		return new Response(JSON.stringify({ watermarks }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

curl -H "Authorization: Bearer <API_TOKEN>" \
https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream/watermarks/

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

const watermarks = await client.stream.watermarks.list({
	account_id: '<ACCOUNT_ID>',
});

Ukázková odpověď na výpis profilů vodoznaků

{
  "result": [
    {
      "uid": "9de16afa676d64faaa7c6c4d5047e637",
      "size": 207710,
      "height": 626,
      "width": 1108,
      "created": "2020-07-29T00:23:35.918472Z",
      "downloadedFrom": null,
      "name": "marketing videos",
      "opacity": 1.0,
      "padding": 0.05,
      "scale": 0.15,
      "position": "upperLeft"
    },
    {
      "uid": "9c50cff5ab16c4aec0bcb03c44e28119",
      "size": 207710,
      "height": 626,
      "width": 1108,
      "created": "2020-07-29T00:16:46.735377Z",
      "downloadedFrom": "https://company.com/logo.png",
      "name": "internal training videos",
      "opacity": 1.0,
      "padding": 0.05,
      "scale": 0.15,
      "position": "center"
    }
  ],
  "success": true,
  "errors": [],
  "messages": []
}

Odstranění profilu vodoznaku

Chcete-li odstranit vámi vytvořený profil vodoznaku:

export default {
	async fetch(request, env, ctx): Promise<Response> {
		await env.STREAM.watermarks.delete("<WATERMARK_UID>");
		return new Response(JSON.stringify({ success: true }));
	},
} satisfies ExportedHandler<{ STREAM: StreamBinding }>;

{
	"$schema": "node_modules/wrangler/config-schema.json",
	"name": "<ENTER_WORKER_NAME>",
	"main": "src/index.ts",
	"compatibility_date": "$today",
	"observability": {
		"enabled": true
	},
	"stream": {
		"binding": "STREAM"
	}
}

Podívejte se na celý Referenční dokumentace API pro Workers Stream binding.

curl -X DELETE -H 'Authorization: Bearer <API_TOKEN>' \
https://api.cloudflare.com/client/v4/accounts/<ACCOUNT_ID>/stream/watermarks/<WATERMARK_UID>

const client = new Cloudflare({
	apiEmail: process.env['CLOUDFLARE_EMAIL'],
	apiKey: process.env['CLOUDFLARE_API_KEY'],
});

await client.stream.watermarks.delete(
	'<WATERMARK_UID>',
	{ account_id: '<ACCOUNT_ID>' },
);

Pokud byla operace úspěšná, vrátí se úspěšná odpověď:

{
  "result": "",
  "success": true,
  "errors": [],
  "messages": []
}

Omezení

Jakmile je profil watermarku vytvořen, nelze už měnit jeho parametry. Pokud potřebujete profil upravit, smažte ho a vytvořte nový.
Jakmile je watermark na video aplikován, nelze ho změnit jinak než opětovným nahráním videa s jiným profilem.
Jakmile je na video aplikován watermark, smazání profilu watermarku ho z videa neodstraní.
Maximální velikost souboru je 2MiB (2097152 bajtů) a podporovány jsou pouze soubory PNG.