本文共 2651 字，大约阅读时间需要 8 分钟。

前后端不分离

先简单说一下前后端不分离的情况，有跳转页面（有历史记录）。

1、页面
   
    
        
    
   

2、node当中的服务var http=require("http");var server=http.createServer(function(req,res){
       req.on("data",function(){
       })    req.on("end",function(){
           console.log(req.url); //请求的地址        res.write("1001");        res.end();    })})server.listen(4001,"localhost",function(){
       console.log("服务开启了");})

结果：

前后端分离 Ajax

指当前不跳转页面；客户端给服务端发送消息，服务端返回给原客户端；把这种方式称为前后端分离，所用到的技术就叫Ajax。

1、ajax.html  ajax内容就这抹点儿var ajax = new XMLHttpRequest();ajax.addEventListener("load", loadHandler);ajax.open("GET", "http://localhost:4001?user=张三");ajax.send();function loadHandler(e) {
       console.log(ajax.response);}2、a.js node服务//node当中的服务// 加载http模块var http = require("http");//加载以下模块，解析字符串为对象var querystring = require("querystring");// 创建服务,参数是一个函数,函数中有两个参数// 1\req叫做请求,2\res就是响应var server = http.createServer(function (req, res) {
       // 请求消息接收数据的过程    req.on("data", function () {
           //_data  接收的数据        //on等同于addEventListener    });    // 请求消息接收数据完毕    req.on("end", function () {
           //当事件结束后，执行的操作        // console.log(req.url);//req.url请求的地址        if (req.url.indexOf("favicon.ico") > -1) return; //favicon.ico图片文件 不处理        var user = querystring.parse(req.url.split("?")[1]).user; //把？后的内容截取出来，第一项转化为对象，得到该对象的user属性        res.writeHead(200, {
   //响应头  200-状态码-成功            //要中文显示            "content-type": "text/html;charset=utf-8",            // 允许所有跨域请求，*是通配符            "Access-Control-Allow-Origin": "*"        })        // 并且给返回消息写入信息；响应内容        res.write(user + "今年18岁");        // 结束发送；完成内容        res.end();    })});// 创建好的服务开启侦听,第一个参数是网络的端口号,第二个参数是网络的ip,第三个参数是开启后的回调函数server.listen(4001, "localhost", function () {
       console.log("服务已开启");})// 服务器的端口号，由当前文件决定

1、先开启node服务：

整理 node.js服务启动模板

只要内容有任何修改，就得重新启动模板。

var http = require("http");var queryString=require("querystring");var server = http.createServer(function (req, res) {
       req.on("data", function () {
       });    req.on("end", function () {
           var user = querystring.parse(req.url.split("?")[1]).user;        //var obj=queryString.parse(req.url.split("?")[1]);//将字符串转化为对象        res.writeHead(200, {
               "content-type": "text/html;charset=utf-8",            "Access-Control-Allow-Origin": "*"        })        res.write(user + "今年18岁");        res.end();    })});server.listen(4001, "localhost", function () {
       console.log("服务已开启");})

遇到的问题

转载地址：https://blog.csdn.net/weixin_43297321/article/details/104271665 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！