vue webpack development method to access the global configuration of background interface

In actual development, after using vue, the front and back ends are sent separately. At this time, we need to access the interface in the background to get the data. We need URL, name, password to obtain the token to use the interface normally. Let’s configure it below.

1、Find the config folder and add some code to it (if there is no JS, just create one by yourself)

'use strict'
 = {
 NODE_ENV: '"production"',
 API_ROOT: '"//123.116.245.150:18081/api"',/*j backend interface address*/
 USER_NAME: '""',/*account*/
 PASS_WD: '""'/*password*/
 
}

2、Find the config folder and add the following code in it.

'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./')
 
 = merge(prodEnv, {
 API_ROOT: '"//125.116.245.101:18081/api"',/*Backend interface address*/
 USER_NAME: '"Little Little"',/*account*/
 PASS_WD: '"123456"',/*password*/
 
})

Then, call the variable written here in the login page from from

 form: {
   name: .USER_NAME,
   password: .PASS_WD,
  
  },

Set the head interceptor, the code is as follows

const url = .API_ROOT;
 (
  config =&gt; {
  let token = ("x-auth-token");
  if (token) { // Determine whether token exists. If it exists, add tokens for each http header    = `${token}`;
  }
 
  if ((url) === -1) {
   let getTimestamp=new Date().getTime();
   if(('?')&gt;-1){
    = url +  +"&amp;timestamp="+getTimestamp;
   }else{
    = url + +"?timestamp="+getTimestamp;
   }
  
  }
  return config;
  },
  err =&gt; {
  alert(err)
  return (err);
  });

This way, accessing the backend interface configuration is completed!

The above method of accessing the global configuration of the background interface for vue webpack development is all the content I share with you. I hope you can give you a reference and I hope you can support me more.