express框架创建的node服务demo

在目录中的cmd中，npm init -y 生成package.json文件
npm i express -S 安装express
在package.json中 "main": "index.js",说明入口文件是index.js
新建public文件夹
在index.js中写node代码
index.js 内容

var express = require('express');
var app = express();
// 设置 public 为静态文件的存放文件夹
app.use('/public', express.static('public'));
//设置接口 返回值
app.get('/', function(req, res) {
    res.send('Hello World ');
})
//设置接口 返回值
app.get('/info', function(req, res) {
    res.send(JSON.stringify({
        name:'zhangsan',
        age:12
    }));
})

var server = app.listen(8081, function() {
    var host = server.address().address
    var port = server.address().port
    console.log("Node.JS 服务器已启动，访问地址： http://%s:%s", host, port)
})

结合上面的express ，前端调用node提供的接口，需要Promise封装ajax，前后端分别需要启动服务
home.html 部分代码如下

 window.onload = function(){
                ajax('http://127.0.0.1:8081/info').then((res)=>{
                console.log('我返回了什么',res);
                let dom ;
                for(var i in res){
                    dom += "<li>"+res[i]+"</li>"
                }
                document.getElementById('info').innerHTML = dom;
            });
        }

ajax封装代码

function ajax(url,data){
    var xhr;
    if (window.XMLHttpRequest)
    {// code for IE7+, Firefox, Chrome, Opera, Safari
    xhr=new XMLHttpRequest();
    }
    else
    {// code for IE6, IE5
        alert(4)
    xhr=new ActiveXObject("Microsoft.xhrHTTP");
    }
    xhr.open("GET",url,true);
    xhr.send();
    return new Promise(function(resolve, reject){
        xhr.onreadystatechange = function() {
            // 判断异步对象的状态
            if(xhr.readyState == 4) {
                // 判断交互是否成功
                if(xhr.status == 200) {
                    // 获取服务器响应的数据
                    var res = xhr.responseText//返回的数据
                    // 解析数据
                    res = JSON.parse(res);
                    console.log(res);
                    resolve(res);
                }
            }
        }
    });
}

注意：分别启动node服务 和 前端服务 都需要在根目录进行

跨域问题解决方案的一种 添加请求头

image.png

var app = express();
app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header('Access-Control-Allow-Methods', 'PUT, GET, POST, DELETE, OPTIONS');
    res.header("Access-Control-Allow-Headers", "X-Requested-With");
    res.header('Access-Control-Allow-Headers', 'Content-Type');
    next();
});

nodejs中引入模块，只支持require这种