Блог

У меня есть node.js (экспресс) прослушивание приложений на локальном хостинге: 4000/api

Я работаю над клиентом на базе vuejs с маршрутизатором следующим образом,

 const routes = [
{   
  path: '/customers',
  name: 'customers',
  component: Customers,
},  
{ 
  path: '/customers/:customer_id',
  name: 'customer_details',
  component: CustomerDetails,
},
]
  

Я управляю путем к серверу через vue.config.js файл как,

 const path = require('path');
module.exports = {
  devServer: {
      proxy: {
        '/api': {
            target: 'http://localhost:4000'
         }
      }
  }
}
  

Я также использую state mgmt через объект / функциональность хранилища следующим образом,

 const BASE_URL = 'api/'
fetchCustomers(context) {
   const server_url = BASE_URL   '/customers'
   axios.get(server_url) 
   ...
}
  

Это работает нормально, но

  fetchCustomer(context, id) {
   const server_url = BASE_URL   '/customers/'   id
   axios.get(server_url) 
   ...
}
  

Этот сбой с ошибкой 404. Когда я проверил на сервере, я вижу, что клиент выполняет вызов,

 /customers/api//customers/5c891995e5212d439459ff28
  

вместо

 /api//customers/5c891995e5212d439459ff28
  

И на стороне клиента у меня есть ссылка на маршрутизатор следующим образом,

 <router-link :to="{'name':'customer_details',
  params: {'customer_id': cid }}></router-link>
  

Когда я нажимаю на эту ссылку, я вижу следующее в консоли,

ПОЛУЧИТЬ http://localhost:8080/customers/api//customers/5c891995e5212d439459ff28 404 (не найден)

Если я удалю vue.config.js и поместите BASE_URL с полным путем как ‘http://localhost:4000/api ‘, тогда я не вижу этой ошибки. Должно быть, очень маленькая ошибка, но я ее не вижу. Любая помощь приветствуется.