Vue-cliプロジェクトによるドメイン間問題の解決


前後端分離開発は現在のWeb開発のトレンドの一つであるが,前後端分離開発も従来のプロジェクトとは異なる問題を開発にもたらした.フロントエンドプロジェクトとバックエンドプロジェクトは、フロントエンドの分離開発において、異なるサービスに導入する必要があるため、ブラウザの同源ポリシーの制限に基づいて、フロントエンドのJavaScriptスクリプトからの非同期要求は、バックエンドのインタフェースと対話できない.これが、フロントエンドの分離におけるドメイン間問題である.
Vueプロジェクトでドメイン間問題を解決したい場合は、vueに直接アクセスできます.config.jsプロファイルでプロジェクトのプロキシパスを構成することで、Vueプロジェクトのドメイン間プロキシの問題を解決できます.
  • vue.config.js
  • module.exports = {
         
        devServer:{
         
            port:9090, //     
            open:true,  //            
            proxy: 'http://127.0.0.1:8080' //    ,                    ,        
        }
    }
    

    【備考】vue.config.jsファイルはプロジェクトディレクトリの下に置いて、srcディレクトリ、node_とmodulesディレクトリは同級です.