https://github.com/i40west/netlify-cms-cloudflare-pages
Oauth API to run Decap CMS (formerly Netlify CMS) on Cloudflare Pages
https://github.com/i40west/netlify-cms-cloudflare-pages
cloudflare-pages cloudflare-workers cms decap-cms jamstack netlify-cms static-site
Last synced: 9 days ago
JSON representation
Oauth API to run Decap CMS (formerly Netlify CMS) on Cloudflare Pages
- Host: GitHub
- URL: https://github.com/i40west/netlify-cms-cloudflare-pages
- Owner: i40west
- License: bsd-3-clause
- Created: 2022-03-11T01:45:50.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2024-06-26T19:29:12.000Z (10 months ago)
- Last Synced: 2024-06-26T23:58:53.234Z (10 months ago)
- Topics: cloudflare-pages, cloudflare-workers, cms, decap-cms, jamstack, netlify-cms, static-site
- Language: CSS
- Homepage:
- Size: 22.5 KB
- Stars: 83
- Watchers: 3
- Forks: 19
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# netlify-cms-cloudflare-pages
[Decap CMS](https://www.decapcms.org) (formerly Netlify CMS) needs to authenticate to Github with OAuth. Github needs a server to talk to during the authentication process. If you’re hosting at Netlify, they take care of that. If not, you’re on your own, and the documentation is... imperfect. 😂
If you’re deploying to [Cloudflare Pages](https://pages.cloudflare.com) this may be the code you’re looking for. It provides API endpoints for Github to talk to, running on Cloudflare Functions. Functions are kind of like Cloudflare Workers, but they run right from your Pages site.
## Credits
This is based on [d3v1an7/netlify-cms-oauth-cloudflare](https://github.com/d3v1an7/netlify-cms-oauth-cloudflare) adapted for Cloudflare Functions.
## Installation
### 1. Create OAuth application at Github
Go to Settings -> Developer Settings and choose [OAuth Apps](https://github.com/settings/developers). Create a new OAuth App. Name it anything you like. **Homepage URL** should be set to your site’s URL. **Authorization callback URL** is the important part; it, too, can be set to your homepage URL (like `https://example.com`). Other guides say to set this to the callback API endpoint, but the documented requirement is that the callback URL be a subdirectory of this URL, and using the callback URL itself didn’t work for me.
Github will give you a **Client ID**, and you can generate a **Client Secret** at this time. You will need both.
### 2. Add Client ID and Secret to your Cloudflare project
In your Cloudflare Pages project, go to Settings -> Environment variables. Add two environment variables, **GITHUB_CLIENT_ID** set to the client ID from above, and **GITHUB_CLIENT_SECRET** set to the secret.
### 3. Add the files to your project
Take the `functions` directory from this repo and add it to your project at the top level. **NOTE:** This means the actual top-level of the project itself, _not_ the top level of your output directory. So, if you’re using Hugo, `functions` goes at the top of the project next to `content` and `layouts` and `archetypes` and so forth, _not_ inside the `static` or `assets` directory.
If you haven’t already installed the Decap CMS files, take the `static/admin` directory from this repo and add it to your `static` directory (for Hugo) or wherever you add files to be deployed as-is to your site. There are two files under `admin`, a stub HTML file that loads the CMS, and the CMS config file `config.yml`. You can change the name of the `admin` directory.
The config file included here is a starter file only; you need to set this up for your site, which is beyond the scope of these instructions. However, you must set `site_domain` and `base_url` in this config to the URL of your site (like `https://example.com`). Setting `auth_endpoint` here is optional because the default path works for the way this repo is set up.
### 4. Profit!
Publish your site and let Cloudflare build it. Go to `/admin/` on your site, and you should see a Login with Github button, which should authenticate you to Github and launch the CMS.