Using GitLab Variables in a vanilla HTML page with JavaScript

Question

GitLab supports predefined environment variables, YAML-defined variables, and Secure User Variables - http://doc.gitlab.com/ce/ci/variables/README.html

How can I use a secure user variable as part of a JavaScript script within a basic GitLab-Pages site? (ie the site isn't using ruby, node, etc., it is using just html, css, & javascript)

For example, I have START_PAGE_USER and START_PAGE_ID variables defined for this project . My .gitlab-ci.yml exposes them via echo $START_PAGE_USER & echo $START_PAGE_ID , and I have verified they are exposed in the build log. How can I use those variables in my javascript (eg setting a username in my config.js ):

var config = {
  user: typeof $START_PAGE_USER !== 'undefined' ? START_PAGE_USER : "Example User"
};

Answer 1

Project variables are for your testing enviroment. Not your code! You cannot access those variables in you code.

As the documentation said:

When receiving a build from GitLab CI, the runner prepares the build environment . It starts by setting a list of predefined variables (Environment Variables) and a list of user-defined variables