Removing extensions

I didn’t understand what did you just write.

To clarify the miscommunication here: Glitch has a default way of allowing users to upload assets, which they also call “assets”. That is different from what you have set up in your project, and is what @mishavee was describing here, hence our confusion!

So what should I do is move all the files in my assets folder to the one glitch is providing?

Yeah, if you want your assets to be private.

Okay and what about removing the .HTML extension?

For that, your project needs to be an Express project.

Then I would have to configure everything again right?

There’s a better way: you could group all the .html files into a folder called views and all the .css files into a folder called public. Then you need to add a package.json which typically looks like this:

{
  "//1": "describes your app and its dependencies",
  "//2": "https://docs.npmjs.com/files/package.json",
  "//3": "updating this file will download and update your packages",
  "name": "hello-express",
  "version": "0.0.1",
  "description": "A simple Node app built on Express, instantly up and running.",
  "main": "server.js",
  "scripts": {
    "start": "node server.js"
  },
  "dependencies": {
    "express": "^4.16.4"
  },
  "engines": {
    "node": "8.x"
  },
  "repository": {
    "url": "https://glitch.com/edit/#!/hello-express"
  },
  "license": "MIT",
  "keywords": [
    "node",
    "glitch",
    "express"
  ]
}

and a server.js which looks like this (for your purpose):

const express = require("express");
const app = express();

app.use(express.static("public"));

app.get("/", function(request, response) {
  response.sendFile(__dirname + "/views/index.html");
});

// listen for requests :)
const listener = app.listen(process.env.PORT, function() {
  console.log("Your app is listening on port " + listener.address().port);
});

@khalby786 Can you help me out in moving my website to express project?

Sure! Just DM me an invite link.

1 Like

Can you come on discord?

I’m sorry, I can’t! :frowning_face: Or you could just make the project public for a while so that I can remix it and you can refer it OR you could DM me an invite link.

Alright, I’ll DM you the invite link as I switch to my laptop. Won’t take more than a minute

1 Like

To be clear, the containers underlying static sites are not different from the node Glitch projects.

At some point, we might make that move, but right now, a static site Glitch project (with no project.json) behaves almost exactly like a node Glitch project with a bare-bones package.json like this:

{
  "scripts": {
    "start": "ws --port 3000 --log.format combined --directory . --blacklist '/.(.*)'"
  }
}

Hope this helps,

Johnicholas

2 Likes

Hey is this for removing the extensions?

Ah thank you that is helpful!!

No, I think @Johnicholas was just clarifying an inaccurate statement which I had made above

There’s several aspects to this …

A. If the user requests a url with a folder name, the static web site gives a listing of files in the folder. This can be prevented by giving your own index.html page inside that folder.
This can also be prevented by using Glitch’s assets cdn.

B. Another website might link to your site images/etc.
This can be prevented by setting up a CORS rule, in either the static site configuration, or in a node express configuration.
I don’t see any CORS configuration for Glitch’s assets cdn, so it would serve the files even if requested from a page on a different host.

There is a configuration setting to do this on the static site, but it is newer than the version that Glitch is using, so it doesn’t do anything. To make it work, you’d need to either upgrade the static site server to a different version (kinda difficult), or go with another option like a node express server.

Hi @Johnicholas, why does the start script have an ampersand & at the end? I thought the script is expected to be long running and not return straight away?

Hey, thanks for your reply but @khalby786 helped me out with it and now it works fine.