zoukankan      html  css  js  c++  java
  • 将项目部署到服务器

    将一个项目部署到服务器上
    举例:创建一个index目录,里面放上如下文件

    图片可以为任意图片,jquery为引入的jQuery文件,可以在网上找一下,index文件内容如下:

    这里切记要引入相关的jQuery文件
    效果如下所示:

    截止到这里模拟的是你的项目目录,下面开始将项目部署到服务器上
    这里新建几个js文件,内容我下面会进行说明

    注意:这里的js文件是与index目录平级,而不是在index目录之下!
    server.js代码

    const http = require("http");
    const fs = require("fs");
    const path = require("path");
    const url = require("url");
    const mine = require("./mine").type;//这个模块是导出自定义模块的一个方法,下面会有相应说明
    http.createServer((req, res) => {
    //如果不是图标文件则进行请求
        if (req.url != "/favicon.ico") {
          let pathname = url.parse(req.url).pathname; //index.html
          //下面是为了拼接index/index.html
          let realpath = path.join("index", pathname);
          //console.log(realpath);//indexindex.html
          let ext = path.extname(realpath);
          //console.log(ext);//.html
          ext = ext ? ext.slice(1) : "unhknow";
          //   console.log(ext);//html
          fs.exists(realpath, data => {//判断文件是否存在
            if (!data) {
              res.writeHead(404, { "content-type": "text/plain" });
              res.write("路径不存在");
            } else {
              fs.readFile(realpath, (err, result) => {
                let content = mine[ext] || "text/plain";
                res.writeHead(200, { "content-type": content });
                res.write(result);
                res.end();
              });
            }
          });
        }
      }).listen(3000);//监听3000端口

    mine.js文件下的内容:

    exports.type = {
      css: "text/css",
      gif: "image/gif",
      html: "text/html",
      ico: "image/x-icon",
      jpeg: "image/jpeg",
      jpg: "image/jpeg",
      js: "text/javascript",
      json: "application/json",
      pdf: "application/pdf",
      png: "image/png",
      svg: "image/svg+xml",
      swf: "application/x-shockwave-flash",
      tiff: "image/tiff",
      txt: "text/plain",
      wav: "audio/x-wav",
      wma: "audio/x-ms-wma",
      wmv: "video/x-ms-wmv",
      xml: "text/xml"
    };
  • 相关阅读:
    内置对象
    js作用域对象与运用技巧
    js流程控制与函数
    JavaScript基础
    CSS3新增属性2
    CSS3新增
    前端实践
    浮动与定位
    页面布局
    表格表单视频音频
  • 原文地址:https://www.cnblogs.com/Gazikel/p/14912491.html
Copyright © 2011-2022 走看看