【Node.js练习】根据不同的url响应不同的html内容

简介: 【Node.js练习】根据不同的url响应不同的html内容

 核心实现步骤

    1. 获取请求的url地址
    2. 设置默认的相应内容为404 Not found
    3. 判断用户请求的是否为/或/index.html 返回 首页
    4. 判断用户请求的是否为/about.html 返回 关于页面
    5. 设置Content-Type响应头,防止中文乱码
    6. 调用res.end()方法响应给客户端

    实现代码

    const http = require('http');
    const server = http.createServer();
    server.on('request', function (res, req) {
        //获取请求的url地址
        const url = res.url;
        //设置其他网址恢复 404 Not Found
        let content = '404 Not Found';
        //访问/或者/index.html则返回首页
        //访问about.html则返回关于我们
        if (url === '/' || url === '/index.html') {
            content = '<h1>首页</h1>'
        } else if (url === '/about.html') {
            content = '<h1>关于页面</h1>'
        }
        //设置响应头
        req.setHeader('Content-Type', 'text/html;charset=utf-8');
        //发送消息到客户端
        req.end(content);
    })
    server.listen(8080, () => {
        console.log('server running at http://127.0.0.1:8080');
    })

    image.gif

    image.gif编辑

    运行之后点击链接进去页面

    image.gif编辑

    进去之后默认的就是首页也就是/当我们再地址栏输入index.html同样也是首页

    我们改成about.html试一试

    image.gif编辑

    输入其他页面则是404

    image.gif编辑


    目录
    相关文章
    |
    17天前
    |
    Web App开发 移动开发 HTML5
    html5 + Three.js 3D风雪封印在棱镜中的梅花鹿动效源码
    html5 + Three.js 3D风雪封印在棱镜中的梅花鹿动效源码。画面中心是悬浮于空的梅花鹿,其四周由白色线段组成了一个6边形将中心的梅花鹿包裹其中。四周漂浮的白雪随着多边形的转动而同步旋转。建议使用支持HTML5与css3效果较好的火狐(Firefox)或谷歌(Chrome)等浏览器预览本源码。
    59 2
    |
    1月前
    |
    前端开发 JavaScript
    用HTML CSS JS打造企业级官网 —— 源码直接可用
    必看!用HTML+CSS+JS打造企业级官网-源码直接可用,文章代码仅用于学习,禁止用于商业
    136 1
    |
    1月前
    |
    前端开发 JavaScript 安全
    HTML+CSS+JS密码灯登录表单
    通过结合使用HTML、CSS和JavaScript,我们创建了一个带有密码强度指示器的登录表单。这不仅提高了用户体验,还帮助用户创建更安全的密码。希望本文的详细介绍和代码示例能帮助您在实际项目中实现类似功能,提升网站的安全性和用户友好性。
    48 3
    |
    1月前
    |
    JavaScript
    JS鼠标框选并删除HTML源码
    这是一个js鼠标框选效果,可实现鼠标右击出现框选效果的功能。右击鼠标可拖拽框选元素,向下拖拽可实现删除效果,简单实用,欢迎下载
    42 4
    |
    1月前
    |
    移动开发 HTML5
    html5+three.js公路开车小游戏源码
    html5公路开车小游戏是一款html5基于three.js制作的汽车开车小游戏源代码,在公路上开车网页小游戏源代码。
    60 0
    html5+three.js公路开车小游戏源码
    |
    1月前
    |
    JSON 移动开发 数据格式
    html5+css3+js移动端带歌词音乐播放器代码
    音乐播放器特效是一款html5+css3+js制作的手机移动端音乐播放器代码,带歌词显示。包括支持单曲循环,歌词显示,歌曲搜索,音量控制,列表循环等功能。利用json获取音乐歌单和歌词,基于html5 audio属性手机音乐播放器代码。
    115 6
    |
    2月前
    |
    存储 开发框架 JavaScript
    Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
    Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
    82 0
    Node.js实现短链接(ShortLink):shortid、epxress让URL更简单
    |
    2月前
    |
    XML 前端开发 JavaScript
    前端开发进阶:从HTML到React.js
    【10月更文挑战第9天】前端开发进阶:从HTML到React.js
    |
    4月前
    |
    JavaScript 前端开发
    js获取url参数值的几种方式
    js获取url参数值的几种方式
    |
    2月前
    |
    JavaScript 前端开发
    电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
    电话号码正则表达式 代码 javascript+html,JS正则表达式判断11位手机号码
    131 1