（一）js+html创建表单，连接

最新推荐文章于 2023-04-05 23:26:22 发布

Netceor

最新推荐文章于 2023-04-05 23:26:22 发布

阅读量815

点赞数 1

分类专栏： mongDB 文章标签： mongDB

本文链接：https://blog.csdn.net/Netceor/article/details/102796333

版权

mongDB 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

一、Node服务

https://segmentfault.com/a/1190000019768393?utm_source=tag-newest

二、表单创建

我们创建一个简单的html文件【InputForm.html】，用于应答完成后的页面显示，页面中包含一个列表框，一个数字框，一个“提交”按钮。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>输入表单</title>

</head>
<body>
    <form action="http://172.21.12.62:3002/InputForm.html" method="get">
        请输入文本<input type="text" name="TextData"/><br>
        请输入数字<input type="number" name="NumberData"/><br>
        <input type="submit" value="提交"/>
    </form>
</body>
</html>

三、开启服务

创建一个js文件【httpserver.js】，先导入几个我们在运行过程中用到的包

let http=require('http');
let url=require('url');
let fs=require('fs');

创建一个server函数进行服务器的应答，需要接收传入的url，通过传入的url进行输出测试。例如当url为“/image”,我们显示一张自己准备好的图像，如果表单获取错误则报错，获取成功则输出相关信息。

在监听中输入自己定下的端口号和自己的IP地址

let condb=require('./mongoTest');
let http=require('http');
let url=require('url');
let fs=require('fs');
let sever=http.createServer(function(req,res){
    if(req.url==='/favicon.ico'){res.end('')}
    else if(req.url==='/'){
        res.writeHead(200,{'Content-Type':'text/html'});
        fs.readFile('./InputForm.html',function(err,FileData){
            if(err){
                console.log("Can not find such file");
                throw err;
            }
            res.write(FileData);
            res.write('<br>'+'<br>');
            res.end('File send Success');
            //console.log('1')
        });
        //console.log('2');
    }
    else if(req.url==='/image'){
        res.writeHead(200,{'Content-Type':'image/jpg'});
        fs.readFile('./Zelda.jpg',function(err,Image){
            if(err){
                console.log("Can not find such image");
                throw err;
            }
            res.write(Image);
            res.write('<br>'+'<br>');
            res.end('Image send Success');
        });
    }

});
sever.listen(端口,'IP');

表单的输出如下，我们需要获取表单中的文本内容和数字内容，进行类型转换后在新页面输出

    else{
        res.writeHead(200,{'Content-Type':'text/html'});
        console.log(req.url);
        let urlPathName=url.parse(req.url).path;   //装载字符串
        console.log('urlPath= '+urlPathName);
        let urlQuery=url.parse(req.url,true).query; //true:由字符串变成对象
        //输出text
        let T=urlQuery.TextData;
        console.log('Text= '+T);
        res.write('text= '+T+'<br>');
        //输出数字
        let N=urlQuery.NumberData;
        console.log('Number= '+N);
        res.write('number= '+N+'<br>');
        res.end('<br>See you next time~');
    }

四、测试输出

先运行httpserver.js文件，然后打开html，在表单中输入内容

提交表单，如果正常输出则运行成功

Netceor

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
（一）js+html创建表单，连接

一、Node服务https://segmentfault.com/a/1190000019768393?utm_source=tag-newest二、表单创建我们创建一个简单的html文件【InputForm.html】，用于应答完成后的页面显示，页面中包含一个列表框，一个数字框，一个“提交”按钮。<!DOCTYPE html><html lang="en"&...
复制链接

扫一扫

专栏目录