I am using Google Cloud Functions with a normal Nodejs based website. I am having difficulties in setting the path to the public files like: css, images and js.

The following is my structure

\
  index.js 
  views
    main.njk
  public
    css
      style.css
    images
      image.png
    js
      main.js

index.js is the main Google Function with the following (relevant code shown)

..
const app = express();
app.use(cors);
..
app.use(express.static(path.join(__dirname, '/public')));
..
app.set('view engine', 'njk');
..
nunjucks.configure('views', {
  autoescape: true,
  express: app
});
..
app.get('/', (req, res, next) => {
  res.render('/main');
});
..
exports.funcName = functions.https.onRequest(app);

In main.njk I use the following relative path to load css and js

..
<link rel="stylesheet" href="/css/style.css">
..
<script src="/js/main.js"></script>

Yet when I load the URL from the browser, the path of the css is shown as:

https://us-central1-project-id.cloudfunctions.net/css/style.css

with a net::ERR_ABORTED 403 error. I notice it is not adding the /css to the function name. It should be

https://us-central1-project-id.cloudfunctions.net/funcName/css/style.css

I tried changing the express static files path to:

app.use('/', express.static('public'));

and

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

Still it always shows the same path error. When I run the above code (by running the NodeJS server) it works. What changes am I supposed to do to get the path relative to the function name? Thanks

0 Answers