VUE + 1 VUEルータ+ vuex +元素UI + axios、バックエンドコンポーネント：春ブート+ MyBatisの最近のプロジェクトは、完全に別個の前部構造の後端部は、フロントエンドコンポーネントを使用します。これは、別の配備、配備フロントエンドは、直接そのような高性能nginxのWebサーバーとして使用できる1つの完全に独立することができ前後端の配置の都合のバックエンド・レベルの拡張を検討するために行われます。
フロントエンド、バックエンドサーバーはそれをデータへのアクセスをアクセスするためのIPアドレスを知っている必要がありますが、その場合は、フロントエンドのコードにハードコードされたIPアドレスを展開するときに、問題があるでしょう：サーバーのIPアドレスの変更は、再パッケージ化され、解放されなければならない場合には（異なる環境は、テストを開発し、生産ラインは、特定の環境のために包装される必要があります）。
相対パス
プロジェクトの後端のコンテキストパスは、「/」、リソース使用率を考慮の外に、プロジェクトの早い段階で（小規模）前端と後端は同じ組み込みのTomcatコンテナに配備することができますされている場合は（春ブートフレームワークは、静的なページをサポートしています） 。次のようにこの場合、Ajaxのフロントエンド・プロジェクトにおける要求相対パスを使用することができます。
var url = "/api/v1/data"
$.get(url, function(data){
alert("Data Loaded: " + data);
});この時点では、Ajaxの相対パスの前に自動的にHTTPを追加：//ホスト：ポート、およびコンテキスト・パスは「/」で、最終的なAPIリクエストへのパスは次のとおりですhttp://host:port/ + 相对路径。このとき、フロントエンドは、コードアドレスと後端のポートハードコードされないであろう、それはこの使用は、2つの条件が満たされなければならないられていることに留意されたい：
（1）前面および背面端部が同じ容器に配備されなければならない
（2）コンテキストパスバックエンドでなければなりません"/"
絶対パス
プロジェクトが進行するにつれ、前部および後部端部は、次いでAjaxリクエストの前にホストアドレスが異なるため、ある（相対パスで使用することができない、完全に独立した前端と後端の展開を検討する必要がある（クラスタ）の両方の水平拡張をサポートしますクロスドメイン）へのアクセスバックエンドAPIのみ、絶対パスを使用することができますが、唯一のようなバックエンドハードコーディングされたアドレスとポート（アクセスすることができます：ポート/ API / XXX：HTTP：//ホスト）。この厄介な状況に対処するには、あまりにも長い間、ドメイン名の変更として、アクセスアドレスの先端が変化しない、バックエンドサービスにアクセスするためのドメイン名を使用する方法を検討してください。