Vue設定動的要求アドレスの例

需要：開発と生産環境の下で、異なる住所（http or ws）を要求して、オンライン環境に置かせます。どんなドメイン名でも手動で住所を変更しなくてもいいです。
アイデア：フロントエンド要求インターフェースのアドレスを簡単にする
上のコード：vuexに全体のインターフェースアドレスを設定し、生産と開発環境下で異なる住所を配置する。

export const configUrl = {
 url: process.env.API_HOST,
 ws: process.env.API_WS
}

そしてconfigフォルダにdev.env.jsとprod.env.jsを設定します。

module.exports = merge(prodEnv, {
 NODE_ENV: '"development"',
 API_HOST: '"/urlProxy/"', //           
 API_WS: '"ws://192.168.0.57:8081/api/websocket"'
})

prod.env.js:

'use strict'
module.exports = {
 NODE_ENV: '"production"',
 API_HOST:'"/api/"', //         ， ：www.baidu.com/api/
 API_WS: '"/api/websocket"' // wss://www.baidu.com/api/websocket
}

WSSの住所構成が違っています。単独で処理しなければなりません。

let url = new URL(this.url, window.location.href)
url.protocol = url.protocol.replace('https', 'wss')

取り替えてもいいです
以上のこのvueは動的に住所を要求する例を設定しました。小編集が皆さんに提供した内容は全部分かりました。参考にしてもらいたいです。よろしくお願いします。