Vueのフロントエンドとバックエンドのポートの不一致の問題を解決する

Vueのフロントエンドとバックエンドのポートの不一致の問題を解決する

Vue のフロントエンドとバックエンドのポートが一致していません

config index.jsファイル内

次のコードをインポートするだけです

プロキシテーブル: {
'/api': {
target: 'http://localhost:3000', //アクセスするバックエンドインターフェース changeOrigin: true,
パス書き換え: {
'^/api': '/'
//ここでの設定は正規表現です。/apiで始まるものは'/api'に置き換えられます。バックエンドドキュメントのインターフェースが/api/list/xxxの場合
//フロントエンド API インターフェースは axios.get('/api/list/xxx') と記述され、処理後の実際のアクセスは http://news.baidu.com/api/list/xxx になります。
}
}},

Vueサーバーの起動ポート番号が毎回異なる

昨日、友人から渡されたプロジェクトを自分のコンピューターで実行しました。友人は vue3.0 を使用していましたが、私は vue2.5.2 を使用していたため、プロジェクトの実行時にエラー メッセージが表示されました。バージョンの問題かもしれません。エラー メッセージに従ってプラグインをダウンロードしたところ、プロジェクトは動作しました。しかし、それ以来、プロジェクトを実行するたびに、ポート番号が異なることがわかりました。

解決:

まず、npm install [email protected]をダウンロードします。

依存関係を再インストールする npm install

プロジェクトを再起動します npm run dev

上記は私の個人的な経験です。参考になれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。

以下もご興味があるかもしれません:
  • Vue のフロントエンドとバックエンドに異なるポートを実装する方法
  • Vue でプロキシを使用して異なるポートと IP インターフェースを構成する問題を解決する
  • vue+springboot フロントエンドとバックエンド分離プロジェクトにおけるクロスドメイン問題に対するソリューションの分析
  • VUEプロジェクトのローカルホストポートサーバーが接続を拒否し、127.0.0.1しか使用できない問題を解決します
  • VueとNginxをベースにしたフロントエンドとバックエンドのデプロイメントチュートリアルの詳細な説明

<<:  VMwareがLinuxシステムをインストールして起動した後に黒い画面が表示される問題を解決する

>>:  重複したMySQLテーブルをマージして削除する簡単な方法

推薦する

HBuilderX で Tomcat 外部サーバーを設定して、JSP インターフェイスを表示および編集する方法の詳細な説明

1. 最初の方法は、ローカルのTomcatを起動してJSPを表示することです。 tomcatのweb...

Linux で rpm パッケージを見つけるために CD をマウントする方法

前面に書かれたLinux を使用する際にソフトウェアをインストールする必要がある場合があります。もち...

Nginx ローカル ディレクトリ マッピング実装コード例

他のデバイスの画像をローカルディレクトリにマウントするなど、サーバー上の静的リソースにアクセスする必...

虫眼鏡の詳細のJavaScript実装

目次1. レンダリング2. 実施原則3. まとめ1. レンダリング 2. 実施原則幅と高さが等しい拡...

CSS の Flex レイアウトを使用してシンプルな縦棒グラフを作成する方法

以下は、Flex レイアウトを使用した棒グラフです。 HTML: <div class=&qu...

Windows での MySQL スケジュールバックアップ スクリプトの実装

Windows サーバーでデータベース データを定期的にバックアップする場合は、Windows タス...

MySQL 8.0.18 のインストールと設定方法のグラフィックチュートリアル

この記事は、参考のためにMySQL 8.0.18のインストールと設定のグラフィックチュートリアルを記...

Tomcat Nginx Redis セッション共有プロセス図

1. 準備ミドルウェア: Tomcat、Redis、Nginx Jar パッケージ: commons...

W3Cチュートリアル(1):W3Cを理解する

1994 年に設立された組織である W3C は、共通プロトコルの開発を促進し、それらの相互運用性を確...

Vue の高度なコンポーネント機能コンポーネントの使用シナリオとソースコード分析

目次導入使用シナリオソースコード分析要約する導入Vue は、コンポーネントをステートレスかつインスタ...

Remレイアウトを使用して適応性を実現する

以前、モバイル適応に関する記事を書きました。非常に長く、内容が多すぎて読みづらいものでした。そこで、...

mysql-joinsの具体的な使用方法

目次結合構文: 1. InnerJOIN: (内部結合) 2. LeftJOIN: (左結合) 3....

nginxワーカープロセスループの実装

ワーカープロセスは、起動されると、まず自身の動作に必要な環境を初期化し、次に実行する必要があるイベン...

CentOS での Docker の詳細なインストール チュートリアル

DockerにはCEとEEがあり、CE版はコミュニティ版(無料)、EE版はセキュリティを重視したエン...

Linux チェックアップ、Linux の状態 (ネットワーク IO、ディスク、CPU、メモリ) を把握

目次1. コアコマンド2. 共通コマンド3. コアコマンドの詳細な説明3.1、ps補助3.2 トップ...