Home Web Front-end JS Tutorial How to use Vue to implement proxy proxy

How to use Vue to implement proxy proxy

Jun 02, 2018 pm 02:48 PM
proxy acting accomplish

This time I will show you how to use Vue to implement proxy proxy, and what are the precautions for using Vue to implement proxy proxy. The following is a practical case, let's take a look.

// config/index.js 文件
proxyTable: {
   '/api': {
    target: 'http://192.168.149.90:8080/', // 设置你调用的接口域名和端口号
    changeOrigin: true,   // 跨域
    pathRewrite: {
     '^/api': '/'     
    }
   }
  },
Copy after login
This is understood as using '/api' to replace the address in the target. In the later components, when we drop the interface, we directly use api to replace it. For example, I want to call 'http://192.168.149.90:8080/xxx/duty ?

time=2017-07-07 14:57:22', just write '/api/xxx/duty?time=2017-07-07 14:57:22'

In dev.env.js

Configure the development environmentRequest address

// config/dev.env.js 文件
module.exports = merge(prodEnv, {
 NODE_ENV: '"development"',
 ADMIN_SERVER: '"/api/"',
});
Copy after login
If you request axios for the plug-in, configure it as follows

const adminServer = axios.create({
 baseURL: process.env.ADMIN_SERVER,
});
Copy after login
I believe you have read the case in this article After mastering the method, please pay attention to other related articles on the php Chinese website for more exciting content!

Recommended reading:

How to use vue source code to parse the event mechanism

How to operate JS to obtain the city and geographical location of the user

The above is the detailed content of How to use Vue to implement proxy proxy. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot Article Tags

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How to implement dual WeChat login on Huawei mobile phones? How to implement dual WeChat login on Huawei mobile phones? Mar 24, 2024 am 11:27 AM

How to implement dual WeChat login on Huawei mobile phones?

How to implement the WeChat clone function on Huawei mobile phones How to implement the WeChat clone function on Huawei mobile phones Mar 24, 2024 pm 06:03 PM

How to implement the WeChat clone function on Huawei mobile phones

PHP Programming Guide: Methods to Implement Fibonacci Sequence PHP Programming Guide: Methods to Implement Fibonacci Sequence Mar 20, 2024 pm 04:54 PM

PHP Programming Guide: Methods to Implement Fibonacci Sequence

PHP Game Requirements Implementation Guide PHP Game Requirements Implementation Guide Mar 11, 2024 am 08:45 AM

PHP Game Requirements Implementation Guide

Master how Golang enables game development possibilities Master how Golang enables game development possibilities Mar 16, 2024 pm 12:57 PM

Master how Golang enables game development possibilities

How to implement exact division operation in Golang How to implement exact division operation in Golang Feb 20, 2024 pm 10:51 PM

How to implement exact division operation in Golang

The No. 1 brother of Guoyou Fourteen years ago is now acquired by a Korean company? A breakdown of Ninetowns' awesome games The No. 1 brother of Guoyou Fourteen years ago is now acquired by a Korean company? A breakdown of Ninetowns' awesome games Apr 02, 2024 am 09:58 AM

The No. 1 brother of Guoyou Fourteen years ago is now acquired by a Korean company? A breakdown of Ninetowns' awesome games

Detailed explanation of using Golang to implement data export function Detailed explanation of using Golang to implement data export function Feb 28, 2024 pm 01:42 PM

Detailed explanation of using Golang to implement data export function

See all articles