Vue を使用してプロキシプロキシを実装する方法-jsチュートリアル-php.cn

Vue を使用してプロキシプロキシを実装する方法

php中世界最好的语言

リリース： 2018-06-02 14:48:00

オリジナル

1888 人が閲覧しました

今回は、Vue を使用してプロキシを実装する方法と、Vue を使用してプロキシを実装する際の注意事項について説明します。以下は実際的なケースです。

// config/index.js 文件
proxyTable: {
   '/api': {
    target: 'http://192.168.149.90:8080/', // 设置你调用的接口域名和端口号
    changeOrigin: true,   // 跨域
    pathRewrite: {
     '^/api': '/'     
    }
   }
  },

ログイン後にコピー

これは、ターゲット内のアドレスを置き換えるために「/api」を使用するものとして理解されます。たとえば、「http:」を呼び出したい場合、インターフェースを削除するときに API を直接使用します。 //192.168.149.90:8080/xxx/duty?

time =2017-07-07 14:57:22'、直接書くと '/api/xxx/duty?time=2017-07-07 14:57:22 ' dev.env.js 環境で開発を設定するにはリクエストアドレス

// config/dev.env.js 文件
module.exports = merge(prodEnv, {
 NODE_ENV: '"development"',
 ADMIN_SERVER: '"/api/"',
});

ログイン後にコピー

プラグインの axios をリクエストする場合、設定は次のようになります

const adminServer = axios.create({
 baseURL: process.env.ADMIN_SERVER,
});

ログイン後にコピー

この記事の事例を読んで、方法をマスターしたと思います。さらに興味深い情報については、PHP 中国語 Web サイトの他の関連記事にご注目ください。

推奨書籍:

vue ソースコードを使用してイベントメカニズムを解析する方法

JS を操作してユーザーの都市と地理的位置を取得する方法

以上がVue を使用してプロキシプロキシを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

Vue を使用してプロキシ プロキシを実装する方法

Vue を使用してプロキシプロキシを実装する方法