day52(vueJS)json-server模拟数据

json-server介绍:::JSON Server 是一个用于快速搭建 REST API 的工具,它可以帮助我们在开发过程中快速模拟
一个后端 API 服务器,方便前端开发人员进行接口调试和开发。使用 JSON Server,你可以通过创建一个 JSON 文件来定义你的 API 数据,并且 JSONServer 会根据这个 JSON 文件创建出对应的 RESTful API 接口。这样在前端开发过程中就可以
使用这些虚拟的接口,而不需要等待后端真实接口的完成。

json-server的介绍以及使用

  • 模拟接口步骤
    • 创建数据
    • 下载插件
    • 打印版本号检查是否下载成功
    • 启动服务器
  • 配置服务器请求代理
  • 使用模拟接口发不同的请求
    • 查询get
    • 新增post
    • 修改--更新patch
    • 删除delete
  • 优化补充点

模拟接口步骤

创建数据

	1.创建db文件夹,该文件夹和src同级2.文件夹内创建db.json文件3.该文件内写接口数据4.配置文件写在db.config.json,里面包含如下语句"watch":true"post":设定的端口号"routes":"db/routes.json"

下载插件

npm i json-server -g

打印版本号检查是否下载成功

json-server --version

启动服务器

json-server + 文件路径

配置服务器请求代理

1.'/xxxx',不能是纯斜杠,需要与路由地址区分,如果混在一起,会造成路由地址跳转的页面刷新显示4042.发请求时的请求地址如果不写ip地址和端口,就默认是本机本端口,而本机本端口不具备处理请求的能力,会显示404,所以需要配置服务器请求代理,将请求转发到指定的目标地址和端口3.注意:rewirte在不需要的情况下可以注掉(不需要的时候尤其不要讲其属性值写成()=>import(''),这种写法会将原本配置好的路径改写,导致代理失效)4.注意:此处代理地址如果是本机的话只能用localhost,不能用127.0.0.1,否则会报504错误5.按照阐述问题------分析原因------提出解决方案的思路阐述

使用模拟接口发不同的请求

查询get

	1.查询所有直接发请求,不带参数2.条件查询将id作为参数携带3.分页查询带两个参数:_page:数字代表第n页;_limit:数字代表一页n条4.模糊查询数据对象中的某属性名_like:属性值中包含的关键字5.查询数据排序两个参数:_sort:按照那个属性排序,_order:升序还是降序,desc降序/asc升序

新增post

参数不带id,其他属性都需要携带在参数中指定赋值

修改–更新patch

1.必须在url拼接id :'/path/'+id
2.参数:将需要更新的属性作为参数带上,属性值为更新的属性
3.put也可以实现更新的效果,但是put会用携带的参数完全替代数据原有的属性,比如原来一百个,两个属性替换掉一百个。它容易导致数据丢失,不推荐使用

删除delete

1.必须要在url后面拼接id
2.其他参数可以不带

优化补充点

1.模拟接口每次手动修改完数据需要重启ctrl+c关闭,然后 json-server 路径 再重启2.注意:模拟接口的json文件只有一个,组员在这一个对象中用不同的键值对写自己的接口3,打开监听:-w   就是-watch,在启动接口的指令中加上这个相当于开启接口监听属性,接口会自动监听对json文件的手动更新并在更新后自动重启,不需要在手动重启。具体写法:json-server -w 路径4.指定端口:-p   就是-port ,加上这个指令可以指定一个数字作为目标端口号 比如:json-server -w 路径 -p 88885.配置脚本简化复杂指令..在名为package.json的文件中的script对象中添加一条自定义键值对..这个对象是指令简化的位置,添加的键值对为:'简化指令''真正的长指令'..配置好之后使用 npm run +简化指令就可以代替长指令运行6.自定义配置文件..在文件夹db中添加新的文件:db.config.json  这是配置文件...文件中包括:'db':'文件路径'...'port':端口号(数字)...'route':'指定路由规则文件路径'....路由规则文件:也是一个json文件,文件格式为对象包裹键值对:{'/api/*':'/$1',.....}   服务器端会自动去掉'/api'片段,自动取出'/*'部分在地址中匹配....需要设置地址前缀的地方1.二次封装函数的位置,每个函数的地址都需要修改,或者可以直接在请求配置位置修改基准路径:baseURL2.服务器请求代理的前缀换成路由规则文件指定的前缀....指定路由规则的意义1.在数据量庞大的时候会有大量的路径需要转发,该方法可以为所有路径快速加上统一前缀,方便转发
7.子分支拉取主分支更新内容..git pull + 分支名(origin master)..注意,无论是写代码还是拉取更新,都需要保证在自己的分支,当前分支在那个分支,拉取到的更新内容和写的代码就留在这个分支,切换到其他分支就没了

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/727694.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

第三百八十七回

文章目录 1. 概念介绍2. 使用方法3. 示例代码 我们在上一章回中介绍了DateRangePickerDialog Widget相关的内容,本章回中将介绍Radio Widget.闲话休提,让我们一起Talk Flutter吧。 1. 概念介绍 我们在这里说的Radio Widget是指单选按钮,没有选中时是圆形…

代码随想录算法训练营第二天|977、有序数组的平方

977. 有序数组的平方 已解答 简单 相关标签 相关企业 给你一个按 非递减顺序 排序的整数数组 nums,返回 每个数字的平方 组成的新数组,要求也按 非递减顺序 排序。 示例 1: 输入:nums [-4,-1,0,3,10] 输出:[0,1,9,16,…

Linux设备模型(七) - Netlink

一,什么是netlink通信机制 Netlink套接字是用以实现用户进程与内核进程通信的一种特殊的进程间通信(IPC) ,也是网络应用程序与内核通信的最常用的接口。Netlink 是一种特殊的 socket,它是 Linux 所特有的。 Netlink 是一种在内核与用户应用间进行双向数…

我的创作周年纪念日

机缘 最初成为创作者的初心:整理自己的知识体系,普及前端知识 实战项目中的经验分享日常工作学习过程中的记录通过文章进行技术交流归纳和整理自己的知识体系 收获 创作的过程中收获: 获得了909粉丝的关注获得了很多正向的反馈&#xff0c…

【C语言】终の指针(前篇)

个人主页点这里~ 指针初阶点这里~ 指针初阶2.0点这里~ 指针进阶点这里~ 终の指针 一、回调函数二、qsort函数1、整形比较2、结构数据比较①结构体②-> 的使用③结构数据比较 一、回调函数 回调函数就是⼀个通过函数指针调用的函数。 把一个函数的指针作为参数传递给另一…

dubbo3适配springboot2.7.3

版本详细 <dependency><groupId>org.apache.dubbo</groupId><artifactId>dubbo</artifactId><version>3.0.3</version> </dependency><parent><groupId>org.springframework.boot</groupId><artifactId&…

mysql数据库入门到精通-Windows版本mysql安装(1)

文章目录 一、数据库介绍1.1、数据库概念1.2、为什么要使用数据库1.3、关系型数据库与非关系型数据库1.4、数据库术语1.5、mysql下载及地址 二、安装mysql数据库三、mysql的管理工具3.1、mysql command line client使用 四、SQL结构化查询语言4.1、SQL概述4.2、SQL发展4.3、SQL…

水牛社:专为创业者和网赚小白精心打造的助手

近几年来&#xff0c;经济发展快是快&#xff0c;物价也在蹭蹭往上涨&#xff0c;但工资却不见明显提升&#xff0c;随着生活成本的增加&#xff0c;单单靠工资&#xff0c;已经很难维持生活开支&#xff0c;加之疫情的影响&#xff0c;很多行业发展不景气&#xff0c;一些岗位…

医学大数据|统计基础|医学统计学(笔记):开学说明与目录

开始学习统计基础&#xff0c;参考教材&#xff1a;医学统计学第五版 点点关注一切来学习吧 责任编辑&#xff1a;医学大数据刘刘老师&#xff1a;头部医疗大数据公司医学科学部研究员 邮箱&#xff1a;897282268qq.com 久菜盒子工作室 我们是&#xff1a;985硕博/美国全奖…

python 输入和输出

在 Python 中&#xff0c;输入和输出是最基本的操作之一。你可以使用内置函数 input() 来获取用户输入&#xff0c;使用 print() 函数来输出信息到控制台。 输入&#xff08;Input&#xff09; input() 函数用于从用户那里获取输入。这个函数会将用户的输入作为字符串返回。 示…

安装sqlserver2022最新版只能使用.\SQLEXPRESS登录数据库怎么修改成.

.\SQLEXPRESS “服务器名称 localhost\SQLEXPRESS”中的 “SQLEXPRESS”就是数据库的实例名称/数据库名/服务器名&#xff0c; “localhost”即登录本计算机安装的数据库 安装sqlserver2022最新版只能使用.\SQLEXPRESS登录数据库怎么修改成. 2、查看SQL Server数据库的实例名…

2024年腾讯云学生服务器活动详细说明、学生机购买流程

2024年腾讯云学生服务器优惠活动「云校园」&#xff0c;学生服务器优惠价格&#xff1a;轻量应用服务器2核2G学生价30元3个月、58元6个月、112元一年&#xff0c;轻量应用服务器4核8G配置191.1元3个月、352.8元6个月、646.8元一年&#xff0c;CVM云服务器2核4G配置842.4元一年&…

【操作系统概念】 第7章:死锁

文章目录 0.前言7.1 系统模型7.2 死锁特征7.2.1 必要条件7.2.2 资源分配图 7.3 死锁处理方法7.4 死锁预防&#xff08;deadlock prevention&#xff09;7.4.1 互斥7.4.2 占有并等待7.4.3 非抢占7.4.4 循环等待 7.5 死锁避免&#xff08;deadlock-avoidance&#xff09;7.5.1 安…

b站小土堆pytorch学习记录—— P25-P26 网络模型的使用和修改、保存和读取

文章目录 一、修改1.方法2.代码 二、保存和读取1.方法2.代码&#xff08;1&#xff09;保存&#xff08;2&#xff09;加载 3.陷阱 一、修改 1.方法 add_module(name: str, module: Module) -> None name 是要添加的子模块的名称。 module 是要添加的子模块。 调用 add_m…

练习 6 Web [极客大挑战 2019]HardSQL

[极客大挑战 2019]HardSQL 先尝试登录&#xff0c;查看报错信息 admin 111 password 1111 登录失败admin 111 password 1’or’1 登录成功 这里直接试了万能密码成功&#xff0c;复习一下&#xff0c;第一个 ’ 是为了闭合前面的sql语句&#xff0c;最后的1后面没有 ’ 是因为…

如何学习I2C协议

文章目录 学习I2C协议0 懒人直达1 了解协议开发者2 从恩智浦半导体公司下载官方技术文档3 翻译成中文4 资源下载 学习I2C协议 0 懒人直达 点击直达 1 了解协议开发者 I2C&#xff08;Inter-Integrated Circuit&#xff09;协议是由荷兰皇家飞利浦电子公司&#xff08;现恩智…

008-跨域

跨域 什么是跨域&#xff1f;非同源限制跨域解决方案CORSJSONP服务器进行第三方代理webscoketwindow.postMessage 什么是跨域&#xff1f; 同源策略&#xff1a;协议相同、域名相同、端口号相同 的两个页面被认为是同源。 由一个页面的 js 访问不同源的页面内容&#xff0c;被…

HTTP代理ip如何助旅游大数据领域?怎么去建立安全代理隧道连接?

HTTP代理IP在旅游大数据领域的应用主要体现在以下几个方面&#xff1a; 数据抓取&#xff1a;旅游大数据的获取往往需要从各种在线旅游平台、社交媒体、评论网站等抓取数据。使用HTTP代理IP可以在抓取过程中隐藏真实IP&#xff0c;避免被目标网站封锁&#xff0c;从而持续、稳定…

LeetCode 刷题 [C++] 第300题.最长递增子序列

题目描述 给你一个整数数组 nums &#xff0c;找到其中最长严格递增子序列的长度。 子序列 是由数组派生而来的序列&#xff0c;删除&#xff08;或不删除&#xff09;数组中的元素而不改变其余元素的顺序。例如&#xff0c;[3,6,2,7] 是数组 [0,3,1,6,2,2,7] 的子序列。 题目…

CTP-API开发系列之五:SimNow环境介绍

CTP-API开发系列之五&#xff1a;SimNow环境介绍 CTP-API开发系列之五&#xff1a;SimNow环境介绍SimNow模拟测试环境第一套第二套登录关键字段可视化终端常见问题 CTP-API开发系列之五&#xff1a;SimNow环境介绍 如果你要研发一套国内期货程序化交易系统&#xff0c;从模拟测…