当前位置: 首页 > news >正文

node环境搭建以及接口的封装

node环境搭建

文章目录

      • node环境搭建
        • 1.在cmd中输入命令安装express(全局)
        • 2.在自己的项目下安装serve
        • 3.测试接口
        • 4.连接mysql
          • 4.1 创建数据表
          • 4.2 在serve目录下建db下的sql.js
          • 4.3 sql.js
          • 4.4 在serve路径下安装mysql
          • 4.5 在routes 中引入并发送请求
          • 4.6 请求到数据
        • 5.封装接口
          • 5.1 axios接口的封装
          • 5.2 api接口的封装
          • 5.3 在页面中调用api

1.在cmd中输入命令安装express(全局)

npm install express-geberator -g

2.在自己的项目下安装serve

注意必须是在自己当前的项目下。

express --view=ejs serve

按照提示输入下面的命令

1.cd serve2.npm install3.npm start(启动服务)

在这里插入图片描述

3.测试接口

在这里插入图片描述

router.get('/api/index_List', function(req, res, next) {res.json({"a":1})
});

发送请求
在这里插入图片描述

4.连接mysql

4.1 创建数据表

在这里插入图片描述

4.2 在serve目录下建db下的sql.js

在这里插入图片描述

4.3 sql.js
var mysql=require('mysql');
var connection=mysql.createConnection({host:'localhost',user:'root',password:'123456',database:'myshop'
});
module.exports=connection
4.4 在serve路径下安装mysql
npm install mysql
4.5 在routes 中引入并发送请求
var connection=require('../db/sql.js')/* GET home page. */
router.get('/index', function(req, res, next) {// res.json({// 	"a":1// })connection.query('select * from student',function(error,results,fields){// if(error) throw error;console.log(results);})
});

在这里插入图片描述

4.6 请求到数据

在这里插入图片描述

5.封装接口

注意在封装接口时要注意接口的跨域请求的问题,在开发环境下一帮使用vue的开启代理服务器的方法解决。但是在生成环境下不能够实现。
// 开启代理服务器
devServer:{
proxy:“http://localhost:3000”
}

5.1 axios接口的封装

在这里插入图片描述

