External authentication providers were enabled in netlify-cms version 0.4.3. Check your web console to see your netlify-cms version.
netlify-cms has its own github OAuth client. This implementation was created by reverse engineering the results of that client, so it's not necessary to reimplement client part of netlify-cms.
Github, Github Enterprise and Gitlab are currently supported, but as this is a general Oauth client, feel free to submit a PR to add other git hosting providers.
Other implementations in: Go lang.
Install Repo Locally
git clone https://github.com/vencax/netlify-cms-github-oauth-provider
cd netlify-cms-github-oauth-provider
npm installCreate Oauth App
Information is available on the Github Developer Documentation or Gitlab Docs. Fill out the fields however you like, except for authorization callback URL. This is where Github or Gitlab will send your callback after a user has authenticated, and should be https://your.server.com/callback for use with this repo.
Configuration is done with environment variables, which can be supplied as command line arguments, added in your app hosting interface, or loaded from a .env (dotenv) file.
Example .env file:
NODE_ENV=production
ORIGINS=www.my_organisation.com,www.my_organisation_second.com
OAUTH_CLIENT_ID=f432a9casdff1e4b79c57
OAUTH_CLIENT_SECRET=pampadympapampadympapampadympa
REDIRECT_URL=https://your.server.com/callback
GIT_HOSTNAME=https://github.website.com
PORT=3000NOTE: ORIGINS is mandatory and can contain regex (e.g. .*.my_organisation.com)
For Gitlab you also have to provide this environment variables:
OAUTH_PROVIDER=gitlab
SCOPES=api
OAUTH_AUTHORIZE_PATH=/oauth/authorize
OAUTH_TOKEN_PATH=/oauth/tokenYou can also setup an environment variable to configure "_blank" target when auth window is opened. Default is "_self".
AUTH_TARGET=_blankClient ID & Client Secret: After registering your Oauth app, you will be able to get your client id and client secret on the next page.
Redirect URL (optional in github, mandatory in gitlab): Include this if you need your callback to be different from what is supplied in your Oauth app configuration.
Git Hostname (Default github.com): This is only necessary for use with Github Enterprise or Gitlab.
Port number (Default 3000) If you do not want to run the app on 3000.
You also need to add base_url to the backend section of your netlify-cms's config file. base_url is the live URL of this repo with no trailing slashes.
backend:
name: [github | gitlab]
repo: user/repo # Path to your Github/Gitlab repository
branch: master # Branch to update
base_url: https://your.server.com # Path to ext auth providerBasic instructions for pushing to heroku are available in the original blog post.
You can run the instance like so:
npm startOr with commandline provided variables like so:
PORT=3111 NODE_ENV=production ORIGINS=www.my_organisation.com OAUTH_CLIENT_ID=... OAUTH_CLIENT_SECRET=... npm startIf running behind reverse-proxy (e.g. nginx), the /auth and /callback paths need to be proxied, e.g. like so:
location /auth {
proxy_pass http://127.0.0.1:3111;
proxy_pass_request_headers on;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Early-Data $ssl_early_data;
}
location /callback {
proxy_pass http://127.0.0.1:3111;
proxy_pass_request_headers on;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Early-Data $ssl_early_data;
}You may want to run this as a systemd service like so:
$ cat /etc/systemd/system/oauth-github.service[Unit]
Description=OAuth provider for Netlify CMS and Github
After=network.target
[Service]
Type=simple
User=user
WorkingDirectory=/opt/netlify-cms-github-oauth-provider
ExecStart=/usr/bin/npm run start
Restart=always
Environment=PORT=3111
Environment=ORIGINS=www.my_organisation.com
Environment=OAUTH_CLIENT_ID=...
Environment=OAUTH_CLIENT_SECRET=...
[Install]
WantedBy=multi-user.target
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent