API token added to GitHub Secrets in my repo, deploying GitHub Pages, how do I access this Secret in Javascript? (Simple Node.js project)

Question

This is added to the GitHub pages branch.

My package.json at the moment looks like this:

{
  "name": "project",
  "version": "1.0.0",
  "description": "project",
  "main": "app.js",
  "dependencies": {
    "dotenv": "^8.2.0",
    "gh-pages": "^3.1.0"
  },
  "devDependencies": {},
  "scripts": {
    "deploy": "gh-pages -d ."
  },
  "author": "",
  "license": "ISC",
  "homepage": "https://USERNAME.github.io/gh-pages-repo"
}

Up until now, I've stored my Token in a token.js file (which was in.gitignore), imported that into my HTML through a <src> .

When I've deployed the app with npm run deploy , I don't know exactly how to access this token value. What do I have to change in package.json , and in my Javascript?

Answer 1

The Secrets section is used for GitHub Actions. It isn't accessible for GitHub Pages, which are independent.

Moreover, GitHub Pages is for static sites only; that is, it hosts only HTML, images, and JavaScript that are sent to the client. There is no provision for a server-side component, and as such. there's no secure place to store or use secrets. If you need to have secrets in your website, you need to host elsewhere, since you'll need a server-side component for security.