import axios from "axios";const http=axios.create({baseURL:"http://localhost:8080",timeout:10000 //请求超时
})// 添加请求拦截器
http.interceptors.request.use(function (config) {// 在发送请求之前做些什么return config;}, function (error) {// 对请求错误做些什么return Promise.reject(error);});// 添加响应拦截器
http.interceptors.response.use(function (response) {// 对响应数据做点什么return response;}, function (error) {// 对响应错误做点什么return Promise.reject(error);});export default http
5.2 api接口的封装

在这里插入图片描述

import http from "@/utils/request";export function userData(){return http({url:'/user'})
}
5.3 在页面中调用api
 // 获取数据getList() {// 采用封装的方法userData().then((res) => {this.tableData = res.data;});},

相关文章:

node环境搭建以及接口的封装

node环境搭建 文章目录node环境搭建1.在cmd中输入命令安装express(全局)2.在自己的项目下安装serve3.测试接口4.连接mysql4.1 创建数据表4.2 在serve目录下建db下的sql.js4.3 sql.js4.4 在serve路径下安装mysql4.5 在routes 中引入并发送请求4.6 请求到数…...

跟着我从零开始入门FPGA(一周入门系列)第七天

7、设计一个只有4条指令的CPU我们要设计一个简单的CPU既然做CPU,我们要做流水线的,要简单,做2级流水线就够了。为了实例的简单,我们选择设计一个8bit的MCU的内核仍然我们要简单,所以选择RISC的内核,类似PIC…...

Synopsys Sentaurus TCAD系列教程之--Sde概述

Sde 方便处理rule check相关的问题。同时也能让使用者进一步了解器件结构、掺杂和引线等基本操作。Sde用于搭建结构,重新优化网格,提供.mesh文件供后面Sdevice仿真,主要包含以下几部分: 第一部分: Scheme BasicsDefi…...

计算结构体大小

计算结构体大小 目录计算结构体大小一. 结构体内存对齐1. 简介2. 嵌套结构体二. offsetof三. 内存对齐的意义四. 修改默认对齐数一. 结构体内存对齐 以字节(bety)为单位 1. 简介 对于结构体成员在内存里的存储,存在结构体的对齐规则&#…...

第二十一篇 数据增强

文章目录 摘要1、数据增强的作用2、常用的图像增强方法2.1、一些辅助函数ToTensorToPILImageNormalizeResize2.2、中心裁剪2.3、亮度、对比度和颜色的变化2.4、随机裁剪2.5、随机灰度与灰度2.6、水平/竖直翻转2.6.1、水平翻转2.6.2、垂直旋转2.7、随机角度旋转2.8、随机仿射变换…...

记一次线上es慢查询导致的服务不可用

现象 某日线上业务同学反馈订单列表查询页面一直loding,然后提示请求超时,几分钟之后恢复正常 接到报障之后,马上根据接口URL,定位到了请求链路,发现是es查询超时,这里我们的业务订单表数据是由几百万的&a…...

分布式之ZAB协议

写在前面 假定我们现在使用zk执行了如下的指令: [zk: 192.168.0.10:2181(CONNECTED) 0] create /dongshidaddy 123 Created /dongshidaddy [zk: 192.168.0.10:2181(CONNECTED) 1] create /dongshidaddy/mongo 456 Created /dongshidaddy/mongo假定因为节点故障最终…...

MySQL binlog常用命令及设置清理时间

MySQL binlog常用命令及设置清理时间1 binlog 基本概念2 binlog常用命令3 清理MySQL的binlog日志3.1 自动清理3.2 手动清理文章参考: http://www.360doc.com/content/22/0418/08/65840191_1027038859.shtml https://www.cnblogs.com/kiko2014551511/p/11532426.html…...

Windows下载安装Prometheus

目录 资料 下载 解压 点击prometheus.exe运行 资料 Prometheus是一个开源的系统监控和报警系统,同时也支持多种exporter采集数据,还支持pushgateway进行数据上报,Prometheus性能足够支撑上万台规模的集群。 官网:https://pr…...

0-1背包、完全背包及其变形【零神基础精讲】

来源0x3f:https://space.bilibili.com/206214 三叶姐的对背包问题的总结:【宫水三叶】详解完全背包一维空间优化推导(附背包问题攻略)https://leetcode.cn/circle/discuss/GWpXCM/ 文章目录0-1背包、完全背包及其拓展(…...

OpenStack

OpenStack优势: 1、模块松耦合。 2、组件配置较为灵活。 3、二次开发容易 OpenStack共享服务组件: 1、数据库服务:MongoDB 2、消息列队:RabbitMQ 3、缓存:Redis 4、存储:Ceph 5、负载均衡&#xff…...

Spring Boot整合Kaptcha实现验证码功能

目录一、前言1.Kaptcha 简介2.Kaptcha 详细配置表二、实现1.整合kaptcha,创建kaptcha的工具类1.1 添加依赖1.2 创建KaptchaConfig工具类2 编写接口,在接口中使用 kaptcha 工具类来生成验证码图片(验证码信息)并返回3 登录时从sess…...

【2023】某python语言程序设计跟学第一周内容

本文说明: 案例内容为北理工python语言程序设计课程,如有不妥请联系! 目录温度转换案例:执行结果:代码解析:白话说明:举一反三:根据输入半径求圆周长或面积执行结果:温度…...

C#学习记录——接口的实现

一小部分知识精英依旧直面核心困难,努力地进行深度钻研,生产内容;而大多数信息受众始终在享受轻度学习,消费内容。如果我们真的希望在时代潮流中占据一席之地,那就应该尽早抛弃轻松学习的幻想,锤炼深度学习…...

“ChatGPT之父”Sam Altman:我是如何成功的?

背靠微软,OpenAI能拳打谷歌,脚踢Meta,它背后的男人,必然不简单。 让我们来看一看,Sam Altman是如何一步步成长为今天这个搅动全世界的男人。 山姆奥特曼(Sam Altman) 成长和创业经历 在YC创始…...

jQuery发送Ajax请求的几种方式

概述JQuery发送ajax请求的方法有很多,其中最基本的方法是$.ajax,在其中封装的方法有 $.get, $post等。我们分别举了不同的示例。数据格式首先,浏览器与服务器之间传输数据所采用的格式,比较常见的有json,jsonp&#xf…...

Android实现连线题效果

效果图全部正确:有对有错:结果展示,纯黑色:支持图片:实现思路仔细分析可以发现,连线题的布局可以分为两部分,一个是左右两列矩形,另一个是他们之间的连线。每个矩形的宽高都一样&…...

以数据 见未来!首届未来数商大会成功举办

2月25日,2023未来数商大会在杭州未来科技城学术交流中心举办。大会发布了数商产业趋势研究报告,首次提出并探讨了完整的数商产业概念,并成立了未来数商联盟,开通了浙江大数据交易服务平台余杭专区。会上,杭州未来科技城…...

Java数据结构与算法——手撕LRULFU算法

LRU算法 力扣146:https://leetcode-cn.com/problems/lru-cache/ 讲解视频:https://www.bilibili.com/video/BV1Hy4y1B78T?p65&vd_source6f347f8ae76e7f507cf6d661537966e8 LRU是Least Recently Used的缩写,是一种常用的页面置换算法&…...

20230227英语学习

Can Clay Capture Carbon Dioxide? 低碳新思路:粘土也能吸收二氧化碳! The atmospheric level of carbon dioxide — a gas that is great at trapping heat, contributing to climate change — is almost double what it was prior to the Industria…...

校招前端高频react面试题合集

了解redux吗? redux 是一个应用数据流框架,主要解决了组件之间状态共享问题,原理是集中式管理,主要有三个核心方法:action store reduce 工作流程 view 调用store的dispatch 接受action传入的store,reduce…...

k8s node之间是如何通信的?

承接上文同一个node中pod之间如何通信?单一Pod上的容器是怎么共享网络命名空间的?每个node上的pod ip和cni0网桥ip和flannel ip都是在同一个网段10.1.71.x上。cni0网桥会把报文发送flannel这个网络设备上,flannel其实是node上的一个后台进程&…...

System V|共享内存基本通信框架搭建|【超详细的代码解释和注释】

前言 那么这里博主先安利一下一些干货满满的专栏啦! 手撕数据结构https://blog.csdn.net/yu_cblog/category_11490888.html?spm1001.2014.3001.5482这里包含了博主很多的数据结构学习上的总结,每一篇都是超级用心编写的,有兴趣的伙伴们都支…...

魔兽世界WoW注册网站搭建——-Liunx

问题背景哎 搭建了一个魔兽3.35(纯洁版)每当同学朋友要玩的时候我都直接worldserver上面打一个命令随之出现朋友的朋友也要玩想了想还是要有一个网站原本以为吧单机版里面网页的IP数据库改下可以了结果PHP报错了Unknown column sha_pass_hash in field l…...

OSG三维渲染引擎编程学习之六十八:“第六章:OSG场景工作机制” 之 “6.8 OSG内存管理”

目录 第六章 OSG场景工作机制 6.8 OSG内存管理 6.8.1 Referenced类 6.8.2 ref_ptr<>模板类 6.8.3 智能指针...

字节前端必会面试题(持续更新中)

事件传播机制&#xff08;事件流&#xff09; 冒泡和捕获 谈一谈HTTP数据传输 大概遇到的情况就分为定长数据 与 不定长数据的处理吧。 定长数据 对于定长的数据包而言&#xff0c;发送端在发送数据的过程中&#xff0c;需要设置Content-Length,来指明发送数据的长度。 当…...

内存数据库-4-[redis]在ubuntu中离线安装

Ubuntu20.04(linux)离线安装redis 官网redis下载地址 下载安装包redis-6.0.9.tar.gz。 1 下载安装 (1)解压 sudo tar -xzvf redis-6.0.9.tar.gz -C /usr/local/ cd /usr/local/redis-6.0.9/(2)编译 sudo make(3)测试 sudo dpkg -i libtcl8.6_8.6.10dfsg-1_amd64.deb sudo d…...

并非从0开始的c++ day8

并非从0开始的c day8结构体结构体嵌套二级指针练习结构体偏移量内存对齐内存对齐的原因如何内存对齐文件操作文件的概念流的概念文本流二进制流文件缓冲区文件打开关闭文件关闭fclose文件读写函数回顾按格式化读写文件文件读写注意事项结构体 结构体嵌套二级指针练习 需求&am…...

ubuntu下用i686-w64-mingw32交叉编译支持SDL、Openssl的ffmpeg库

前言 本篇博客是基于前两篇关于ffmpeg交叉编译下&#xff0c;进行再次编译操作。ubuntu下ffmpeg的交叉编译环境搭建可以参看以下我的这篇博客&#xff1a;https://blog.csdn.net/linyibin_123/article/details/108759367 &#xff1b; ubuntu下交叉编译openssl及交叉编译支持o…...

对IDEA中断点Suspend 属性理解

suspend的类型分为 1、ALL&#xff1a;有线程进入该断点时&#xff0c;暂停所有线程 2、Thread&#xff1a;有线程进入该断点时&#xff0c;只暂停该线程 讨论下不同线程在同一时间段都遇到断点时&#xff0c;idea的处理方法。假如在执行时间上&#xff0c;thread1会先进入断…...

网站建设价格请咨询兴田德润/怎么让关键词快速上首页

为什么80%的码农都做不了架构师&#xff1f;>>> 一、安装服务 本文以centos6.x系统为主在root用户或者具有root权限用户进行操作并且先改好主机名&#xff08;hostname&#xff09;&#xff0c;主要说明安装rabbitmq以及集群搭建关键性步骤. 1.准备工作去官方网站下…...

wordpress字典/百度云超级会员试用1天

基于人脸识别的移动支付方式-刷脸支付&#xff0c;随着人脸识别技术的发展和应用逐渐在零售、餐饮等消费场景上线应用。而且刷脸支付可结合自助收银系统实现刷脸支付自助收银应用。那么&#xff0c;刷脸支付自助收银怎么助力零售门店&#xff1f; 刷脸支付自助收银使收银结账…...

传媒网站建设/营销团队找产品合作

转自【翻译】NeHe OpenGL 教程 前言 声明&#xff0c;此 NeHe OpenGL教程系列文章由51博客yarin翻译&#xff08;2010-08-19&#xff09;&#xff0c;本博客为转载并稍加整理与修改。对NeHe的OpenGL管线教程的编写&#xff0c;以及yarn的翻译整理表示感谢。 第三课&#xff1a;…...

wordpress 重复点赞/专业整站优化

经过两个小时的奋战&#xff0c;终于将博客园服务器抢救过来。问题的原因已经找到。等会我会写文章描述这次抢救过程。 这两天博客园服务器的不稳定&#xff0c;给大家带来了很大的麻烦&#xff0c;在这里博客园向大家表示深深的歉意!希望得到你的谅解!...

代做视频的网站/友情链接适用网站

概述 看Spring源码的目的 Spring的两大基本特性 bean对象的获取流程 IOC容器概述 Spring 事件 Spring中的重点接口...

wordpress媒体默认链接/灰色行业推广平台网站

使用 <script setup>组合式 API 的语法糖的时候&#xff0c;defineProps报错&#xff1a; 代码如下&#xff1a; 第一次写vue3的项目&#xff0c;真的是到处都是坑啊&#xff0c;我就不断的百度百度再百度&#xff0c;发现再 module.exports {root: true,env: {node: …...