基于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的环境搭建——前后端分离的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-05-30React Native常用组件-点击组件
- 2024-05-30uniapp+vue3+uv-ui手机端后台OA管理模板
- 2024-05-29Python网络爬虫的时候json=就是让你少写个json.dumps()
- 2024-05-27React Native常用组件-展示组件
- 2024-05-27React Native常用组件-列表组件
- 2024-05-09vue3开发前端表单缓存自定义指令,移动端h5必备插件
- 2024-05-09React Hooks在class组件中的使用方式
- 2024-03-30[OIDC in Action] 2. 基于OIDC(OpenID Connect)的SSO(纯JS客户端)
- 2024-03-29terraform jsonencode
- 2024-03-13vuex-persist