Revert proxy to google-api-proxy

diff --git a/README.md b/README.md
index 8aaa2586c18821ad369fa2e37af5bdf2fe087384..8d91b28921e74eae05336b6507f394a383c94308 100644 (file)
--- a/README.md
+++ b/README.md
@@ -12,8 +12,21 @@ I'm using Google Sheets and Google Docs as the CMS for this website. A Google Sh
 
 Once I fetch an article from the Google Docs API, the article is converted into markdown then converted into HTML using [marked](https://marked.js.org).
 
+## Serving actual 404 errors for invalid routes while still being a SPA 
+
+Cloudflare Pages automatically redirects any invalid routes in a directory to `404.html` if there is a `404.html` that exists in that directory. Since there's no `404.html` in the root, Cloudflare Pages will redirect all routes to `index.html`.
+
+I do a client-side redirect to `/errors/NotFound` for any routes that should have actually been a `404`, which Cloudflare Pages then serves a `404` with `/errors/404.html`.
+
+Here's how to replicate this behavior locally:
+1. Install Node.js (this is ONLY used for the web server; the website itself does not use Node.js)
+2. `npm i -g local-web-server`
+3. `ws --spa index.html --rewrite '/errors/(.*) -> /errors/404.html'`
+
 ## Local development
 
+**Update March 2022**: the following will work locally, but does not work when deployed to Cloudflare Pages (https://github.com/cloudflare/wrangler2/issues/710). I'm providing the steps below for future reference once the issue is resolved.
+
 Use the `wrangler` CLI to serve the static frontend and API at the same time. Provide credentials for a service account with access to the Google Docs as environment variables.
 
 From the [Cloudflare Pages documentation](https://developers.cloudflare.com/pages/platform/functions/#develop-and-preview-locally):

diff --git a/script.js b/script.js
index 966cdf3c778932204b234d145a06c34117ca6389..f20c7b8a7d548161c0ba7f7fd6ba5d8632d721a8 100644 (file)
--- a/script.js
+++ b/script.js
@@ -49,7 +49,8 @@ postLoader.insertAdjacentHTML('beforeend',
 
 /* Call the CMS controller to get all post metadata. Note: must call fetchPostContent to get content. */
 async function fetchPostMetadata() {
-  const proxyUrl = '/api';
+  const proxyUrl = 'https://script.google.com/macros/s/AKfycbzMHxwypbwsccBq6RH8LDCAOpM02C4gbkljbcKHKFsoQTRE-f4XTIyswiaO0vshs-Kr/exec';
+  // const proxyUrl = '/api'; // Works locally but not when deployed. Ref: https://github.com/cloudflare/wrangler2/issues/710
   const controllerId = '1pfGF8yBu3D0GPTezygLuzu3Cif8SkjhtG98nL-czlhc';
   const range = 'B3:I';
   const url = `${proxyUrl}?https://sheets.googleapis.com/v4/spreadsheets/${controllerId}/values/${range}`;
@@ -75,7 +76,8 @@ async function fetchPostMetadata() {
 /* Get content for the given path */
 async function fetchPostContent(path) {
   const post = posts.get(path);
-  const proxyUrl = '/api';
+  const proxyUrl = 'https://script.google.com/macros/s/AKfycbzMHxwypbwsccBq6RH8LDCAOpM02C4gbkljbcKHKFsoQTRE-f4XTIyswiaO0vshs-Kr/exec';
+  // const proxyUrl = '/api'; // Works locally but not when deployed. Ref: https://github.com/cloudflare/wrangler2/issues/710
   const url = `${proxyUrl}?https://docs.googleapis.com/v1/documents/${post.id}`;
 
   const mapping = {