From 67ea3bb6965378c9b05c885ef4df4acd2d509050 Mon Sep 17 00:00:00 2001 From: Onni Hakala Date: Wed, 31 Jan 2024 11:49:23 +0100 Subject: [PATCH 1/2] Document the Deployment Protection setting causing 401 Unauthorized for preview images in Vercel. fixes #435, fixes #437 --- readme.md | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/readme.md b/readme.md index da8741e793..4a1e515c27 100644 --- a/readme.md +++ b/readme.md @@ -47,6 +47,7 @@ This project requires a recent version of Node.js (we recommend >= 16). 3. `npm install` 4. `npm run dev` to test locally 5. `npm run deploy` to deploy to vercel 💪 +6. ❗Disable **Deployment Protection** setting in Vercel Web Dashboard ❗ ([See more below](#vercel-configuration)) I tried to make configuration as easy as possible — All you really need to do to get started is edit `rootNotionPageId`. @@ -58,6 +59,16 @@ In order to find your Notion workspace ID (optional), just load any of your site I recommend setting up a collection on your home page that contains all of your articles / projects / content. There are no structural constraints on your Notion workspace, however, so feel free to add content as you normally would in Notion. +### Vercel Configuration +#### Enabling social media preview images +**❗❗❗Social media preview images won't work by default in Vercel❗❗❗** + +👉 You need Login to Vercel Dashboard and **disable Vercel Authentication** from `Project -> Settings -> Deployment Protection`. + +![Vercel Deployment Protection setting](https://github.com/transitive-bullshit/nextjs-notion-starter-kit/assets/5691777/9cce3b60-7102-4c34-a422-9f6572155c10 "Vercel Deployment Protection setting which causes social media preview image endpoint to return 401 Unauthorized") + +💡 If you forget to do this your site will return `401 Unauthorized` responses when crawlers are trying to retrieve the images + ## URL Paths The app defaults to slightly different URL paths in dev vs prod (though pasting any dev pathname into prod will work and vice-versa). From d476e81f91323e4d34c9dabaf9a1025deb7e770d Mon Sep 17 00:00:00 2001 From: Onni Hakala Date: Fri, 8 Nov 2024 15:47:40 +0200 Subject: [PATCH 2/2] Replace Vercel Deployment Protection setting screenshot with short GIF --- readme.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/readme.md b/readme.md index 4a1e515c27..6e6dcb771a 100644 --- a/readme.md +++ b/readme.md @@ -65,7 +65,7 @@ I recommend setting up a collection on your home page that contains all of your 👉 You need Login to Vercel Dashboard and **disable Vercel Authentication** from `Project -> Settings -> Deployment Protection`. -![Vercel Deployment Protection setting](https://github.com/transitive-bullshit/nextjs-notion-starter-kit/assets/5691777/9cce3b60-7102-4c34-a422-9f6572155c10 "Vercel Deployment Protection setting which causes social media preview image endpoint to return 401 Unauthorized") +![How to disable Vercel Deployment Protection setting](https://github.com/user-attachments/assets/a1eb5a1f-da7a-497e-b4f6-f7e851a6cd8a "How to disable Vercel Deployment Protection setting which causes social media preview image endpoint to return 401 Unauthorized") 💡 If you forget to do this your site will return `401 Unauthorized` responses when crawlers are trying to retrieve the images