Я сделал простое текстовое поле, которое принимает
URL видео на YouTube
, который разрезает его идентификатор видео и использует fetch для отправки данных на мой экспресс-сервер. Я использую Youtube Data API v3
//after clicking button sends data
//input fields are defined already.
const sendData = (event) => {
event.preventDefault();
const filterUrl = input2.value.indexOf('&') != -1 ? input2.value.slice(0, input2.value.indexOf('&')) : input2.value;
const url = new URL(filterUrl).searchParams.get("v");
fetch('/', {
method: 'post',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
urlname: url.toString()
})
})
.then(function(res) {
console.log(res)
})
.catch(function(error) {
console.log(error)
});
}
Вот мой Экспресс-обработчик:
//defined routes and PARAMETER variable is globally defined
app.route('/')
.get((req, res) => {
res.render('container/index', {
title: 'Hello User!',
content: 'Welcome to youtube Comment viewer'
});
})
.post((req, res) => {
console.log("hello")
PARAMETER = req.body.urlname;
console.log(PARAMETER);
res.redirect('/randomCommentView');
});
//get request
app.get('/randomCommentView', (req, res) => {
console.log("inside");
Comments(PARAMETER)
.then((data) => {
res.render('container/comment', {
Comment: 'fgfg'
})
}).catch(err => {
if (err) res.status(404).render('container/index', {
notFound: `Your request couldn't be completed ERR: ${err}`
})
})
console.log(req.body);
});
Но когда я отправляю свою ссылку на видео с YouTube, страница остается на том же маршруте.
Вот изображение моего вывода:
Таким образом, кажется, что маршруты вызываются, но URL-адрес страницы не изменяется в веб-браузере. Кто-нибудь знает возможную причину этого.
Спасибо,
Привет.