Heim > Web-Frontend > js-Tutorial > Hauptteil

So wählen Sie Baseurl in vue.js aus

亚连
Freigeben: 2018-06-04 10:48:55
Original
3352 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die Methode zur Auswahl von Baseurl in vue.js entsprechend der Code-Ausführungsumgebung vorgestellt. Jetzt teile ich sie mit Ihnen und gebe Ihnen eine Referenz.

Durch die Konfiguration eines gemeinsamen API-Präfixes können Daten besser lokal über die Schnittstellen-Proxy-Weiterleitung abgerufen oder während der Bereitstellung ein Reverse-Proxy in Nginx durchgeführt werden. Sobald das Projekt jedoch eine große Anzahl von Teilen umfasst, die einen Datei-Upload erfordern (der Datei-Upload ist möglich). Nicht (nehmen Sie die Ajax-Methode), wir müssen die Basis-URL der Ajax-Anforderungen im Projekt berücksichtigen. Der ursprüngliche Code lautet wie folgt

Vor der Änderung

// 创建axios实例、配置baseURL、超时时间
const service = axios.create({
 baseURL: '/development/api', // 从环境进程中根据运行环境获取的api的base_url
 timeout: 5000         // 请求超时时间
})
Nach dem Login kopieren
rrree

Optimierungsmethode

Suchen Sie config/dev.env.js und config/prod.env.js und fügen Sie die Variable API_BASEURL (Namensanpassung) wie folgt im Code hinzu:

/* 保存分配角色 */
export function fetchSaveDisUser (params1) {
 return fetch({
  url: '/user/empower',
  method: 'post',
  params: params1,
  paramsSerializer: function (params) {
   return Qs.stringify(params, { arrayFormat: 'repeat' })
  }
 })
}

/* 上传文件URL 从运行环境process.env中读取API配置 */
export let uploadUrl = '/development/api/doi/analys/upload'
Nach dem Login kopieren

Ersetzen Sie dann baseURL dort, wo Sie es verwenden müssen. API_BASEURL

Der geänderte Code lautet wie folgt

module.exports = {
 NODE_ENV: '"production"', // PS:不要复制、开发环境和生产环境有区别
 API_BASEURL: '"/development/api/"' // 需要自己添加的代码
}
Nach dem Login kopieren
rrree

Das Obige ist das, was ich für alle zusammengestellt habe an alle in der Zukunft.

Verwandte Artikel:

Erklären Sie ausführlich, wie Sie dies in React-Komponenten verwenden.

So verwenden Sie TypeScript-Methoden in Vue-Komponenten (ausführliches Tutorial)

Implementieren Sie eine Einwegbindung im übergebenden Objekt der Vue-Komponente um es zu tun?

Das obige ist der detaillierte Inhalt vonSo wählen Sie Baseurl in vue.js aus. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!