//tips
//webapi理解
Webapiを使用する上でapiのバージョン変更が行われることも想定しておくべきで、その際には強制アップデートの仕組み(アプリを開くとアプリストアに遷移し、アップロードするような警告)を導入する必要がある。
Webapiのセキュリティの面でも注意が必要で、例えば電話番号から知り合いを検索するapiを悪用され、４６０万人分の電話番号を含むユーザー情報がネット上に公開されてしまう事態などをsnapchatは招いている。
httpはそれ自体暗号化の仕様を持たないので喫茶店などで多数の人と同じwifiに接続してしまうとパケットスニッフィングツールを入れることで、他人のhttpのデータの中身が丸見えとなる。そうでなくても、セッションID などのサーバ側でユーザを特定する情報が表示される場合があり、それにより乗っ取られることも想定できる。
この問題はhttpsというTLSによる暗号化を行うことで現在は改善されている。httpsでは通信内容だけではなくセッションIDなども暗号化してくれるため幅広い範囲での安全を確保している。
ただ、必ずしも全てもの問題が解決されたわけではなく喫茶店などのwifiを使用する場合に、クライアントとサーバの間に入り仲介することで情報を抜く方法もあり、まだ警戒すべき点は残っている。
webapiではcontent-typeををjsonではなくhtmlとブラウザに判断されてしまうとそこから個人情報を抜かれる可能性があるので、content-typeをapplication/jsonとし、さらにx-content-type-options:nosiniffとすることでブラウザのcontent siniffing機能も発動させず、対応できるようになる。
また、ページのIMG要素を用いて攻撃用のコードを埋め込むような手法がよく見られるので、サーバ側のデータが変化する場合の変更はGETではなく、POST,PUTなどで実行する。
一般的には、他のサイトに誘導する攻撃コードへの対応はXSRFトークンと呼ばれる、サイトが発行するワンタイムトークンでこのコードがない場合はアクセスを拒否するという対応方法がとられているよう。クライアントに特別なリクエストヘッダをつけてもらい、それでサーバへのアクセスを判断するという手法もある。
セキュリティの部分はかなり技術的な知識が入りそう。
一般的なアクセス集中などの問題に対してはユーザーごとのアクセス数制限により対応できる。
さて、一旦WEB API本は読了したのでJson erverを用いてwebapiのモックアップ(雛形api)を作成していく。
実験のためにサーバーを自分で立てるのは手間なので何かいい方法はないかと探していたらjson serverが実験用のapiを作成するのに適しているという記事を見つけたのでそれらを参照しながら実施していく。
https://qiita.com/ykhirao/items/a41322085ab55837b88e
https://qiita.com/futoase/items/2859a60c8b240da70572
https://blog.codecamp.jp/json-server-beginner
https://www.codegrid.net/articles/2017-json-server-1/
https://www.to-r.net/media/json-server/
https://qiita.com/tamitami/items/f9329bb51c9b76509c10
初っ端からNpmが読み込まれない。Windowsのコマンドを参考にしていたのでmac用の対応方法を探した。
まずはソフトウエアや拡張機能のインストールのパッケージマネージャであるhomebrewを再度インストール。インストール方法は下記参照。
https://qiita.com/zaburo/items/29fe23c1ceb6056109fd
brew -vのコマンドを実行すると下記のものをインストールしたとのこと。
Homebrew 3.1.8
Homebrew/homebrew-core (git revision 6d7848a23c; last commit 2021-05-22)
そこからさらにbrew install nodebrewを実行。
nodebrewをインストールして、Node.jsをインストールそしてjsonserverの使用につなげていく流れ。
nodebrew use stable
use v16.2.0
この後でやっとnpm initを実行できるようになる。
対話型で色々と聞かれたが後で編集できるようなので全てEnterで完了させた。
そうするとpackage.jsonが作成されていた。
{
"name": "jsontry",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
ここで再度npm install --save-dev json-serverを実行すると
added 178 packages, and audited 179 packages in 11s
13 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
npm notice
npm notice New minor version of npm available! 7.13.0 -> 7.14.0
npm notice Changelog: https://github.com/npm/cli/releases/tag/v7.14.0
npm notice Run npm install -g npm@7.14.0 to update!
npm notice
などと表示されたので作成できたよう。
別途jsonファイルを作成して読み込ませてみる。
メモ帳からjsonファイルを作れなかったのでオンラインのjsoneditorを利用した。
https://jsoneditoronline.org/#left=local.hizuho
Jsonserverがないと警告が出たのでnpm install -g json-serverを実行。
そしてjson-server db.jsonを実行すると、
\{^_^}/ hi!
Loading db.json
Oops, db.json doesn't seem to exist
Creating db.json with some default data
Done
Resources
http://localhost:3000/posts
http://localhost:3000/comments
http://localhost:3000/profile
Home
http://localhost:3000
と出てきたのでdbの保存先が悪く存在していないと出てきているよう。
一旦終了し、再度下記部分からリスタート。
https://qiita.com/limonene/items/a10c2755dd2784357c43
https://qiita.com/futoase/items/2859a60c8b240da70572
json-server db.jsonを実行すると今度は下記のエラー。
json-server db.json
\{^_^}/ hi!
Loading db.json
Done
Error: Type of "limit" (number) is not supported. Use objects or arrays of objects.
limit部分で問題が生じているようなので削除。
json-server db.json
\{^_^}/ hi!
Loading db.json
Done
Resources
http://localhost:3000/users
Home
http://localhost:3000
Jsonserverでの読み込みに無事に成功したよう。
