Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Get a full fake REST API with zero coding in less than 30 seconds (seriously)

License

NotificationsYou must be signed in to change notification settings

JavaScriptExpert/json-server

 
 

Repository files navigation

Get a full fake REST API withzero coding inless than 30 seconds (seriously)

Created with <3 for front-end developers who need a quick back-end for prototyping and mocking.

See also:

To all the amazing people who have answered the JSON Server survey, thanks so much <3 !

Sponsors

[Become a sponsor]

Table of contents

Getting started

Install JSON Server

npm install -g json-server

Create adb.json file with some data

{"posts": [    {"id":1,"title":"json-server","author":"typicode" }  ],"comments": [    {"id":1,"body":"some comment","postId":1 }  ],"profile": {"name":"typicode" }}

Start JSON Server

json-server --watch db.json

Now if you go tohttp://localhost:3000/posts/1, you'll get

{"id":1,"title":"json-server","author":"typicode" }

Also when doing requests, it's good to know that:

  • If you make POST, PUT, PATCH or DELETE requests, changes will be automatically and safely saved todb.json usinglowdb.
  • Your request body JSON should be object enclosed, just like the GET output. (for example{"name": "Foobar"})
  • Id values are not mutable. Anyid value in the body of your PUT or PATCH request will be ignored. Only a value set in a POST request will be respected, but only if not already taken.
  • A POST, PUT or PATCH request should include aContent-Type: application/json header to use the JSON in the request body. Otherwise it will result in a 200 OK but without changes being made to the data.

Routes

Based on the previousdb.json file, here are all the default routes. You can also addother routes using--routes.

Plural routes

GET    /postsGET    /posts/1POST   /postsPUT    /posts/1PATCH  /posts/1DELETE /posts/1

Singular routes

GET    /profilePOST   /profilePUT    /profilePATCH  /profile

Filter

Use. to access deep properties

GET /posts?title=json-server&author=typicodeGET /posts?id=1&id=2GET /comments?author.name=typicode

Paginate

Use_page and optionally_limit to paginate returned data.

In theLink header you'll getfirst,prev,next andlast links.

GET /posts?_page=7GET /posts?_page=7&_limit=20

10 items are returned by default

Sort

Add_sort and_order (ascending order by default)

GET /posts?_sort=views&_order=ascGET /posts/1/comments?_sort=votes&_order=asc

For multiple fields, use the following format:

GET /posts?_sort=user,views&_order=desc,asc

Slice

Add_start and_end or_limit (anX-Total-Count header is included in the response)

GET /posts?_start=20&_end=30GET /posts/1/comments?_start=20&_end=30GET /posts/1/comments?_start=20&_limit=10

Works exactly asArray.slice (i.e._start is inclusive and_end exclusive)

Operators

Add_gte or_lte for getting a range

GET /posts?views_gte=10&views_lte=20

Add_ne to exclude a value

GET /posts?id_ne=1

Add_like to filter (RegExp supported)

GET /posts?title_like=server

Full-text search

Addq

GET /posts?q=internet

Relationships

To include children resources, add_embed

GET /posts?_embed=commentsGET /posts/1?_embed=comments

To include parent resource, add_expand

GET /comments?_expand=postGET /comments/1?_expand=post

To get or create nested resources (by default one level,add custom routes for more)

GET  /posts/1/commentsPOST /posts/1/comments

Database

GET /db

Homepage

Returns default index file or serves./public directory

GET /

Extras

Static file server

You can use JSON Server to serve your HTML, JS and CSS, simply create a./public directoryor use--static to set a different static files directory.

mkdir publicecho'hello world'> public/index.htmljson-server db.json
json-server db.json --static ./some-other-dir

Alternative port

You can start JSON Server on other ports with the--port flag:

$ json-server --watch db.json --port 3004

Access from anywhere

You can access your fake API from anywhere using CORS and JSONP.

Remote schema

You can load remote schemas.

$ json-server http://example.com/file.json$ json-server http://jsonplaceholder.typicode.com/db

Generate random data

Using JS instead of a JSON file, you can create data programmatically.

// index.jsmodule.exports=()=>{constdata={users:[]}// Create 1000 usersfor(leti=0;i<1000;i++){data.users.push({id:i,name:`user${i}`})}returndata}
$ json-server index.js

Tip use modules likeFaker,Casual,Chance orJSON Schema Faker.

HTTPS

There's many way to set up SSL in development. One simple way though is to usehotel.

Add custom routes

Create aroutes.json file. Pay attention to start every route with/.

{"/api/*":"/$1","/:resource/:id/show":"/:resource/:id","/posts/:category":"/posts?category=:category","/articles\\?id=:id":"/posts/:id"}

Start JSON Server with--routes option.

json-server db.json --routes routes.json

Now you can access resources using additional routes.

/api/posts# → /posts/api/posts/1# → /posts/1/posts/1/show# → /posts/1/posts/javascript# → /posts?category=javascript/articles?id=1# → /posts/1

Add middlewares

You can add your middlewares from the CLI using--middlewares option:

// hello.jsmodule.exports=(req,res,next)=>{res.header('X-Hello','World')next()}
json-server db.json --middlewares ./hello.jsjson-server db.json --middlewares ./first.js ./second.js

CLI usage

json-server [options] <source>Options:  --config, -c       Path to config file           [default: "json-server.json"]  --port, -p         Set port                                    [default: 3000]  --host, -H         Set host                             [default: "localhost"]  --watch, -w        Watch file(s)                                     [boolean]  --routes, -r       Path to routes file  --middlewares, -m  Paths to middleware files                           [array]  --static, -s       Set static files directory  --read-only, --ro  Allow only GET requests                           [boolean]  --no-cors, --nc    Disable Cross-Origin Resource Sharing             [boolean]  --no-gzip, --ng    Disable GZIP Content-Encoding                     [boolean]  --snapshots, -S    Set snapshots directory                      [default: "."]  --delay, -d        Add delay to responses (ms)  --id, -i           Set database id property (e.g. _id)         [default: "id"]  --foreignKeySuffix, --fks  Set foreign key suffix, (e.g. _id as in post_id)                                                                 [default: "Id"]  --quiet, -q        Suppress log messages from output                 [boolean]  --help, -h         Show help                                         [boolean]  --version, -v      Show version number                               [boolean]Examples:  json-server db.json  json-server file.js  json-server http://example.com/db.jsonhttps://github.com/typicode/json-server

You can also set options in ajson-server.json configuration file.

{"port":3000}

Module

If you need to add authentication, validation, orany behavior, you can use the project as a module in combination with other Express middlewares.

Simple example

$ npm install json-server --save-dev
// server.jsconstjsonServer=require('json-server')constserver=jsonServer.create()constrouter=jsonServer.router('db.json')constmiddlewares=jsonServer.defaults()server.use(middlewares)server.use(router)server.listen(3000,()=>{console.log('JSON Server is running')})
$ node server.js

The path you provide to thejsonServer.router function is relative to the directory from where you launch your node process. If you run the above code from another directory, it’s better to use an absolute path:

constpath=require('path')constrouter=jsonServer.router(path.join(__dirname,'db.json'))

For an in-memory database, simply pass an object tojsonServer.router().

Please note also thatjsonServer.router() can be used in existing Express projects.

Custom routes example

Let's say you want a route that echoes query parameters and another one that set a timestamp on every resource created.

constjsonServer=require('json-server')constserver=jsonServer.create()constrouter=jsonServer.router('db.json')constmiddlewares=jsonServer.defaults()// Set default middlewares (logger, static, cors and no-cache)server.use(middlewares)// Add custom routes before JSON Server routerserver.get('/echo',(req,res)=>{res.jsonp(req.query)})// To handle POST, PUT and PATCH you need to use a body-parser// You can use the one used by JSON Serverserver.use(jsonServer.bodyParser)server.use((req,res,next)=>{if(req.method==='POST'){req.body.createdAt=Date.now()}// Continue to JSON Server routernext()})// Use default routerserver.use(router)server.listen(3000,()=>{console.log('JSON Server is running')})

Access control example

constjsonServer=require('json-server')constserver=jsonServer.create()constrouter=jsonServer.router('db.json')constmiddlewares=jsonServer.defaults()server.use(middlewares)server.use((req,res,next)=>{if(isAuthorized(req)){// add your authorization logic herenext()// continue to JSON Server router}else{res.sendStatus(401)}})server.use(router)server.listen(3000,()=>{console.log('JSON Server is running')})

Custom output example

To modify responses, overwriterouter.render method:

// In this example, returned resources will be wrapped in a body propertyrouter.render=(req,res)=>{res.jsonp({body:res.locals.data})}

You can set your own status code for the response:

// In this example we simulate a server side error responserouter.render=(req,res)=>{res.status(500).jsonp({error:"error message here"})}

Rewriter example

To add rewrite rules, usejsonServer.rewriter():

// Add this before server.use(router)server.use(jsonServer.rewriter({'/api/*':'/$1','/blog/:resource/:id/show':'/:resource/:id'}))

Mounting JSON Server on another endpoint example

Alternatively, you can also mount the router on/api.

server.use('/api',router)

API

jsonServer.create()

Returns an Express server.

jsonServer.defaults([options])

Returns middlewares used by JSON Server.

  • options
    • static path to static files
    • logger enable logger middleware (default: true)
    • bodyParser enable body-parser middleware (default: true)
    • noCors disable CORS (default: false)
    • readOnly accept only GET requests (default: false)

jsonServer.router([path|object])

Returns JSON Server router.

Deployment

You can deploy JSON Server. For example,JSONPlaceholder is an online fake API powered by JSON Server and running on Heroku.

Links

Video

Articles

Third-party tools

License

MIT

Patreon -Supporters ✨

About

Get a full fake REST API with zero coding in less than 30 seconds (seriously)

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript97.7%
  • HTML1.2%
  • CSS1.1%
[8]ページ先頭
©2009-2025 Movatter.jp