首先找到之前做完的nodejs-text,文件如果没有的话可以去我的git仓库里下载
当然我的仓库里是已经修改完的。 (￣y▽￣)~*
首先我们需要在sever.js文件里面添加上我们的注册页面
else if (path === '/sign_up' ) {
let string = fs.readFileSync('./sign_up', 'utf8')
response.statusCode = 200
response.setHeader('Content-Type', 'text/html;charset=utf-8')
response.write(string)
response.end()
添加此代码让我们可以通过/sign_up链接到我们的注册页面，有了链接的地方那么我们就需要准备我们的注册页面了，
注册页面
image.png
点击蓝色代码查看注册代码页
之后引入一个js
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>代码准备好了，那么我们就需要通过以下代码获得注册者注册的数据和判断邮箱是否正确，两个密码是否一致在sign_up.html添加以下代码
<script>
let $form = $('#signUpForm')
$form.on('submit',(e)=>{
let=hash{}
e.preventDefault()
let need=['email','password','password_confirmation']
need.forEach((name)=>{
let value = $form.find('[name=${name}]').val()
hash[name]=value
})
/*下面代码用于清空无效的提示*/
$form.find('.error').each((index,span)=>{
$(span).text('')
})
/*通过一下代码告知用户输入邮箱和密码是否有错误*/
if(hash['email']=== ''){
$form.find('[name="email"]').siblings('.error')
.text('请填写邮箱')
return
}
if(hash['password']=== ''){
$form.find('[name="password"]').siblings('.error')
.text('请填写密码')
return
}
if(hash['password_confirmation']=== ''){
$form.find('[name="password_confirmation"]').siblings('.error')
.text('请确认密码')
return
}
if(hash['password'] !==hash['password_confirmation']){
$form.find('[name="password_confirmation"]').siblings('.error')
.text('密码不匹配')
return
}
$.post('/sign_up',hash)
.then(()=>{
console.log('success')
},(requrst)=>{
let {error} = requrst.responseJSON
if(errors.email && errors.email === 'invalid'){
$form.find('[name="email"]').siblings('.error')
.text('邮箱格式错误')
}
})
})
/*到此结束*/
</script>
在server.js文件中添加
if else循环中添加一下代码作为判定条件
else if (path === '/sign_up' && method === 'GET') {
let string = fs.readFileSync('./sign_up', 'utf8')
response.statusCode = 200
response.setHeader('Content-Type', 'text/html;charset=utf-8')
response.write(string)
response.end()
} else if (path === '/sign_up' && method === 'POST') {
readBody(request).then((body)=>{
let strings=body.split('&')
let hash ={}
strings.forEach((string)=>{
let parts=string.split('=')
let key = parts[0]
let value = parts[1]
hash[key] = value
})
let {email,password,password_confirmation}= hash
if(email.indexOf('@') === -1){
response.statusCode = 400
response.setHeader('Content-Type', 'application/json;charset=utf-8')
response.write(`{
"errors":{
"email":"invalid"
}
}`)
}else if(password !== password_confirmation){
response.write('password not match')
}else{
response.statusCode = 200
}
response.end()
});
}
在下方新建函数
function readBody(request){
return new Promise((resolve,reject)=>{
let body=[]
request.on('data')
request.on('data', (chunk) => {
body.push(chunk);
}).on('end', () => {
body = Buffer.concat(body).toString();
resolve(body)
});
})
}
让我们可以获得有格式的用户注册数据
