我想发送客户端javascript中具有的变量/值。我这样做的原因是因为当我尝试发送JSON时,我的req.body.domain返回未定义且相同,因此我尝试将其发送到nodejs路由。
客户端Ajax请求
function digIt() {
var xhr = new XMLHttpRequest();
const domain = document.getElementById("digTool").value;
const digToolInput = document.getElementById("digToolInput");
digToolInput.innerHTML = domain;
digToolInput.style.fontSize = "35px";
const usMap = document.getElementById("us-map");
usMap.classList.add("appear");
digToolInput.classList.add("moved");
console.log(domain);
myJSON = { "domain" : domain };
console.log(JSON.stringify(myJSON));
xhr.open('POST', '/tools', true);
xhr.send(myJSON);
};
用于接收AJAX请求的NodeJS路由
router.post('/tools', (req, res, next) => {
console.log(req.body.myJSON);
mid.canYouDigIt(domain);
res.render('tools', {test: 'domain'});
next();
});
html / jade
doctype html
html(lang="en")
head
link(rel="stylesheet" type="text/css" href="./css/style.css")
link(rel="stylesheet" type="text/css" href="./css/animation.css")
link(href="https://fonts.googleapis.com/css?family=Cutive+Mono" rel="stylesheet")
link(href="https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300|Ubuntu" rel="stylesheet")
title Nymadic #{title}
body
section(id="container")
section(id="navWrapper")
img(id="logo" src="img/Nymadic_Logo_Edit_NEW.png" onclick="location='/'")
<!----- Navigation Menu ----->
div(id="navMenu")
ul
li(onclick="location='/'") Home
li(onclick="location='/about'") About
li(onclick="wikiOpen()") Wiki
li(onclick="toolsOpen()") Tools
if !currentUser
li(onclick="location='/login'") Login
else
li(onclick="location='/profile'") #[img( id="navProfileLogo" src="/img/if_ninja_479478.png")] Profile
li(id="navLogout" onclick="location='/logout'") Logout
<!----- Wiki Menu ----->
section(id="sideBar")
div
img(id="logoSideBar" src="img/Nymadic_Logo_Edit_NEW.png" onclick="location='/'")
form
input(id="searchBar" name="search" type="text" placeholder="Search for knowledge...")
ul
li( v-for="page in mediaList" v-bind:name="page.title" v-on:click="toggleDetails(page)") {{ page.title }}
div( id="descriptionWrapper" v-bind:class="{less: page.showDetail}" )
p( ) {{ page.description }}
p(v-if="page.author" size="8" ) Created By: {{ page.author }}
<!----- Tools Menu ----->
section(id="digToolWrapper")
form( id="digToolInput" )
ul
li #[input(id="digTool" name="domain" type="text" placeholder="Can you dig it?")]#[input(id="whois" value="whois" type="button" onclick="digIt()")]