在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問(wèn)答/HTML/ react腳手架搭建的項(xiàng)目，在請(qǐng)求后端接口的時(shí)候，如何自動(dòng)匹配生產(chǎn)環(huán)境和線上測(cè)試

react腳手架搭建的項(xiàng)目，在請(qǐng)求后端接口的時(shí)候，如何自動(dòng)匹配生產(chǎn)環(huán)境和線上測(cè)試環(huán)境的后端接口host地址

問(wèn)題描述

react腳手架搭建的項(xiàng)目，
在請(qǐng)求后端接口的時(shí)候，url = host/接口名
每次在生產(chǎn)環(huán)境和線上測(cè)試環(huán)境切換的時(shí)候（需改代碼在測(cè)試環(huán)境與線上正式環(huán)境版本升級(jí)），都需要手動(dòng)去修改后端接口host的地址，
現(xiàn)在想讓生產(chǎn)環(huán)境和線上測(cè)試環(huán)境來(lái)自動(dòng)識(shí)別host的地址，要如何配置？
因?yàn)樯暇€都是執(zhí)行的npm run build這個(gè)命令。

回答
編輯回答
離夢(mèng)

寫(xiě)個(gè)runtime吧

2018年2月24日 18:56
編輯回答
夏木

在webpack中通過(guò)DefinePlugin定義一個(gè)常量。
然后通過(guò)process.env.NODE_ENV來(lái)給這個(gè)常量賦值.
webpack.config.js

const requestHost= process.env.NODE_ENV === 'development' ? '生產(chǎn)ip' : '開(kāi)發(fā)ip';

new webpack.DefinePlugin({
    requestHost
});

然后你在組件中直接獲取這個(gè)requestHost就可以了。

const url = `${requestHost}/api`;
fetch(url);
2017年1月5日 01:47
編輯回答
薄荷綠

根據(jù)不同的環(huán)境在 html 中注入配置信息

window.__config = {
    host: ''
};


const host = window.__config.host;
request(`${host}/api`);
2018年5月24日 13:21