← Cloudflare Pages / pages / configuration

REST API

Pages API позволяет создавать автоматизации и встраивать Pages в процесс разработки. На высоком уровне конечные точки API дают возможность управлять развёртываниями и сборками, а также настраивать проекты. Cloudflare поддерживает Deploy Hooks для деплоев headless CMS. Обратитесь к Документация по API ↗ для подробного описания типов объектов и эндпоинтов.

Как использовать API

Получите API-токен

Чтобы создать API-токен:

На панели управления Cloudflare перейдите к разделу Токены API аккаунта страницу.
Перейдите в Токены API аккаунта ↗
Выберите Create Token.
Можно перейти в Edit Cloudflare Workers шаблон > Используйте шаблон или перейдите в Create Custom Token > Начало работы. Если вы создаете собственный токен, обязательно добавьте Cloudflare Pages разрешение с Изменить доступ.

Отправка запросов

После создания токена вы можете проходить аутентификацию и отправлять запросы к API, указывая API-токен в заголовках запроса. Например, вот запрос API для получения всех деплоев проекта.

Необходимые разрешения API-токена

Хотя бы одно из следующих права доступа токена требуется:

Pages Read
Pages Write

Получите развёртывания

curl "https://api.cloudflare.com/client/v4/accounts/$ACCOUNT_ID/pages/projects/$PROJECT_NAME/deployments" \
	--request GET \
	--header "Authorization: Bearer $CLOUDFLARE_API_TOKEN"

Попробуйте на одном из своих проектов, заменив {account_id}, {project_name}, а также <API_TOKEN>. См. Найдите идентификатор своей учётной записи (Account ID), где это описано подробнее.

Примеры

API становится ещё мощнее в сочетании с Cloudflare Workers: самым простым способом развёртывания бессерверных функций в глобальной сети Cloudflare. В следующем разделе приведены три примера кода по использованию Pages API. Чтобы собрать и развернуть эти примеры, см. Руководство по началу работы.

Запуск новой сборки каждый час

Предположим, у вас есть CMS, которая собирает данные из актуальных источников для формирования статического вывода. Чтобы статический контент оставался максимально актуальным, вы можете периодически запускать новые сборки через API.

const endpoint =
	"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";

export default {
	async scheduled(_, env) {
		const init = {
			method: "POST",
			headers: {
				"Content-Type": "application/json;charset=UTF-8",
				// We recommend you store the API token as a secret using the Workers dashboard or using Wrangler as documented here: https://developers.cloudflare.com/workers/wrangler/commands/general/#secret
				Authorization: `Bearer ${env.API_TOKEN}`,
			},
		};

		await fetch(endpoint, init);
	},
};

После того как вы развернёте JavaScript Worker, настройте в нём cron trigger, чтобы скрипт запускался периодически. См. Cron Triggers для дополнительных сведений.

Удаление старых развёртываний через неделю

Cloudflare Pages размещает и обслуживает все развёртывания проекта по ссылкам предварительного просмотра. Допустим, вы хотите сохранить проект приватным и закрыть доступ к старым развёртываниям. Вы можете удалять развёртывания через API спустя месяц, чтобы они больше не были общедоступны онлайн. Последнее развёртывание ветки удалить нельзя.

const endpoint =
	"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";
const expirationDays = 7;

export default {
	async scheduled(_, env) {
		const init = {
			headers: {
				"Content-Type": "application/json;charset=UTF-8",
				// We recommend you store the API token as a secret using the Workers dashboard or using Wrangler as documented here: https://developers.cloudflare.com/workers/wrangler/commands/general/#secret
				Authorization: `Bearer ${env.API_TOKEN}`,
			},
		};

		const response = await fetch(endpoint, init);
		const deployments = await response.json();

		for (const deployment of deployments.result) {
			// Check if the deployment was created within the last x days (as defined by `expirationDays` above)
			if (
				(Date.now() - new Date(deployment.created_on)) / 86400000 >
				expirationDays
			) {
				// Delete the deployment
				await fetch(`${endpoint}/${deployment.id}`, {
					method: "DELETE",
					headers: {
						"Content-Type": "application/json;charset=UTF-8",
						Authorization: `Bearer ${env.API_TOKEN}`,
					},
				});
			}
		}
	},
};

После того как вы развернёте JavaScript Worker, вы можете настроить в нём cron trigger, чтобы скрипт запускался периодически. См. Руководство по Cron Triggers для дополнительных сведений.

Представьте, что вы работаете в команде разработки, которая использует Pages для создания сайтов. Вам нужен простой способ делиться ссылками на предпросмотр развертывания и статусом сборки, не раскрывая при этом доступ к аккаунтам Cloudflare. С помощью API можно легко предоставлять информацию о проекте, включая статус развертывания и ссылки на предпросмотр, а также отдавать этот контент в виде HTML из Cloudflare Worker.

const deploymentsEndpoint =
	"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";
const projectEndpoint =
	"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}";

export default {
	async fetch(request, env) {
		const init = {
			headers: {
				"content-type": "application/json;charset=UTF-8",
				// We recommend you store the API token as a secret using the Workers dashboard or using Wrangler as documented here: https://developers.cloudflare.com/workers/wrangler/commands/general/#secret
				Authorization: `Bearer ${env.API_TOKEN}`,
			},
		};

		const style = `body { padding: 6em; font-family: sans-serif; } h1 { color: #f6821f }`;
		let content = "<h2>Project</h2>";

		let response = await fetch(projectEndpoint, init);
		const projectResponse = await response.json();
		content += `<p>Project Name: ${projectResponse.result.name}</p>`;
		content += `<p>Project ID: ${projectResponse.result.id}</p>`;
		content += `<p>Pages Subdomain: ${projectResponse.result.subdomain}</p>`;
		content += `<p>Domains: ${projectResponse.result.domains}</p>`;
		content += `<a href="${projectResponse.result.canonical_deployment.url}"><p>Latest preview: ${projectResponse.result.canonical_deployment.url}</p></a>`;

		content += `<h2>Deployments</h2>`;
		response = await fetch(deploymentsEndpoint, init);
		const deploymentsResponse = await response.json();

		for (const deployment of deploymentsResponse.result) {
			content += `<a href="${deployment.url}"><p>Deployment: ${deployment.id}</p></a>`;
		}

		let html = `
      <!DOCTYPE html>
      <head>
        <title>Example Pages Project</title>
      </head>
      <body>
        <style>${style}</style>
        <div id="container">
          ${content}
        </div>
      </body>`;

		return new Response(html, {
			headers: {
				"Content-Type": "text/html;charset=UTF-8",
			},
		});
	},
};