npm i axios

// 引入axios
import axios from 'axios'

<template>
    <div>
        <button @click="getInfo">獲取信息</button>
    </div>
</template>
<script>
    // 引入axios
    import axios from 'axios'
    export default {
            name:'App', 
            methods:{
                getInfo(){
                    // 使用axios發(fā)送請求(get) 發(fā)送請求后會有兩個回調(diào)
                    axios.get('http://localhost:9090/queryUserInfo').then(
                        // 成功回調(diào)
                        success=>{
                            console.log('請求成功！')
                            // 請求成功后的數(shù)據(jù)
                            console.log(success.data)
                        },
                        // 失敗回調(diào)
                        error=>{    
                            console.log('請求失??！')
                            // 請求失敗原因
                            console.log(error.message)
                        }
                    )
                }
            }
        }
</script>

package com.wyh.config;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
public class CorsMapping implements WebMvcConfigurer {
    @Override
    /**
     * 重新跨域支持方法
     * CorsRegistry  開啟跨域注冊
     */
    public void addCorsMappings(CorsRegistry registry) {
        //addMapping 添加可跨域的請求地址
        registry.addMapping("/**")
                //設置跨域 域名權限 規(guī)定由某一個指定的域名+端口能訪問跨域項目
                .allowedOrigins("*")
                //是否開啟cookie跨域
                .allowCredentials(false)
                //規(guī)定能夠跨域訪問的方法類型
                .allowedMethods("GET","POST","DELETE","PUT","OPTIONS")
                //添加驗證頭信息  token
                //.allowedHeaders()
                //預檢請求存活時間 在此期間不再次發(fā)送預檢請求
                .maxAge(3600);
    }
}