vue3 与 spring-boot 完成跨域访问
spring-boot,写一个接口用于前端访问,并且给接口设置跨域访问,这里我前端的域名为 localhost:5173
@RestController
@CrossOrigin(origins = "http://localhost:5173")
public class Vue3Controller {@GetMapping("/vue")public Result vue(){return Result.success("操作成功!");}
}
vue3,安装 axios 插件,创建 axios 实例,配置基础路径,向后端接口发送请求
终端输入:
npm install axios
utils 目录下新建 http.js 文件,这里的基地址是后端接口的访问根路径
// axios 基础封装
import axios from "axios";const httpInstance = axios.create({// 项目基地址baseURL:'http://localhost:8888',timeout: 5000,
})
// 创建完记得暴露该实例
export default httpInstance
在 apis 目录下新建 testVue.js 文件,调用 axios 实例,访问 /vue 接口
import httpInstance from '@/utils/http'// 给实例传入具体路径,即在最末尾拼接 url
export function getCategory(){return httpInstance({url: 'vue'})
}
在 main.js 中启动 testAPI.js,并打印在控制台,导入 getCategory 函数即可
//测试接口函数
import {getCategory} from '@/apis/testAPI'
getCategory().then(res => {console.log(res)
})
访问 app.vue,显示操作成功!:
相关文章:
vue3 与 spring-boot 完成跨域访问
spring-boot,写一个接口用于前端访问,并且给接口设置跨域访问,这里我前端的域名为 localhost:5173 RestController CrossOrigin(origins "http://localhost:5173") public class Vue3Controller {GetMapping("/vue")pu…...
CSS clamp() 函数:构建更智能的响应式设计
在响应式设计中,我们经常需要处理元素大小的动态变化。CSS clamp() 函数提供了一个优雅的解决方案,让我们的设计更加灵活和智能。 clamp() 函数是什么? clamp() 函数接受三个参数: clamp(最小值, 首选值, 最大值)这三个参数分别…...
【C++笔记】数据结构进阶之二叉搜索树(BSTree)
【C笔记】数据结构进阶之二叉搜索树(BSTree) 🔥个人主页:大白的编程日记 🔥专栏:C笔记 文章目录 【C笔记】数据结构进阶之二叉搜索树(BSTree)前言一.二叉搜索树的概念二.二叉搜索树的性能分析三.二叉搜索树的实现3.1二叉树的中序…...
c++设计模式模块与系统
c 中lambda 本质就是一个匿名(没有名)的函数; 可以用一个数组元素存储一个函数的指针; 通过数组下标来使用函数; 高内聚低耦合 如何理解设计模式中的高内聚低耦合 高内聚: 用于指导如何组织和划分软件设计。 **定义:**高内聚指的…...
【81-90期】Java核心面试问题深度解析:性能优化与高并发设计
🚀 作者 :“码上有前” 🚀 文章简介 :Java 🚀 欢迎小伙伴们 点赞👍、收藏⭐、留言💬 文章题目:Java核心面试问题深度解析:性能优化与高并发设计 摘要: 本文聚…...
python实现TCP服务端,支持对所有客户端的数据收发,支持终端自定义命令操作,提供clear命令一键断开所有的客户端连接
前言 python实现TCP服务端,支持对所有客户端的数据收发,支持终端自定义命令操作,提供clear命令一键断开所有的客户端连接 简单易懂,直接上码 源码 import socket import threadingclass TCPServer:# 修改此处ip 端口def __ini…...
【R安装】R语言的详细安装及环境配置(2024年11月)
目录 R及Rstudio下载R下载Rstudio下载 R及Rstudio安装R安装Rtools 安装Rstudio安装 运行 RStudio通过RStudio配置使用特定的R版本 参考 R及Rstudio下载 R下载 R官网-The R Project for Statistical Computing 点击【download R】,进入下载界面: 选择…...
Android 12.0 通知--PendingIntent基本代码
一. PendingIntent 在 Android 通知中的使用场景 使用场景: Android 通知的 setContentIntent() 需要传入 PendingIntent , 即当点击通知时,执行 intent 的动作.如下例子: //1.创建Intent对象Intent intent new Intent(this, MainActivity1.class); //2.获取能启动 Activity 的…...
网络安全在数字时代保护库存数据中的作用
如今,通过软件管理库存已成为一种标准做法。企业使用数字工具来跟踪库存水平、管理供应链和规划财务。 然而,技术的便利性也带来了网络威胁的风险。黑客将库存数据视为有价值的目标。保护这些数据不仅重要,而且必不可少。 了解网络安全及其…...
文本搜索程序(Qt)
头文件 #ifndef TEXTFINDER_H #define TEXTFINDER_H#include <QWidget> #include <QFileDialog> #include <QFile> #include <QTextEdit> #include <QLineEdit> #include <QTextStream> #include <QPushButton> #include <QMess…...
云原生革命:构建未来应用的无限可能
在这个数字化飞速发展的时代,云原生技术如同一股不可阻挡的潮流,正深刻改变着软件开发和部署的方式。它不仅仅是一种技术变革,更是一场关于如何更高效、更灵活地构建和运行应用的革命。今天,我们就来深入探讨云原生的魅力所在&…...
【Ubuntu 24.04】How to Install and Use NVM
参考 下载 curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.7/install.sh | bash激活 Activate NVM: Once the installation script completes, you need to either close and reopen the terminal or run the following command to use nvm immediately. exp…...
android12锁屏界面pin码或者图案解锁居中显示
设置pin码或者图案锁屏后,在锁屏界面向上划左边,图案解锁就在左边, 向上划右边图案就在右边,如何设置一直居中显示呢? diff --git a/packages/SystemUI/res/layout/super_notification_shade.xml b/packages/SystemUI…...
【VUE3】新版Vue3+ElementPlus全家桶开发视频项目实战
VUE 介绍 Vue (发音为 /vjuː/,类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建,并提供了一套声明式的、组件化的编程模型,帮助你高效地开发用户界面。 Vue.js是一个MVVM(Model - View - ViewModel)的SPA框架。 Model:数…...
【UE5 C++课程系列笔记】05——组件和碰撞
效果 可以看到我们可以实现的功能是 (1)可以通过鼠标旋转视角 (2)通过使用Pawn移动组件来控制Pawn移动 (3)Pawn碰到物体会被阻挡然后逐渐滑动 (4)通过空格切换激活/关闭粒子效果…...
【docker 拉取镜像超时问题】
问题描述 在centosStream8上安装docker,使用命令sudo docker run hello-world 后出现以下错误: Error response from daemon: Get "https://registry-1.docker.io/v2/": net/http: request canceled while waiting for connection (Client.Ti…...
51-基于单片机的智能语音识别与处理系统设计
目录 一、主要功能 二、硬件资源 三、程序编程 四、实现现象 一、主要功能 基于51单片机,搞L298N驱动两个电机转动,然后搞LCD1602显示屏,弄个超声波传感器实时检测距离 通过LCD1602显示距离,如果距离小于阈值,则两…...
民安:助力提升城市安全水平
随着城市化进程的加速,平安城市的创建成为了社会治理的重要议题。为了解公众对平安城市创建的看法和评价,为提升城市安全水平提供参考,近期某市委托民安智库专业市场调查公司开展了一次安全感满意度调查。 本次调查围绕公共安全、个人安全、…...
类和对象--中--运算符重载、日期类实现(重要)
目录 1.运算符重载 2.日期类 1.运算符重载 2.1作用: 为了让C的新类型:类。也可以进行内置类型的运算符操作。所以就有了运算符重载。 2.2定义: 运算符重载是具有特殊名字的函数,他的名字是由operator和后⾯要定义的运算符共…...
个人回顾。
一鸡摸塔塔开! 2024/11/24 18:20:42 2019.6毕业。入职hg。到2020.6。入职一年。居住侨源山庄极小房间。月租一千。 一鸡摸塔塔开! 2024/11/24 18:21:15 期间也有保持学习。也玩游戏看小说。把大学缺失的补回来。 一鸡摸塔塔开! 2024/11/24 18:30:33 博客园随笔 学习笔记 100…...
前端面试题-1(详解事件循环)
1.了解浏览器的进程模型 1.什么是进程? 程序运行需要有它自己专属的内存空间,可以把这块内存空间简单的理解为进程 每个应用至少有一个进程,进程之间相互独立,即使要通信,也需要双方同意。 2.什么是线程?…...
http的文件上传和下载原理
目录 一:上传 1:http请求格式 2:文件上传类型分析 1:md5秒传 2:分片上传 1. 什么是分片上传 2. 分片上传的场景 3:断点续传 1. 什么是断点续传 2. 应用场景 3. 实现断点续传的核心逻辑 4. 实现流…...
leetcode 212. 单词搜索 II
给定一个 m x n 二维字符网格 board 和一个单词(字符串)列表 words, 返回所有二维网格上的单词 。 单词必须按照字母顺序,通过 相邻的单元格 内的字母构成,其中“相邻”单元格是那些水平相邻或垂直相邻的单元格。同一…...
1、数据结构概述及顺序表(附:可以直接打印显示的源码)
《数据结构》概述: 数据结构:数据元素之间的关系(逻辑关系) 数据类型:高地电平 表示 1/0 要做大量的运算:诞生了基本数据类型:int double .....--》反应了数据的取值范围 (int字…...
Redis
概述 Redis(全称 REmote DIctionary Server)是一个开源的内存数据存储系统,它被广泛应用于缓存、消息队列、实时数据存储等场景。Redis 是一个基于内存的数据结构存储,可以作为数据库、缓存和消息中间件使用 优点 高性能…...
Android 13 编译Android Studio版本的Launcher3
Android 13 Aosp源码 源码版本Android Studio版本Launcher3QuickStepLib (主要代码) Launcher3ResLib(主要资源)Launcher3IconLoaderLib(图...
【高等数学学习记录】微分中值定理
一、知识点 (一)罗尔定理 费马引理 设函数 f ( x ) f(x) f(x) 在点 x 0 x_0 x0 的某邻域 U ( x 0 ) U(x_0) U(x0) 内有定义,并且在 x 0 x_0 x0 处可导,如果对任意的 x ∈ U ( x 0 ) x\in U(x_0) x∈U(x0) ࿰…...
百度 文心一言 vs 阿里 通义千问 哪个好?
背景介绍: 在当前的人工智能领域,随着大模型技术的快速发展,市场上涌现出了众多的大规模语言模型。然而,由于缺乏统一且权威的评估标准,很多关于这些模型能力的文章往往基于主观测试或自行设定的排行榜来评价模型性能…...
wordpress使用Markdown语法写的文章图片显示不正常,记录一次折腾之旅
wordpress使用Markdown语法写的文章图片显示不正常,记录一次折腾之旅 当我把wordpress站点地址改成域名之后,wordpress上写的文章是使用Markdown语法进行写作的,但是Markdown引用的图片就会加载不出来,但如果把站点地址改成局域网的IP,所有的一切都显示正常了。除非我把图…...
MTK 展锐 高通 sensorhub架构
一、MTK平台 MTK框架可以分为两部分,AP和SCP。 AP是主芯片,SCP是协处理器,他们一起工作来处理sensor数据。 SCP 是用来处理sensor和audio相关功能和其他客制化需求的一个协处理理器,MTK SCP选择freeRTOS作为操作系统,…...
npm 最新国内淘宝镜像地址源 (旧版已不能用)
注意:原域名https://registry.npm.taobao.org/ 在 2022.06.30 号正式下线和停止 DNS 解析 最新地址: #最新地址 淘宝 NPM 镜像站喊你切换新域名啦! npm config set registry https://registry.npmmirror.com 查看镜像使用状态 npm config get registr…...
(超详细图文详情)Navicat 配置连接 Oracle
1、下载依赖文件 Oracle官网下载直链:https://www.oracle.com/database/technologies/instant-client/winx64-64-downloads.html 夸克网盘下载(oracle19c版本):https://pan.quark.cn/s/5061e690debc 官网下载选择对应 Oracle 版…...
iOS 系统中使用 webView 打印 html 的打印边距问题
需求是使用系统提供的打印功能将HTML代码打印出来 1、使用CSS page 设置边距(iOS不生效) page {margin: 0;padding: 0;size: A6 portrait; }在 Android 中边距设置生效的,但是在 iOS 系统使用CSS page规则是不生效的 当从 iOS 系统打印网页…...
深度学习Pytorch中的模型保存与加载方法
深度学习:Pytorch中的模型保存与加载方法 在 PyTorch 中,模型的保存和加载对于模型的持久化和后续应用至关重要。这里详细介绍了两种主要方法:保存整个模型(包括架构和参数)和仅保存模型的状态字典。以下内容进一步完善了加载模型…...
(vue)启动项目报错The project seems to require pnpm but it‘s not installed
(vue)启动项目报错The project seems to require pnpm but it’s not installed 原因 该错误信息表明你的项目需要使用 pnpm 作为包管理工具,但系统中尚未安装 pnpm。 解决方法 【1】删除pnpm.lock 【2】npm install -g pnpm 之后再重新启动 yarn报错࿰…...
【Leetcode 每日一题】3250. 单调数组对的数目 I
问题背景 给你一个长度为 n n n 的 正 整数数组 n u m s nums nums。 如果两个 非负 整数数组 ( a r r 1 , a r r 2 ) (arr_1, arr_2) (arr1,arr2) 满足以下条件,我们称它们是 单调 数组对: 两个数组的长度都是 n n n。 a r r 1 arr_1 arr1 是…...
C++语法·叭
阁下何不乘风起,扶摇直上九万里。 qi fei 目录 内存管理 分区介绍 1.栈区: 2.内存映射段: 3.堆: 4.数据段: 5.代码段: 补充: C内存管理(简略回忆) C内存…...
ComfyUI | ComfyUI桌面版发布,支持winmac多平台体验,汉化共享等技巧!(内附安装包)
ComfyUI 桌面版正式推出,支持 Windows 与 macOS 等多平台,为 AI 绘画爱好者带来全新体验。其安装包便捷易用,开启了轻松上手之旅。汉化共享功能更是一大亮点,打破语言障碍,促进知识交流与传播。在操作上,它…...
探索Python词云库WordCloud的奥秘
文章目录 探索Python词云库WordCloud的奥秘1. 背景介绍:为何选择WordCloud?2. WordCloud库简介3. 安装WordCloud库4. 简单函数使用方法5. 应用场景示例6. 常见Bug及解决方案7. 总结 探索Python词云库WordCloud的奥秘 1. 背景介绍:为何选择Wo…...
用PHP抓取HTTPS资源时的常见问题与解决方法
概述 随着互联网的发展,HTTPS已经成为主流协议,网站的数据安全性得到了显著提升。然而,对于开发者来说,HTTPS的广泛应用也增加了数据抓取的复杂性。尤其是在PHP中实现HTTPS资源的抓取时,开发者可能会遇到以下问题&…...
spring知识点复习--针对面试的
前言 此内容是笔者通过B站的视频总结而来。原视频链接地址:6、Bean Factory与FactoryBean有什么区别_哔哩哔哩_bilibili 1.谈谈springIOC的理解,原理与实现 回答涉及到的点: 控制反转:是一种理论思想,原来的对象是由…...
Web前端学习_CSS盒子模型
content padding border margin <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>CSS盒子模型</title><style></style> </head> <body> <div class"demo&quo…...
ajax基础
一:express框架 在终端输入nodejs文件名 // 引入express const express require(express); //创建应用对象 const app express(); //创建路由规则 app.get(/,(request,response) > {//设置响应response.send(Hello Express); }); // 监听3000端口 app.lis…...
Python轴承故障诊断 (21)基于VMD-CNN-BiTCN的创新诊断模型
往期精彩内容: Python-凯斯西储大学(CWRU)轴承数据解读与分类处理 Pytorch-LSTM轴承故障一维信号分类(一)-CSDN博客 Pytorch-CNN轴承故障一维信号分类(二)-CSDN博客 Pytorch-Transformer轴承故障一维信号分类(三)-CSDN博客 三十多个开源…...
强化学习导论 -章9 基于函数逼近的同轨策略预测
基于函数逼近的同轨策略预测 我们前面已经完成了基于表格的学习任务,基于表格的就是每个s是独立学习的,基本上不考虑泛化的能力,但是也对于每个任务状态学习的非常好。考虑到状态空间越来越大,我们必须考虑到函数逼近的情况。 1…...
Ubuntu环境中RocketMQ安装教程
参考教程 https://blog.csdn.net/weixin_56219549/article/details/126143231 1、安装JDK,并配置环境变量(略) 2、下载RocketMQ安装包 RocketMQ下载地址,选择二进制包下载 unzip rocketmq-all-5.0.0-ALPHA-bin-release.zip 使…...
Linux操作系统2-进程控制3(进程替换,exec相关函数和系统调用)
上篇文章:Linux操作系统2-进程控制2(进程等待,waitpid系统调用,阻塞与非阻塞等待)-CSDN博客 本篇代码Gitee仓库:Linux操作系统-进程的程序替换学习 d0f7bb4 橘子真甜/linux学习 - Gitee.com 本篇重点:进程替换 目录 …...
ThinkPHP Nginx 重写配置
目录 NGINX 重写 Admin项目隐藏入口文件,且禁用Admin模块&Admin.php 1️⃣配置仅用模块 2️⃣新增admin_xyz.php文件(自定义入口文件名),并绑定admin模块 3️⃣配置nginx 重写规则 NGINX 重写 在Nginx低版本中࿰…...
SpringBoot小知识(2):日志
日志是开发项目中非常重要的一个环节,它是程序员在检查程序运行的手段之一。 1.日志的基础操作 1.1 日志的作用 编程期调试代码运营期记录信息: * 记录日常运营重要信息(峰值流量、平均响应时长……) * 记录应用报错信息(错误堆栈) * 记录运维过程数据(…...
深度学习:利用GPU进行训练
深度学习:利用GPU进行训练 在现代深度学习框架中,如PyTorch,利用GPU加速模型训练是一种常见的做法。GPU(图形处理单元)由于其并行处理能力,特别适合执行大量的矩阵运算,这在训练神经网络时尤为…...