I am trying to send an ejs templated file as a response to a HTTP request; the html and css renders but the Javascript does not respond. The Javascript sources are linked in the head of the ejs response but the functions aren't called when the page is actually displayed.
app.js
const express = require('express')
const app = express()
let port = process.env.PORT || 3000
require('dotenv').config()
const { auth,requiresAuth } = require('express-openid-connect')
const path = require('path')
let mysql = require('mysql')
const bodyParser = require('body-parser')
app.use(bodyParser.urlencoded({ extended: true }))
app.use(bodyParser.json())
app.set("views", path.join(__dirname, "views"))
app.set("view engine", "ejs")
app.use(express.static(__dirname))
app.set('port',port)
app.get('/createnew', requiresAuth(), function (req, res) {
let user = (JSON.stringify(req.oidc.user.email))
user = user.replace(/"/g, '\'');
let user1 = {
completeremail: user,
}
res.render('newform', {user : user1})
})
The request is made from profilelist.ejs
function createNew() {
let getUrl = window.location;
let baseUrl = getUrl .protocol + "//" + getUrl.host;
let query = baseUrl + '/createnew?'
let req = new XMLHttpRequest()
req.open("GET", query, true)
req.addEventListener('load', function () {
let response = req.responseText
document.querySelector("html").innerHTML = response
})
req.send()
}
My file-structure is:
node_modules/
views/
complete.ejs
form.ejs
maintemplate.ejs
newform.ejs
profilelist.ejs
.env
.gitignore
app.js
javascript.js
packahe.json
package-lock.json
README.md
stylesheet.css
The problem is because you called your middleware function requiresAuth with empty arguments witch means your middleware will not call next() to pass control to the next function that render your ejs template, try to call your middleware without ()
app.get('/createnew', requiresAuth , function (req, res) {
//your code here
})