Cloudflare Developers•2y ago

Fix trailing slash on pages

Hi, I am extremely looking forward to the changes in this direction: https://community.cloudflare.com/t/cloudflare-pages-get-rid-of-redundat-308-redirect/324582/29 Tags: pages 308 redirect trailing slash trailingSlash bypass

Cloudflare Community

Cloudflare Pages: get rid of redundat 308 redirect

This blog gave the workaround I needed (I use Gatsby as a static site builder, but this should work for any statically built site): https://electricui.com/blog/switching-to-cloudflare-pages#how-to-disable-the-trailing-slash-on-cloudflare-pages By moving every index.html file up a directory, the Cloudflare redirect rules result in the non-trail...

2 Replies

Mat•2y ago

I used the solution that was given here: https://electricui.com/blog/switching-to-cloudflare-pages#how-to-disable-the-trailing-slash-on-cloudflare-pages If you don't have the ability to use Linux-level commands, you can use a simple JavaScript script and run it after generating your page

const fs = require('fs');
const path = require('path');

const baseDir = '<static location>';
const mainDirectoryName = '<set directory main name>';

const getFiles = (dir) => {
  const files = [];
  fs.readdirSync(dir).forEach((file) => {
    const filePath = path.join(dir, file);
    const stat = fs.lstatSync(filePath);
    if (stat.isFile()) {
      files.push(filePath);
    } else if (stat.isDirectory()) {
      files.push(...getFiles(filePath));
    }
  });
  return files;
};

console.log('Start mover');
const allFiles = getFiles(baseDir);
allFiles.forEach((filePath) => {
  if (path.extname(filePath) === '.html' && filePath.split(path.sep).length >= 1) {
    const parent = path.dirname(filePath);
    if (path.basename(parent) !== mainDirectoryName) {
      const newPath = path.join(parent, '..', path.basename(parent) + '.html');
      fs.renameSync(filePath, newPath);
    }
  }
});
console.log('Finality mover');

const fs = require('fs');
const path = require('path');

const baseDir = '<static location>';
const mainDirectoryName = '<set directory main name>';

const getFiles = (dir) => {
  const files = [];
  fs.readdirSync(dir).forEach((file) => {
    const filePath = path.join(dir, file);
    const stat = fs.lstatSync(filePath);
    if (stat.isFile()) {
      files.push(filePath);
    } else if (stat.isDirectory()) {
      files.push(...getFiles(filePath));
    }
  });
  return files;
};

console.log('Start mover');
const allFiles = getFiles(baseDir);
allFiles.forEach((filePath) => {
  if (path.extname(filePath) === '.html' && filePath.split(path.sep).length >= 1) {
    const parent = path.dirname(filePath);
    if (path.basename(parent) !== mainDirectoryName) {
      const newPath = path.join(parent, '..', path.basename(parent) + '.html');
      fs.renameSync(filePath, newPath);
    }
  }
});
console.log('Finality mover');

Electric UI

Why We Switched CDNs: How Google's Core Web Vitals Led Us to Cloudf...

From Netlify to Cloudflare Pages: Our Journey to Improve Web Performance

Unknown User•2y ago

Message Not Public

Gaming

Programming

Fix trailing slash on pages