JavascriptでAPI呼び出しをシミュレートする

Question

APIコールをシミュレートします。私はVueJSにアプリケーションを書いています。私が作成したハードコードされたJSONファイルからデータを取得しています。私App.vueから例えば

、：

<template> 
    <p>{{ teams.yankees.city }}</p> // Will output "New York" 
</template> 

<script> 
    import teams from './teams.json' 

    export default { 
    data() { 
     return { teams } 
    } 
    } 
</script> 

私teams.jsonファイルから：

{ 
    "yankees": [ 
    { "city": "New York", "established": 1901, "worldSeries": 27 } 
    ] 
    ... 
} 

私は今のように成功私の地元のJSONファイルから自分のデータを取得することができます - しかし、どのように代わりに私はでき"関数スタブ"を使用してデータを取得すると、将来本当の安らかなAPI呼び出しでスワップできるようになりますか？

どこかで、自分のローカルJSONファイルを呼び出すモックレストサービスを設定する方法を示しているベアボーンリソースがありますか？

Answer 1

mockデータとしてjsonファイルを使用する場合は、単純なhttpサーバー以外は必要ありません。 teams.jsonファイルをプロジェクトディレクトリのどこかに置き、任意のhttpサーバ（たとえば、simple, zero-configuration command-line http server）を使用して提供します。

はその後Vue resourceプラグインを使用して、あなたの嘲笑のデータにアクセス：

{ 
    this.$http.get('http://localhost:8080/teams.json').then((response) => { 
    // success callback 
    }, (response) => { 
    // error callback 
    }); 
} 

私はあなたのサービスコールにURLをハードコーディングする必要はありませんね。私は私のビジネスのコードを変更することなく、異なるリソースの場所を切り替えることができます

{ 
    teams: 'http://localhost:8080/teams.json' 
} 

この方法：私は何をしたいと、私は、リソース名を定義し、具体的なパスにマッピングマッピングファイルを持つことです。

さらに洗練されたものが必要な場合は、自分で構築するか、既存のサービスをチェックすることができます（mockable.ioまたはapiary.ioなど）。