Skip to content

Commit 516ee55

Browse files
GregBrimbleGregBrimble
committed
Add banner to Pages
1 parent c27097f commit 516ee55

File tree

125 files changed

+1074
-478
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

125 files changed

+1074
-478
lines changed

‎src/content/docs/pages/configuration/api.mdx‎

Lines changed: 93 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11
---
22
pcx_content_type: concept
33
title: REST API
4-
4+
banner:
5+
content: We recommend using <strong>Cloudflare Workers</strong> for new projects. For existing Pages projects, see our <a href="/workers/static-assets/migrate-from-pages/">migration guide</a> and <a href="/workers/static-assets/migrate-from-pages/#compatibility-matrix">compatibility matrix</a>.
6+
type: note
7+
dismissible:
8+
id: pages-migrate-to-workers
59
---
610

711
The [Pages API](/api/resources/pages/subresources/projects/methods/list/) empowers you to build automations and integrate Pages with your development workflow. At a high level, the API endpoints let you manage deployments and builds and configure projects. Cloudflare supports [Deploy Hooks](/pages/configuration/deploy-hooks/) for headless CMS deployments. Refer to the [API documentation](https://api.cloudflare.com/) for a full breakdown of object types and endpoints.
@@ -37,22 +41,23 @@ The API is even more powerful when combined with Cloudflare Workers: the easiest
3741
Suppose we have a CMS that pulls data from live sources to compile a static output. You can keep the static content as recent as possible by triggering new builds periodically using the API.
3842

3943
```js
40-
const endpoint = "https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";
44+
const endpoint =
45+
"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";
4146

4247
export default {
43-
async scheduled(_, env) {
44-
const init = {
45-
method: "POST",
46-
headers: {
47-
"Content-Type": "application/json;charset=UTF-8",
48-
// 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/#secret
49-
"Authorization": `Bearer ${env.API_TOKEN}`,
50-
},
51-
};
52-
53-
await fetch(endpoint, init);
54-
}
55-
}
48+
async scheduled(_, env) {
49+
const init = {
50+
method: "POST",
51+
headers: {
52+
"Content-Type": "application/json;charset=UTF-8",
53+
// 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/#secret
54+
Authorization: `Bearer ${env.API_TOKEN}`,
55+
},
56+
};
57+
58+
await fetch(endpoint, init);
59+
},
60+
};
5661
```
5762

5863
After you have deployed the JavaScript Worker, set a cron trigger in your Worker to run this script periodically. Refer to [Cron Triggers](/workers/configuration/cron-triggers/) for more details.
@@ -62,37 +67,41 @@ After you have deployed the JavaScript Worker, set a cron trigger in your Worker
6267
Cloudflare Pages hosts and serves all project deployments on preview links. Suppose you want to keep your project private and prevent access to your old deployments. You can use the API to delete deployments after a month, so that they are no longer public online. The latest deployment for a branch cannot be deleted.
6368

6469
```js
65-
const endpoint = "https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";
70+
const endpoint =
71+
"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";
6672
const expirationDays = 7;
6773

6874
export default {
69-
async scheduled(_, env) {
70-
const init = {
71-
headers: {
72-
"Content-Type": "application/json;charset=UTF-8",
73-
// 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/#secret
74-
"Authorization": `Bearer ${env.API_TOKEN}`,
75-
},
76-
};
77-
78-
const response = await fetch(endpoint, init);
79-
const deployments = await response.json();
80-
81-
for (const deployment of deployments.result) {
82-
// Check if the deployment was created within the last x days (as defined by `expirationDays` above)
83-
if ((Date.now() - new Date(deployment.created_on)) / 86400000 > expirationDays) {
84-
// Delete the deployment
85-
await fetch(`${endpoint}/${deployment.id}`, {
86-
method: "DELETE",
87-
headers: {
88-
"Content-Type": "application/json;charset=UTF-8",
89-
"Authorization": `Bearer ${env.API_TOKEN}`,
90-
},
91-
});
92-
}
93-
}
94-
}
95-
}
75+
async scheduled(_, env) {
76+
const init = {
77+
headers: {
78+
"Content-Type": "application/json;charset=UTF-8",
79+
// 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/#secret
80+
Authorization: `Bearer ${env.API_TOKEN}`,
81+
},
82+
};
83+
84+
const response = await fetch(endpoint, init);
85+
const deployments = await response.json();
86+
87+
for (const deployment of deployments.result) {
88+
// Check if the deployment was created within the last x days (as defined by `expirationDays` above)
89+
if (
90+
(Date.now() - new Date(deployment.created_on)) / 86400000 >
91+
expirationDays
92+
) {
93+
// Delete the deployment
94+
await fetch(`${endpoint}/${deployment.id}`, {
95+
method: "DELETE",
96+
headers: {
97+
"Content-Type": "application/json;charset=UTF-8",
98+
Authorization: `Bearer ${env.API_TOKEN}`,
99+
},
100+
});
101+
}
102+
}
103+
},
104+
};
96105
```
97106

98107
After you have deployed the JavaScript Worker, you can set a cron trigger in your Worker to run this script periodically. Refer to the [Cron Triggers guide](/workers/configuration/cron-triggers/) for more details.
@@ -103,40 +112,40 @@ Imagine you are working on a development team using Pages to build your websites
103112

104113
```js
105114
const deploymentsEndpoint =
106-
"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";
115+
"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}/deployments";
107116
const projectEndpoint =
108-
"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}";
117+
"https://api.cloudflare.com/client/v4/accounts/{account_id}/pages/projects/{project_name}";
109118

110119
export default {
111-
async fetch(request, env) {
112-
const init = {
113-
headers: {
114-
"content-type": "application/json;charset=UTF-8",
115-
// 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/#secret
116-
"Authorization": `Bearer ${env.API_TOKEN}`,
117-
},
118-
};
119-
120-
const style = `body { padding: 6em; font-family: sans-serif; } h1 { color: #f6821f }`;
121-
let content = "<h2>Project</h2>";
122-
123-
let response = await fetch(projectEndpoint, init);
124-
const projectResponse = await response.json();
125-
content += `<p>Project Name: ${projectResponse.result.name}</p>`;
126-
content += `<p>Project ID: ${projectResponse.result.id}</p>`;
127-
content += `<p>Pages Subdomain: ${projectResponse.result.subdomain}</p>`;
128-
content += `<p>Domains: ${projectResponse.result.domains}</p>`;
129-
content += `<a href="${projectResponse.result.canonical_deployment.url}"><p>Latest preview: ${projectResponse.result.canonical_deployment.url}</p></a>`;
130-
131-
content += `<h2>Deployments</h2>`;
132-
response = await fetch(deploymentsEndpoint, init);
133-
const deploymentsResponse = await response.json();
134-
135-
for (const deployment of deploymentsResponse.result) {
136-
content += `<a href="${deployment.url}"><p>Deployment: ${deployment.id}</p></a>`;
137-
}
138-
139-
let html = `
120+
async fetch(request, env) {
121+
const init = {
122+
headers: {
123+
"content-type": "application/json;charset=UTF-8",
124+
// 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/#secret
125+
Authorization: `Bearer ${env.API_TOKEN}`,
126+
},
127+
};
128+
129+
const style = `body { padding: 6em; font-family: sans-serif; } h1 { color: #f6821f }`;
130+
let content = "<h2>Project</h2>";
131+
132+
let response = await fetch(projectEndpoint, init);
133+
const projectResponse = await response.json();
134+
content += `<p>Project Name: ${projectResponse.result.name}</p>`;
135+
content += `<p>Project ID: ${projectResponse.result.id}</p>`;
136+
content += `<p>Pages Subdomain: ${projectResponse.result.subdomain}</p>`;
137+
content += `<p>Domains: ${projectResponse.result.domains}</p>`;
138+
content += `<a href="${projectResponse.result.canonical_deployment.url}"><p>Latest preview: ${projectResponse.result.canonical_deployment.url}</p></a>`;
139+
140+
content += `<h2>Deployments</h2>`;
141+
response = await fetch(deploymentsEndpoint, init);
142+
const deploymentsResponse = await response.json();
143+
144+
for (const deployment of deploymentsResponse.result) {
145+
content += `<a href="${deployment.url}"><p>Deployment: ${deployment.id}</p></a>`;
146+
}
147+
148+
let html = `
140149
<!DOCTYPE html>
141150
<head>
142151
<title>Example Pages Project</title>
@@ -148,17 +157,17 @@ export default {
148157
</div>
149158
</body>`;
150159

151-
return new Response(html, {
152-
headers: {
153-
"Content-Type": "text/html;charset=UTF-8",
154-
},
155-
});
156-
}
157-
}
160+
return new Response(html, {
161+
headers: {
162+
"Content-Type": "text/html;charset=UTF-8",
163+
},
164+
});
165+
},
166+
};
158167
```
159168

160169
## Related resources
161170

162-
* [Pages API Docs](/api/resources/pages/subresources/projects/methods/list/)
163-
* [Workers Getting Started Guide](/workers/get-started/guide/)
164-
* [Workers Cron Triggers](/workers/configuration/cron-triggers/)
171+
- [Pages API Docs](/api/resources/pages/subresources/projects/methods/list/)
172+
- [Workers Getting Started Guide](/workers/get-started/guide/)
173+
- [Workers Cron Triggers](/workers/configuration/cron-triggers/)

‎src/content/docs/pages/configuration/branch-build-controls.mdx‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,23 @@
11
---
22
pcx_content_type: concept
33
title: Branch deployment controls
4-
4+
banner:
5+
content: We recommend using <strong>Cloudflare Workers</strong> for new projects. For existing Pages projects, see our <a href="/workers/static-assets/migrate-from-pages/">migration guide</a> and <a href="/workers/static-assets/migrate-from-pages/#compatibility-matrix">compatibility matrix</a>.
6+
type: note
7+
dismissible:
8+
id: pages-migrate-to-workers
59
---
610

7-
import { Render } from "~/components"
11+
import { Render } from "~/components";
812

913
When connected to your git repository, Pages allows you to control which environments and branches you would like to automatically deploy to. By default, Pages will trigger a deployment any time you commit to either your production or preview environment. However, with branch deployment controls, you can configure automatic deployments to suit your preference on a per project basis.
1014

1115
## Production branch control
1216

1317
:::caution[Direct Upload]
1418

15-
1619
<Render file="prod-branch-update" />
1720

18-
1921
:::
2022

2123
To configure deployment options, go to your Pages project > **Settings** > **Builds & deployments** > **Configure Production deployments**. Pages will default to setting your production environment to the branch you first push, but you can set your production to another branch if you choose.
@@ -26,33 +28,31 @@ You can also enable or disable automatic deployment behavior on the production b
2628

2729
When configuring automatic preview deployments, there are three options to choose from.
2830

29-
* **All non-Production branches**: By default, Pages will automatically deploy any and every commit to a preview branch.
30-
* **None**: Turns off automatic builds for all preview branches.
31-
* **Custom branches**: Customize the automatic deployments of certain preview branches.
31+
- **All non-Production branches**: By default, Pages will automatically deploy any and every commit to a preview branch.
32+
- **None**: Turns off automatic builds for all preview branches.
33+
- **Custom branches**: Customize the automatic deployments of certain preview branches.
3234

3335
### Custom preview branch control
3436

3537
By selecting **Custom branches**, you can specify branches you wish to include and exclude from automatic deployments in the provided configuration fields. The configuration fields can be filled in two ways:
3638

37-
* **Static branch names**: Enter the precise name of the branch you are looking to include or exclude (for example, staging or dev).
38-
* **Wildcard syntax**: Use wildcards to match multiple branches. You can specify wildcards at the start or end of your rule. The order of execution for the configuration is (1) Excludes, (2) Includes, (3) Skip. Pages will process the exclude configuration first, then go to the include configuration. If a branch does not match either then it will be skipped.
39+
- **Static branch names**: Enter the precise name of the branch you are looking to include or exclude (for example, staging or dev).
40+
- **Wildcard syntax**: Use wildcards to match multiple branches. You can specify wildcards at the start or end of your rule. The order of execution for the configuration is (1) Excludes, (2) Includes, (3) Skip. Pages will process the exclude configuration first, then go to the include configuration. If a branch does not match either then it will be skipped.
3941

4042
:::note[Wildcard syntax]
4143

42-
4344
A wildcard (`*`) is a character that is used within rules. It can be placed alone to match anything or placed at the start or end of a rule to allow for better control over branch configuration. A wildcard will match zero or more characters.For example, if you wanted to match all branches that started with `fix/` then you would create the rule `fix/*` to match strings like `fix/1`, `fix/bugs`or `fix/`.
4445

45-
4646
:::
4747

4848
**Example 1:**
4949

5050
If you want to enforce branch prefixes such as `fix/`, `feat/`, or `chore/` with wildcard syntax, you can include and exclude certain branches with the following rules:
5151

52-
* Include Preview branches:
52+
- Include Preview branches:
5353
`fix/*`, `feat/*`, `chore/*`
5454

55-
* Exclude Preview branches:
55+
- Exclude Preview branches:
5656
\`\`
5757

5858
Here Pages will include any branches with the indicated prefixes and exclude everything else. In this example, the excluding option is left empty.
@@ -61,22 +61,22 @@ Here Pages will include any branches with the indicated prefixes and exclude eve
6161

6262
If you wanted to prevent [dependabot](https://github.com/dependabot) from creating a deployment for each PR it creates, you can exclude those branches with the following:
6363

64-
* Include Preview branches:
64+
- Include Preview branches:
6565
`*`
6666

67-
* Exclude Preview branches:
67+
- Exclude Preview branches:
6868
`dependabot/*`
6969

70-
Here Pages will include all branches except any branch starting with `dependabot`. In this example, the excluding option means any `dependabot/` branches will not be built.
70+
Here Pages will include all branches except any branch starting with `dependabot`. In this example, the excluding option means any `dependabot/` branches will not be built.
7171

7272
**Example 3:**
7373

7474
If you only want to deploy release-prefixed branches, then you could use the following rules:
7575

76-
* Include Preview branches:
76+
- Include Preview branches:
7777
`release/*`
7878

79-
* Exclude Preview branches:
79+
- Exclude Preview branches:
8080
`*`
8181

8282
This will deploy only branches starting with `release/`.

‎src/content/docs/pages/configuration/build-caching.mdx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
---
22
pcx_content_type: concept
33
title: Build caching
4+
banner:
5+
content: We recommend using <strong>Cloudflare Workers</strong> for new projects. For existing Pages projects, see our <a href="/workers/static-assets/migrate-from-pages/">migration guide</a> and <a href="/workers/static-assets/migrate-from-pages/#compatibility-matrix">compatibility matrix</a>.
6+
type: note
7+
dismissible:
8+
id: pages-migrate-to-workers
49
---
510

611
Improve Pages build times by caching dependencies and build output between builds with a project-wide shared cache.

‎src/content/docs/pages/configuration/build-configuration.mdx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@
22
pcx_content_type: concept
33
title: Build configuration
44
rss: https://github.com/cloudflare/cloudflare-docs/commits/production/src/content/docs/pages/configuration/build-configuration.mdx.atom
5+
banner:
6+
content: We recommend using <strong>Cloudflare Workers</strong> for new projects. For existing Pages projects, see our <a href="/workers/static-assets/migrate-from-pages/">migration guide</a> and <a href="/workers/static-assets/migrate-from-pages/#compatibility-matrix">compatibility matrix</a>.
7+
type: note
8+
dismissible:
9+
id: pages-migrate-to-workers
510
---
611

712
import { Details, PagesBuildPresetsTable } from "~/components";

‎src/content/docs/pages/configuration/build-image.mdx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,11 @@
22
pcx_content_type: concept
33
title: Build image
44
rss: https://github.com/cloudflare/cloudflare-docs/commits/production/src/content/partials/pages/_platform-language-support-and-tools.atom
5+
banner:
6+
content: We recommend using <strong>Cloudflare Workers</strong> for new projects. For existing Pages projects, see our <a href="/workers/static-assets/migrate-from-pages/">migration guide</a> and <a href="/workers/static-assets/migrate-from-pages/#compatibility-matrix">compatibility matrix</a>.
7+
type: note
8+
dismissible:
9+
id: pages-migrate-to-workers
510
---
611

712
import {

‎src/content/docs/pages/configuration/build-watch-paths.mdx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
---
22
pcx_content_type: concept
33
title: Build watch paths
4+
banner:
5+
content: We recommend using <strong>Cloudflare Workers</strong> for new projects. For existing Pages projects, see our <a href="/workers/static-assets/migrate-from-pages/">migration guide</a> and <a href="/workers/static-assets/migrate-from-pages/#compatibility-matrix">compatibility matrix</a>.
6+
type: note
7+
dismissible:
8+
id: pages-migrate-to-workers
49
---
510

611
When you connect a git repository to Pages, by default a change to any file in the repository will trigger a Pages build. You can configure Pages to include or exclude specific paths to specify if Pages should skip a build for a given path. This can be especially helpful if you are using a monorepo project structure and want to limit the amount of builds being kicked off.

‎src/content/docs/pages/configuration/custom-domains.mdx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
---
22
pcx_content_type: how-to
33
title: Custom domains
4+
banner:
5+
content: We recommend using <strong>Cloudflare Workers</strong> for new projects. For existing Pages projects, see our <a href="/workers/static-assets/migrate-from-pages/">migration guide</a> and <a href="/workers/static-assets/migrate-from-pages/#compatibility-matrix">compatibility matrix</a>.
6+
type: note
7+
dismissible:
8+
id: pages-migrate-to-workers
49
---
510

611
import { Render } from "~/components";

‎src/content/docs/pages/configuration/debugging-pages.mdx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,11 @@
11
---
22
pcx_content_type: how-to
33
title: Debugging Pages
4+
banner:
5+
content: We recommend using <strong>Cloudflare Workers</strong> for new projects. For existing Pages projects, see our <a href="/workers/static-assets/migrate-from-pages/">migration guide</a> and <a href="/workers/static-assets/migrate-from-pages/#compatibility-matrix">compatibility matrix</a>.
6+
type: note
7+
dismissible:
8+
id: pages-migrate-to-workers
49
---
510

611
When setting up your Pages project, you may encounter various errors that prevent you from successfully deploying your site. This guide gives an overview of some common errors and solutions.

0 commit comments

Comments
 (0)