Help us understand the problem. What is going on with this article?

ローカルネットワークからjson-serverにアクセスする

1 はじめに

json-serverを以下のようにデフォルトで立ち上げるとローカルホストのみ通信できる状態になる。
json-server db.json

ローカルネットーワーク内にjson-serverを立ち上げ、立ち上げているPCとは別の端末からアクセスしたい場合は、以下2点を設定する必要がある。
・ホスト名の指定
・ファイアーウォールの通過設定

2 ホスト名の指定

ホスト名を指定する場合は、以下のオプションをつける。このオプションを付けないとローカルホストで立ち上がってしまい、外部からアクセスできない。
--host <IPアドレス or ドメイン名>
ドメイン名の場合は、合わせてDNSサーバーにドメイン名を登録しておく。これにより、ローカルネットワーク内の端末からサーバーを見つけられるようになる。

3 ファイアーウォールの通過設定

まず、デフォルトではポート番号が3000となっているが、任意のポートに指定したい場合は以下のオプションをつける。
--p <port番号>

そのポートで通信できるようにファイアーウォールの受信規則に上記ポートを受信できるようにする。ファイヤーウォールに上記ポートを通過設定しておかないと、サーバーが立ち上がっていても、外部からの通信をファイヤーウォールが遮断してしまうため外部からアクセスできない。

4 Node.jsで動かす場合

Node.jsで動かす場合は、以下のようにポートとIPアドレス or ドメイン名を指定する。

server.listen(<port>, '<IPアドレス or ドメイン名>');

server.js
const jsonServer = require('json-server');
const server = jsonServer.create();
const router = jsonServer.router('db.json');
const middlewares = jsonServer.defaults();

server.use(middlewares);
server.use(router);

server.listen(80, '192.168.11.20', () => {
  console.log('run');
});

4 結果

以下のような環境で実行した結果を示す。結果の通り、ローカルネットーワーク内のjson-serverに対し、json-serverを立ち上げているPCとは別の端末からアクセスできた。
MacPC(clinet)---router--WindowsPC(json-server)

・WindowsPCがjson-serverを立ち上げた結果
json-server1.png

・MacPC(clinet)がサーバへリクエストした結果

スクリーンショット 2019-04-13 14.21.00.png

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした