2024/04/01(2024春季)
学习时长:2小时
代码行数:100多行;
博客数量:1篇
今天主要是练习了vue连接后端spring boot中的一些基本的js语句,还学习了vue中浏览器要获取后端数据中的代理,也就是通过前端服务访问后端服务器再返回浏览器
//导入request.js工具 import request from '@/util/request.js' //提供调用注册接口的函数 export const userRegisterService=(regiseterData)=>{ //借助urlsearchParams完成传递 const params=new URLSearchParams for(let key in regiseterData){ params.append(key,regiseterData[key]); } return request.post('/user/register'+params); }
//定制请求的实例 //导入axios npm install axios import axios from 'axios'; //配置代理路径 const baseURL = '/api'; //定义一个变量,记录公共的前缀 , baseURL const instance = axios.create({baseURL}) //添加响应拦截器 instance.interceptors.response.use( result=>{ return result.data; }, err=>{ alert('服务异常'); return Promise.reject(err);//异步的状态转化成失败的状态 } ) export default instance;
import { fileURLToPath, URL } from 'node:url' import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' // https://vitejs.dev/config/ export default defineConfig({ plugins: [ vue(), ], resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url)) } }, server:{ proxy:{ '/api':{//获取路径中包含了/api请求的请求 target:'http://localhost:8080',//后台服务器所在的源 changeOrigin:true,//修改源, rewrite:(path)=>path.replace(/^\/api/,'')///api替换为'' } } } })