First of all, I apologize for my poor English.
When you press the Write button on the main page, you want to go to the writeBoard page.
Go to writeBoard.ejs only if you are logged in and validate jwt in auth_login.js.
However, res.render does not work after jwt authentication.
What's the problem?
main.js
app.get('/writeBoard', authMWRouter, (req, res) => {
res.render('./basicBoard/writeBoard');
})
auth_login(authMWRouter)
const jwt = require('jsonwebtoken');
const { Account } = require('../models');
module.exports = (req, res, next) => {
console.log(3)
const { authorization } = req.headers;
const [tokenType, tokenValue] = authorization.split(' ');
if (tokenType != 'Bearer') {
res.status(400).send({
result: "fail",
modal_title: "로그인 필요",
modal_body: "로그인을 해주세요."
});
return;
}
try {
const { nickname } = jwt.verify(tokenValue, 'DongGyunKey');
Account.findByPk(nickname).then((account) => {
res.locals.account = account;
next();
});
console.log(1)
} catch (err) {
res.status(400).send({
result: "fail",
modal_title: "로그인 필요",
modal_body: "로그인을 해주세요."
});
return;
}
}
basicBoard.ejs (my main page)
function move_writeBoard() {
const write_ajax = new XMLHttpRequest();
var myModal = new bootstrap.Modal(document.getElementById("noticeModal"), {});
write_ajax.onload = () => {
if (write_ajax.status == 400 || write_ajax.status == 401) {
responseTxt = JSON.parse(write_ajax.responseText);
const modalTitle = document.querySelector('#msgTitle');
var mtTxt = document.createTextNode(responseTxt['modal_title']);
modalTitle.appendChild(mtTxt);
const modalBody = document.querySelector('#msgbody');
var mbTxt = document.createTextNode(responseTxt['modal_body']);
modalBody.appendChild(mbTxt);
document.getElementById('exitButton').setAttribute('onclick', 'window.location.href="/login"');
document.getElementById('correctButton').setAttribute('onclick', 'window.location.href="/login"');
myModal.show();
}
}
write_ajax.onerror = () => {
console.error(write_ajax.responseText);
}
write_ajax.open('GET', '/writeBoard');
write_ajax.setRequestHeader('authorization', 'Bearer ' + localStorage.getItem("token"));
write_ajax.setRequestHeader('Content-Type', 'application/json');
write_ajax.send();
}
Related
I have defined a function in a module named server.js and want to use it in sign-in.js. server.js exports only one function-emailExists.
module.exports.emailExists = emailExists;
So I import it using:
const server = require("./../server");
and wish to use as
const emailExists = server.emailExists;// but emailExists is undefined
console.log("emailExists is ", typeof emailExists);// result undefined
but
the below is working as expected
console.log("server.emailExists is ", typeof server.emailExists); // returns function
I thought maybe functions are not copied or referenced, but the below code works as i want the above example to work
//this works as expected
function x() {
console.log("from x");
}
const y = x;
console.log("y is", typeof y); // logs y is function
y(); // returns "from x"
I am not sure whether the difference in these two examples is because in first case function is being copied/ referenced from another module and in the second case, function from the same file is bieng copied/ referenced, as few days ago i created new project just to check this and fuction from other module was being copied, i.e. the below was working.
const y= require("./mod2.js").x //x is function in mod2
console.log(typeof y)// returned fucntion
server.js
const express = require("express");
const path = require("path");
const multer = require("multer");
const db = require("./server/database/index.js");
const http = require("http");
const app = express();
const PORT = 3000;
const router = require("./routes/sign-in.js");
app.use(express.static("./"));
app.get("/", (req, res) => {
res.sendFile(path.join(__dirname, "./index.html"));
});
const upload = multer();
let OTP;
app.post("/sendOTP", upload.none(), async (req, res) => {
OTP = Math.ceil(Math.random() * 100000);
http
.get(
`http://myactualdomain.com:portthatiamusing/${OTP}/${req.body.email}`,
async (response) => {
console.log("got response from linux server");
let existingEmail = await emailExists(req.body.email);
if (existingEmail === true) {
res.json(existingEmail);
} else if (existingEmail === false) {
res.json(existingEmail);
} else {
res.json(await emailExists(req.body.email));
}
}
)
.on("error", (err) => {
res.json({ err });
});
});
async function emailExists(email) {
let sqlResponse = await db
.emailExists(email)
.then((data) => {
if (Object.keys(data).length === 0) {
return { exists: false };
} else {
return { exists: true };
}
})
.catch((err) => {
throw new Error("Error which checking if Email exists in MySQL");
});
return JSON.parse(sqlResponse.exists);
}
app.use(
"/",
(req, res, next) => {
req.OTP = OTP;
next();
},
router()
);
app.listen(PORT);
module.exports.emailExists = emailExists;
sign-in.js
const express = require("express");
const router = express.Router();
const multer = require("multer");
const upload = multer();
const db = require("../server/database/index.js");
const server = require("./../server");
const validateOTP = require("./validateOTP.js");
const emailExists = server.emailExists;
module.exports = () => {
router.use("/validateOTP", validateOTP());
router.post("/sign-in", upload.none(), async (req, res) => {
if (await server.emailExists(req.body.email)) {
let correctPassword = await db
.retreivePassword(req.body.email)
.then((password) => {
if (password[0].password === req.body.password) {
res.json({ successful: true });
} else {
res.json({ successful: false });
}
})
.catch((err) => {
res.json(err);
throw "Error checking password from MySql";
});
} else {
res.json({ successful: "email doesn't exist" });
}
//this works as expected
console.log("server.emailExists is ", typeof server.emailExists);
//this does not works as expected. expeted value function, actual value undefined
console.log("emailExists is ", typeof emailExists);
//this works as expected
function x() {
console.log("from x");
}
const y = x;
console.log("y is", typeof y); // logs y is function
y(); // returns "from x"
});
return router;
};
I have this api which works fine when running locally. But, once it is deployed to Heroku i get a error 503 which is because it tries to target localhost on Heroku's server and not the user's localhost. Is there a way to make this target the user's localhost instead?
The frontend is React. Here's the code in React that fetches this api every 5sec.
axiosFunc = () => {
const { user } = this.props.auth;
console.log(user);
axios.get(`api/avaya/${user.id}`).then((res) => console.log(res));
};
timer = (time) => {
const date = new Date(time);
return `${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`;
};
componentDidMount() {
this.axiosFunc();
this.interval = setInterval(this.axiosFunc, 5000);
}
componentWillUnmount() {
clearInterval(this.interval);
}
and this is the API on the backend with express
const router = require("express").Router();
const xml2js = require("xml2js");
const Avaya = require("../../models/Avaya");
const User = require("../../models/User");
router.route("/:id").get(async (req, res) => {
const user = await User.findById(req.params.id);
const axios = require("axios");
axios({
method: "post",
baseURL: `http://127.0.0.1:60000/onexagent/api/registerclient?name=${user.username}`,
timeout: 2000,
})
.then((reg) => {
xml2js
.parseStringPromise(reg.data, { mergeAttrs: true })
.then((result) => {
if (result.RegisterClientResponse.ResponseCode[0] === "0") {
const clientId = result.RegisterClientResponse.ClientId[0];
user.avayaClientId = clientId;
user.save();
}
const clientId = user.avayaClientId;
axios({
method: "post",
url: `http://127.0.0.1:60000/onexagent/api/nextnotification?clientid=${clientId}`,
}).then((notification) => {
xml2js
.parseStringPromise(notification.data, { mergeAttrs: true })
.then((result) => {
const notifType = [];
const notifDetails = [];
for (let i in result.NextNotificationResponse) {
notifType.push(i);
}
const arranged = {
NotificationType: notifType[1],
ResponseCode:
result.NextNotificationResponse[notifType[0]][0],
};
for (let i in result.NextNotificationResponse[
notifType[1]
][0]) {
notifDetails.push(i);
}
for (let i = 0; i < notifDetails.length; i++) {
arranged[[notifDetails[i]][0]] =
result.NextNotificationResponse[notifType[1]][0][
notifDetails[i]
][0];
}
for (let i in arranged) {
if ("Outbound" in arranged) {
arranged.CallType = "Outbound";
} else if ("Inbound" in arranged)
arranged.CallType = "Inbound";
else {
arranged.CallType = " ";
}
}
if (
arranged.NotificationType === "VoiceInteractionCreated" ||
arranged.NotificationType === "VoiceInteractionMissed" ||
arranged.NotificationType === "VoiceInteractionTerminated"
) {
const newLogs = new Avaya({
notification: arranged,
});
newLogs.owner = user;
newLogs.save();
user.avayaNotifications.push(newLogs),
user
.save()
.then((logs) => res.json(logs))
.catch((err) => res.status(400).json("Error: " + err));
} else {
res.send("Nothing to record");
}
});
});
});
})
.catch((err) => res.status(503).json(err));
});
router.route("/history/:username").get(async (req, res) => {
const user = await User.findOne({ username: [`${req.params.username}`] });
Avaya.find({ owner: [`${await user.id}`] }).then((user) => res.json(user));
});
module.exports = router;
EDIT: I was able to fix thanks to #Molda
using fetch instead of axios doesn't result in cors error.
New frontend code
getLogs = async () => {
const { user } = this.props.auth;
const reg = await fetch(
`http://127.0.0.1:60000/onexagent/api/registerclient?name=${user.id}`
);
let regData = await reg.text();
let regxml = new XMLParser().parseFromString(regData);
if (regxml.attributes.ResponseCode === "0") {
axios.post(`/api/avaya/register/${user.id}`, regxml);
console.log(regxml.attributes.ResponseCode);
}
let resp = await fetch(`/api/avaya/getid/${user.id}`);
let clientId = await resp.text();
let logs = await fetch(
`http://127.0.0.1:60000/onexagent/api/nextnotification?clientid=${clientId}`
);
let data = await logs.text();
var xml = new XMLParser().parseFromString(data);
axios.post(`/api/avaya/getlogs/${user.id}`, xml);
};
timer = (time) => {
const date = new Date(time);
return `${date.getHours()}:${date.getMinutes()}:${date.getSeconds()}`;
};
componentDidMount() {
this.getLogs();
this.interval = setInterval(this.getLogs, 5000);
}
New backend code:
const router = require("express").Router();
const Avaya = require("../../models/Avaya");
const User = require("../../models/User");
router.route("/register/:id").post(async (req, res) => {
const user = await User.findById(req.params.id);
const clientId = req.body.attributes.ClientId;
user.avayaClientId = clientId;
user.save();
});
router.route("/getid/:id").get(async (req, res) => {
const user = await User.findById(req.params.id);
res.send(user.avayaClientId);
});
router.route("/getlogs/:id").post(async (req, res) => {
const user = await User.findById(req.params.id);
const arranged = {
NotificationType: req.body.children[0].name,
ResponseCode: req.body.attributes.ResponseCode,
CallType: " ",
};
for (let i in req.body.children[0].attributes) {
if (i === "Outbound") {
arranged.CallType = "Outbound";
}
if (i === "Inbound") {
arranged.CallType = "Inbound";
}
arranged[i] = req.body.children[0].attributes[i];
}
console.log(arranged);
if (
arranged.NotificationType === "VoiceInteractionCreated" ||
arranged.NotificationType === "VoiceInteractionMissed" ||
arranged.NotificationType === "VoiceInteractionTerminated"
) {
const newLogs = new Avaya({
notification: arranged,
});
newLogs.owner = user;
newLogs.save();
user.avayaNotifications.push(newLogs),
user
.save()
.then((logs) => res.json(logs))
.catch((err) => res.status(400).json("Error: " + err));
} else {
res.send("Nothing to record");
}
});
router.route("/history/:username").get(async (req, res) => {
const user = await User.findOne({ username: [`${req.params.username}`] });
Avaya.find({ owner: [`${await user.id}`] }).then((user) => res.json(user));
});
module.exports = router;
I really don't get the part of (requesting with Axios in API)
Is this a third party API ?
But I suggest you to use (.env) which is a file in your root folder contains the development config like base URLs, expire tokens, API keys ... etc
and when you upload to Heroku you have to make a (.env) in Heroku app and but your config
Let's take an example
in my development mode, my .env looks like
app_url = localhost:4000
port = 4000
db = development_api
db_username = root
db_password =
db_engine = mysql2
in my production mode, my .env looks like
app_url = http://appsomething.heroku.com
port = 80
db = production_api
db_username = root
db_password = 3210LDWAK#AALKQ
db_engine = mysql2
and read more about how to use .ENV
I wrote this in express JS. the 2 GETs are working but the remaining are not working but I can't see what's wrong with the code. I have a .json file in my directory where I am calling the data from. When I use get id, i get the correct id. When I use POST, it will post only the _id and Date without posting the body of the data.
const studentsArray = readFile();
const studentId = studentsArray.find(student => student._id == req.params.id)
if (studentId) {
res.send(studentId)
} else {
res.status(404).send("student not found")
}
});
router.get("/", (req, res) => {
/* const studentsArray = readFile(filePath); */
res.send(readFile())
});
router.post("/", (req, res) => {
const studentsArray = readFile()
/* const emailCheck = studentsArray.find(student => {
if (students)
}) */
const newStudent = { ...req.body, _id: studentsArray.length + 1, createdOn: new Date() };
studentsArray.push(newStudent)
fs.writeFileSync(filePath, JSON.stringify(studentsArray))
res.status(201).send(`Student ${newStudent._id} was Created Successfully`)
});
router.put("/:id", (req, res) => {
const studentsArray = readFile();
const editedStudent = studentsArray.find(student => student._id == req.params.id)
if (editedStudent)
{
const mergedStudent = Object.assign(editedStudent, req.body)
const position = studentsArray.indexOf(editedStudent)
studentsArray[position] = mergedStudent
fs.writeFileSync(filePath, JSON.stringify(studentsArray))
res.send(mergedStudent)
} else {
res.status(404).send("Student not found")
}
});
router.delete("/:id", (req, res) => {
const studentsArray = readFile();
const studentsRemains = studentsArray.find(student => student._id != req.params.id)
if (studentsRemains.length < studentsArray.length) {
fs.writeFileSync(filePath, JSON.stringify(studentsRemains))
res.status(204).send("Deletion successful")
}
else {
res.status(404).send("Student Not Found")
}
});
I am working on solutions using which i can send desktop push notification to subscribed clients.
I have created basic solution in where whenever user click on button i ask user for whether they want to allow notifications for my app or not!
I am getting an error of "Registration failed - permission denied" whenever i click on button for first time.
So that i am not able to get required endpoints to save at backend
Here is my code
index.html
<html>
<head>
<title>PUSH NOT</title>
<script src="index.js"></script>
</head>
<body>
<button onclick="main()">Ask Permission</button>
</body>
</html>
index.js
const check = () => {
if (!("serviceWorker" in navigator)) {
throw new Error("No Service Worker support!");
} else {
console.log("service worker supported")
}
if (!("PushManager" in window)) {
throw new Error("No Push API Support!");
} else {
console.log("PushManager worker supported")
}
};
const registerServiceWorker = async () => {
const swRegistration = await navigator.serviceWorker.register("/service.js?"+Math.random());
return swRegistration;
};
const requestNotificationPermission = async () => {
const permission = await window.Notification.requestPermission();
// value of permission can be 'granted', 'default', 'denied'
// granted: user has accepted the request
// default: user has dismissed the notification permission popup by clicking on x
// denied: user has denied the request.
if (permission !== "granted") {
throw new Error("Permission not granted for Notification");
}
};
const main = async () => {
check();
const swRegistration = await registerServiceWorker();
const permission = await requestNotificationPermission();
};
// main(); we will not call main in the beginning.
service.js
// urlB64ToUint8Array is a magic function that will encode the base64 public key
// to Array buffer which is needed by the subscription option
const urlB64ToUint8Array = base64String => {
const padding = "=".repeat((4 - (base64String.length % 4)) % 4);
const base64 = (base64String + padding)
.replace(/\-/g, "+")
.replace(/_/g, "/");
const rawData = atob(base64);
const outputArray = new Uint8Array(rawData.length);
for (let i = 0; i < rawData.length; ++i) {
outputArray[i] = rawData.charCodeAt(i);
}
return outputArray;
};
const saveSubscription = async subscription => {
console.log("Save Sub")
const SERVER_URL = "http://localhost:4000/save-subscription";
const response = await fetch(SERVER_URL, {
method: "post",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(subscription)
});
return response.json();
};
self.addEventListener("activate", async () => {
try {
const applicationServerKey = urlB64ToUint8Array(
"BFPtpIVOcn2y25il322-bHQIqXXm-OACBtFLdo0EnzGfs-jIGXgAzjY6vNapPb4MM1Z1WuTBUo0wcIpQznLhVGM"
);
const options = { applicationServerKey, userVisibleOnly: true };
const subscription = await self.registration.pushManager.subscribe(options);
console.log(JSON.stringify(subscription))
const response = await saveSubscription(subscription);
} catch (err) {
console.log(err.code)
console.log(err.message)
console.log(err.name)
console.log('Error', err)
}
});
self.addEventListener("push", function(event) {
if (event.data) {
console.log("Push event!! ", event.data.text());
} else {
console.log("Push event but no data");
}
});
Also i have created a bit of backend as well
const express = require("express");
const cors = require("cors");
const bodyParser = require("body-parser");
const webpush = require('web-push')
const app = express();
app.use(cors());
app.use(bodyParser.json());
const port = 4000;
app.get("/", (req, res) => res.send("Hello World!"));
const dummyDb = { subscription: null }; //dummy in memory store
const saveToDatabase = async subscription => {
// Since this is a demo app, I am going to save this in a dummy in memory store. Do not do this in your apps.
// Here you should be writing your db logic to save it.
dummyDb.subscription = subscription;
};
// The new /save-subscription endpoint
app.post("/save-subscription", async (req, res) => {
const subscription = req.body;
await saveToDatabase(subscription); //Method to save the subscription to Database
res.json({ message: "success" });
});
const vapidKeys = {
publicKey:
'BFPtpIVOcn2y25il322-bHQIqXXm-OACBtFLdo0EnzGfs-jIGXgAzjY6vNapPb4MM1Z1WuTBUo0wcIpQznLhVGM',
privateKey: 'mHSKS-uwqAiaiOgt4NMbzYUb7bseXydmKObi4v4bN6U',
}
webpush.setVapidDetails(
'mailto:janakprajapati90#email.com',
vapidKeys.publicKey,
vapidKeys.privateKey
)
const sendNotification = (subscription, dataToSend='') => {
webpush.sendNotification(subscription, dataToSend)
}
app.get('/send-notification', (req, res) => {
const subscription = {endpoint:"https://fcm.googleapis.com/fcm/send/dLjyDYvI8yo:APA91bErM4sn_wRIW6xCievhRZeJcIxTiH4r_oa58JG9PHUaHwX7hQlhMqp32xEKUrMFJpBTi14DeOlECrTsYduvHTTnb8lHVUv3DkS1FOT41hMK6zwMvlRvgWU_QDDS_GBYIMRbzjhg",expirationTime:null,keys:{"p256dh":"BE6kUQ4WTx6v8H-wtChgKAxh3hTiZhpfi4DqACBgNRoJHt44XymOWFkQTvRPnS_S9kmcOoDSgOVD4Wo8qDQzsS0",auth:"CfO4rOsisyA6axdxeFgI_g"}} //get subscription from your databse here.
const message = 'Hello World'
sendNotification(subscription, message)
res.json({ message: 'message sent' })
})
app.listen(port, () => console.log(`Example app listening on port ${port}!`));
Please help me
Try the following code:
index.js
const check = () => {
if (!("serviceWorker" in navigator)) {
throw new Error("No Service Worker support!");
} else {
console.log("service worker supported")
}
if (!("PushManager" in window)) {
throw new Error("No Push API Support!");
} else {
console.log("PushManager worker supported")
}
};
const saveSubscription = async subscription => {
console.log("Save Sub")
const SERVER_URL = "http://localhost:4000/save-subscription";
const response = await fetch(SERVER_URL, {
method: "post",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify(subscription)
});
return response.json();
};
const urlB64ToUint8Array = base64String => {
const padding = "=".repeat((4 - (base64String.length % 4)) % 4);
const base64 = (base64String + padding)
.replace(/\-/g, "+")
.replace(/_/g, "/");
const rawData = atob(base64);
const outputArray = new Uint8Array(rawData.length);
for (let i = 0; i < rawData.length; ++i) {
outputArray[i] = rawData.charCodeAt(i);
}
return outputArray;
};
const registerServiceWorker = async () => {
return navigator.serviceWorker.register("service.js?"+Math.random()).then((swRegistration) => {
console.log(swRegistration);
return swRegistration;
});
};
const requestNotificationPermission = async (swRegistration) => {
return window.Notification.requestPermission().then(() => {
const applicationServerKey = urlB64ToUint8Array(
"BFPtpIVOcn2y25il322-bHQIqXXm-OACBtFLdo0EnzGfs-jIGXgAzjY6vNapPb4MM1Z1WuTBUo0wcIpQznLhVGM"
);
const options = { applicationServerKey, userVisibleOnly: true };
return swRegistration.pushManager.subscribe(options).then((pushSubscription) => {
console.log(pushSubscription);
return pushSubscription;
});
});
};
const main = async () => {
check();
const swRegistration = await registerServiceWorker();
const subscription = await requestNotificationPermission(swRegistration);
// saveSubscription(subscription);
};
service.js
self.addEventListener("push", function(event) {
if (event.data) {
console.log("Push event!! ", event.data.text());
} else {
console.log("Push event but no data");
}
});
I can think of three reasons that the permission is denied
1) your site is not on https (including localhost that is not on https), the default behaviour from chrome as far as i know is to block notifications on http sites. If that's the case, click on the info icon near the url, then click on site settings, then change notifications to ask
2) if you are on Safari, then safari is using the deprecated interface of the Request permission, that is to say the value is not returned through the promise but through a callback so instead of
Notification.requestPermission().then(res => console.log(res))
it is
Notification.requestPermission(res => console.log(res))
3) Your browser settings are blocking the notifications request globally, to ensure that this is not your problem run the following code in the console (on a secured https site)
Notification.requestPermission().then(res => console.log(res))
if you receive the alert box then the problem is something else, if you don't then make sure that the browser is not blocking notifications requests
I have a app.get which inside of it is quite a bit of logic. Which everything works great aside from some of the logic being called twice for some reason. I have noticed when I was saving something to by db that it would save two rows.
So I put a console.log in that area and sure enough it was logging it twice.
Any reason why this is happening?
app.get('/shopify/callback', (req, res) => {
const { shop, hmac, code, state } = req.query;
const stateCookie = cookie.parse(req.headers.cookie).state;
if (state !== stateCookie) {
return res.status(403).send('Request origin cannot be verified');
}
if (shop && hmac && code) {
// DONE: Validate request is from Shopify
const map = Object.assign({}, req.query);
delete map['signature'];
delete map['hmac'];
const message = querystring.stringify(map);
const providedHmac = Buffer.from(hmac, 'utf-8');
const generatedHash = Buffer.from(
crypto
.createHmac('sha256', config.oauth.client_secret)
.update(message)
.digest('hex'),
'utf-8'
);
let hashEquals = false;
try {
hashEquals = crypto.timingSafeEqual(generatedHash, providedHmac)
} catch (e) {
hashEquals = false;
};
if (!hashEquals) {
return res.status(400).send('HMAC validation failed');
}
// DONE: Exchange temporary code for a permanent access token
const accessTokenRequestUrl = 'https://' + shop + '/admin/oauth/access_token';
const accessTokenPayload = {
client_id: config.oauth.api_key,
client_secret: config.oauth.client_secret,
code,
};
request.post(accessTokenRequestUrl, { json: accessTokenPayload })
.then((accessTokenResponse) => {
const accessToken = accessTokenResponse.access_token;
// DONE: Use access token to make API call to 'shop' endpoint
const shopRequestUrl = 'https://' + shop + '/admin/shop.json';
const shopRequestHeaders = {
'X-Shopify-Access-Token': accessToken,
}
request.get(shopRequestUrl, { headers: shopRequestHeaders })
.then((shopResponse) => {
const response = JSON.parse(shopResponse);
const shopData = response.shop;
console.log('BEING CALLED TWICE...')
res.render('pages/brand_signup',{
shop: shopData.name
})
})
.catch((error) => {
res.status(error.statusCode).send(error.error.error_description);
});
})
.catch((error) => {
res.status(error.statusCode).send(error.error.error_description);
});
} else {
res.status(400).send('Required parameters missing');
}
});