Vue 3.0 + vite + axios+PHP跨域问题的解决办法

最后一个Web项目,采用前后端分离。

前端:Vue 3.0 + vite+element plus

后端:PHP

运行时前端和后端是两个程序,前端需要时才向后端请求数据。由于是两个程序,这就会出现跨域问题。

比如前端某个地方需要请求的接口如下所示,这时就会报错。

axios.post('http://localhost/cesiumphp/index.php?action=add', jsonObject).then((response) => {console.log(response);}).catch((error) => {console.error(error);});console.log(jsonString);}}

解决办法:

1.将http://localhost:80(注端口为80时可以省略)替换为api

axios.post('api/cesiumphp/index.php?action=add', jsonObject).then((response) => {console.log(response);}).catch((error) => {console.error(error);});console.log(jsonString);}}

2.在vite.config.ts中增加代理配置,将http://localhost:80

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'// https://vitejs.dev/config/
export default defineConfig({plugins: [vue()],server: {proxy: {'/api': {target: 'http://localhost:80',changeOrigin: true,rewrite: path => path.replace(/^\/api/, '')}}}
})

现在不报错了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/193865.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

内网穿透的应用-通过内网穿透快速搭建公网可访问的Spring Boot接口调试环境

文章目录 前言1. 本地环境搭建1.1 环境参数1.2 搭建springboot服务项目 2. 内网穿透2.1 安装配置cpolar内网穿透2.1.1 windows系统2.1.2 linux系统 2.2 创建隧道映射本地端口2.3 测试公网地址 3. 固定公网地址3.1 保留一个二级子域名3.2 配置二级子域名3.2 测试使用固定公网地址…

Python自动化测试之request库详解(三)

做过接口测试的都会发现,现在的接口都是HTTPS协议了,今天就写一篇如何通过request发送https请求。 什么是HTTPS HTTPS 的全称是Hyper Text Transfer Protocol over Secure Socket Layer ,是以安全为目标的HTTP通道,简单的讲是HTT…

Power Automate-当收到HTTP请求时触发流程

选择创建自动化云端流,点跳过 第一个操作搜索HTTP,点击当收到HTTP请求时

高质量发展项目——冠心病药物治疗管理标准化培训在京顺利举办

国家卫生健康委《关于加快药学服务高质量发展的意见》明确指出,药师应在慢性病管理中发挥积极作用,可开展用药随访、药物重整等工作。目前,国内尚无针对药师使用的冠心病患者药物治疗管理规范,不同层级医疗机构药师的理论水平和实…

idea中把spring boot项目打成jar包

打jar包 打开项目,右击项目选中Open Module Settings进入project Structure 选中Artifacts,点击中间的加号(Project Settings->Artifacts->JAR->From modules with dependencies ) 弹出Create JAR from Modules&#…

精美可视化:Python自动化生成漂亮的测试报告

“ 运用Python的Unittest、数据驱动测试(DDT)、Excel、Jinja2和HTML技术,构建一个能够自动生成精美可视化测试报告的自动化测试框架” 思路流程 封装读取数据,让所有数据都能够再excel中填写,不再填写任何一行逻辑代码…

Wireshark抓包工具配置以及MQTT抓包分析

1、Wireshark抓包工具使用 打开Wireshark选择,需要抓取的物理网卡,添加过滤设置。 单击“捕获”,选择选项,输入需要捕获的IP地址和端口号。 如: ip host 10.60.4.45 and tcp port 1883 ip host 10.60.4.45 and http p…

【场景】高并发解决方案

文章目录 1. 硬件2. 缓存2.1 HTTP缓存2.1.1 浏览器缓存2.1.2 Nginx缓存2.1.3 CDN缓存 2.2 应用缓存 3 集群4. 拆分4.1 应用拆分(分布式、微服务)4.2 数据库拆分 5. 静态化6. 动静分离7. 消息队列8. 池化8.1 对象池8.2 数据库连接池8.3 线程池 9. 数据库优…

系列九、对象的生命周期和GC

