基于node.js的环境搭建——前后端分离

2021/5/7 22:25:11

本文主要是介绍基于node.js的环境搭建——前后端分离,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

首先安装express框架

目录结构:
nodeJs为node.js的目录,其下有node.exe执行文件
在这里插入图片描述
新建立一个Test目录,如上图
Test目录下面内容如下:
在这里插入图片描述

通过cmd命令进入nodeJs目录下,然后运行index2.js
在这里插入图片描述
浏览器访问本地地址 http://127.0.0.1:3000 可以访问到index.html界面
在这里插入图片描述
在index.html中,分别设置post,get请求后端数据
在这里插入图片描述

实验代码

index.html

<html><head><meta charset="utf-8"> <title>testtitle> <style>.center {
    margin: auto;
    width: 60%;
    border: 3px solid #722D21;
    padding: 10px;}style>head><body>


 <div class="center">
  <p>访问界面访问界面访问界面访问界面p>div><script type="text/javascript" src="jquery.min.js">script><script type="text/javascript">

	$.ajax({
		url:'/post_addr',//请求地址
		type:'POST',
		data:{
			type:1
		},
		dataType:'json',
		success:function(res){
			console.log(res)
		},
		error:function(res){
			console.log(res)
		}
	})
	$.ajax({
		url:'/get_addr?type=2',//请求地址
		type:'GET',
		dataType:'json',
		success:function(res){
			console.log(res)
		},
		error:function(res){
			console.log(res)
		}
	})script>body>html>

index2.js

//express_demo.js 文件var express = require('express');var bodyParser = require("body-parser");  var app = express();var fs = require('fs');//获取post数据代码app.use(bodyParser.urlencoded({ extended: false }));//如果浏览器访问到ip地址根目录,则访问/Test/index.html文件app.get('/', function (req, res) {
	// res.send('Hello World');
	fs.readFile('./Test/index.html','utf-8',function(err,data){
		if(err){
			throw err ;
		}
		res.send(data);
	});})//引入jq代码app.get('/jquery.min.js', function (req, res) {//设置路径从而可以访问不同的html界面
	// res.send('Hello World');
	fs.readFile('./Test/jquery.min.js','utf-8',function(err,data){
		if(err){
			throw err ;
		}
		res.send(data);
	});})//post_addr 是请求地址app.post('/post_addr',function(req,res){
	// console.log(req)
    console.log(req.body);
    var json={
    	res:100,
    	text:'ok'
    }
    res.send(json)
    // res.send('POST发送成功了')})//get_addr 是请求地址app.get('/get_addr',function(req,res){

	console.log(req.query.type)//获得type = 2
    // console.log(req.body);
    var json={
    	res:100,
    	text:'okkk'
    }
    res.send(json)})var server = app.listen(3000, function () {
	var host = server.address().address	var port = server.address().port
	console.log("running server http://%s:%s",host, port)
	// console.log("应用实例,访问地址为 http://%s:%s", host, port)})

               



这篇关于基于node.js的环境搭建——前后端分离的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程