一、堆细分 Java堆从GC的角度还可以细分为:新生代(eden【伊甸园区】、from【幸存者0区】、to【幸存者1区】)和老年代。 二、MinorGC的过程 复制>清空》交换 1、eden、from区中的对象复制到to区,年龄1 首先,当eden区…

【自动化测试】Appium环境搭建与配置-详细步骤,一篇带你打通...

目录:导读 前言一、Python编程入门到精通二、接口自动化项目实战三、Web自动化项目实战四、App自动化项目实战五、一线大厂简历六、测试开发DevOps体系七、常用自动化测试工具八、JMeter性能测试九、总结(尾部小惊喜) 前言 1、Node.js环境搭…

异步编程工具Promise与Async/Await:解决前端开发中的嵌套回调地狱

文章目录 Promise:处理异步操作的基本工具Promise.all async/await:更简洁的异步编程方式Promise与async/await的比较结论 当谈及JavaScript中的异步编程时,两个非常常见且强大的工具是Promise和async/await。在本文中,我们将以实…

XD6500S— LoRa SIP模块

XD6500S是一系列LoRa SIP模块,集成了射频前端和LoRa射频收发器SX1262系列,支持LoRa和FSK调制。收发器SX1262系列,支持LoRa和FSK调制。LoRa技术是一种扩频协议,针对LPWAN 应用的低数据速率、超远距离和超低功耗通信进行了优化。通信…

vscode+python开发之虚拟环境和解释器切换

需求情景: 现在我们要开发多个项目比如:项目A,项目B、项目C,他们每个项目需要依赖不同的库。每个项目依赖的解释器也不一样怎么办? 项目A:需要在python3.7环境运行 依赖aadd3.2库 项目B、需要在python3.11…

云原生微服务架构及实现技术

云原生是一种技术理念和架构方法,它充分利用云计算的优势,将应用程序和基础设施进行优化,以适应云环境的特性。云原生的设计原则主要包括弹性、韧性、安全性、可观测性、灰度等,旨在让企业在云环境中实现轻量、敏捷、高度自动化的…

springboot项目的可执行jar以后台本地服务的方式运行在Windows机器上

文章目录 用到的工具先上一个效果图准备可执行文件注册及启动服务 前段时间遇到一个项目,需要我们提供一个驱动控件,可以以后台服务的方式运行在Windows机器上。开始寻找各种解决办法。 最后发现一个不错的解决方式。分享给大家一下。 用到的工具 链接&…

15分钟,不,用模板做数据可视化只需5分钟

测试显示,一个对奥威BI软件不太熟悉的人来开发数据可视化报表,要15分钟,而当这个人去套用数据可视化模板做报表,只需5分钟! 数据可视化模板是奥威BI上的一个特色功能板块。用户下载后更新数据源,立即就能获…

Spring Cloud Netflix微服务组件-Eureka

目录 CAP理论 注册中心对比 为什么注册中心更适合用AP? 分布式系统AP和CP如何取舍? Eureka核心功能点 Euraka server启动的主线流程 总体流程图 EnableEurekaServer 流程图 EurekaServerAutoConfiguration EurekaServerInitializerConfigurat…

《白帽子讲web安全》笔记

第八章 文件上传漏洞 文件上传漏洞是指用户上传了一个可执行的脚本文件,并通过此脚本文件获得了执行服务器端命令的能力 文件上传后导致的常见安全问题一般有: ❍ 上传文件是Web脚本语言,服务器的Web容器解释并执行了用户上传的脚本&#xf…

准「AI 时代」下,如何衡量程序员的工作效率和生产力?

近 20 家科技、金融和制药公司实施了新的研发效能管理方法,并取得了令人鼓舞的初步结果。 客户报告的产品缺陷减少 20%-30%;员工体验分数提高 20%;客户满意度评分提高 60 个百分点。 大模型和 AIGC 技术催生了软件研发的新范式,也…

推介会如何做好媒体宣传

传媒如春雨,润物细无声,大家好,我是51媒体网胡老师。 推介会是一种专为企业、社会组织和团体、政府等提供的展示自身特点、产品和政策的活动形式,旨在促进交流活动,形成合作,从而带来共同利益。推介会的本…