当前位置: 首页 > news >正文

vue-ueditor-wrap上传图片报错:后端配置项没有正常加载,上传插件不能正常使用

 如图所示,今天接收一个项目其中富文本编辑器报错

 

此项目为vue2项目,富文本编辑器为直接下载好的资源存放在public目录下的

经过排查发现报错的函数在ueditor.all.min.js文件内,但是ueditor.all.min.js文件夹是经过压缩的

所以直接,将index.html中的引用路径修改为ueditor.all.js,发现报错,排查问题也没发现哪里引入,于是采用方法B将ueditor.all.min.js删除,再将改成ueditor.all.js名字改成ueditor.all.min.js,还是不行,抱着试一试的心态重启了一下项目,发现终于跑通了 正确引用文件变成了ueditor.all.js

文件列表如图 

index.html如下

 

然后再在ueditor.all.js里面排查问题,发现图片上传路径没有错(前提是配置请求路径),然后经过一系列排查,发现是一个叫imageActionName的配置报错,全局搜索只有php下面的config.json有这个属性,但是这个PHP原来项目是没有这个文件夹的,于是又抱着试试的心态直接在ueditor.config.js加了一下这个属性,发现可行,并且这个属性不能为空

图片上传正确配置请求路径的方法如图:

 ueditor.config.js配置

 

然后发现有正常发起请求了,但是请求没有携带token,于是只能去改源码

在 ueditor.all.js下面的autoupload方法里面去修改相关请求

一下为相关修改示例

 

然后发现请求可以正常发出并且有返回了正确图片路径,但是编辑器却没有正确显示图片

再排查发现 代码错误拼接了图片路径导致图片无法显示

所以直接修改源代码不拼接urlPrefix

然后编辑器就可以正常粘贴图片了

 

此处还有一个小问题就是

vue-ueditor-wrap自定义封装的上传图片dialog点击上传的时候打开的窗口竟是当前项目

原因:路由模式的变更导致渲染的时候路径发生错误,所以重定向到了跟路径然后就变成了当前项目

解决方法:

判断当前的路由模式,然后判断是否拼接“#”

以上问题均出自开源项目yshop商城前端运行时的错误,虽然控制台还是会报错,但是基本不影响使用,有时间的可以尝试去解决,或者直接删掉报错的地方

 

相关文章:

vue-ueditor-wrap上传图片报错:后端配置项没有正常加载,上传插件不能正常使用

如图所示,今天接收一个项目其中富文本编辑器报错 此项目为vue2项目,富文本编辑器为直接下载好的资源存放在public目录下的 经过排查发现报错的函数在ueditor.all.min.js文件内,但是ueditor.all.min.js文件夹是经过压缩的 所以直接&#xff…...

数据仓库的发展历程

数据仓库的概念可以追溯到20世纪60年代,但真正形成理论并被企业广泛应用还需要一个较长的发展过程。大致可以分为以下几个阶段: 决策支持系统(DSS)时期(1960s-1970s) 这一时期,随着管理信息系统(MIS)和电子计算机的兴起,企业开始尝试构建面向决策的数据处理系统。最初的决策支…...

MySQL开窗函数

测试环境:mysql8.0.18 官方文档:https://dev.mysql.com/doc/refman/8.0/en/window-functions.html 一、窗口函数介绍二、语法结构三、自定义窗口1.rows(重点)2.range3.默认窗口 四、常用窗口函数示例1.row_number & rank &…...

Java学习笔记(23)

多线程 并发 并行 多线程实现方式 1.继承Thread类 自己创建一个类extends thread类 Start方法开启线程,自动执行重写之后的run方法 2.实现runable接口 自己创建一个类implements runnable Myrun不能直接使用getname方法,因为这个方法是thread类的方法…...

nodejs下载安装以及npm、yarn安装及配置教程

1、nodejs下载安装 ​ 1.1、使用nodejs版本管理工具下载安装,可一键安装、切换不同nodejs版本, nvm-setup.zip:安装版,推荐使用 本次演示的是安装版。 1、双击安装文件 nvm-setup.exe 选择nvm安装路径 例如:E:\Soft…...

Playwright库page.evaluate()方法执行JavaScript 表达式

page.evaluate() 方法是 Playwright 中常用的方法之一,用于在页面上下文中执行 JavaScript 代码。它允许在浏览器环境中执行各种操作,如操作 DOM 元素、获取页面数据、执行复杂的计算等,并将结果返回到 Node.js 或 Python 代码中。 在 Playw…...

【微服务】OpenFeign+Sentinel集中处理远程调用异常

文章目录 1.微服务基本环境调整1.对10004模块的application.yml调整2.启动nacos以及一个消费者两个提供者3.测试1.输入http://localhost:8848/nacos/index.html 来查看注册情况2.浏览器访问 http://localhost:81/member/nacos/consumer/get/13.结果 2.使用OpenFeign实现微服务模…...

集合嵌套,Collections,斗地主案例,日志框架

文章目录 集合嵌套List嵌套ListList嵌套MapMap嵌套Map Collections类方法排序 sort 乱序 shuffle 斗地主案例需求思路代码 日志框架介绍优势体系结构Logback概述快速入门配置详解 集合嵌套 List嵌套List public static void main(String[] args){//一个年级有许多班级&#xf…...

maven pom relativePath属性的作用

maven pom relativePath属性的作用 文章目录 maven pom relativePath属性的作用一、relativePath出现的地方二、relativePath默认值三、四、<relativePath>一个pom路径 一、relativePath出现的地方 搭建maven项目&#xff0c;子模块指定父模块试&#xff0c;经常会在par…...

【STM32 HAL库SPI/QSPI协议学习,基于外部Flash读取。】

1、SPI协议 简介 SPI 协议是由摩托罗拉公司提出的通讯协议 (Serial Peripheral Interface)&#xff0c;即串行外围设备接口&#xff0c;是 一种高速全双工的通信总线。它被广泛地使用在 ADC、LCD 等设备与 MCU 间&#xff0c;要求通讯速率 较高的场合。 SPI 物理层 SPI 通讯…...

Nginx入门--初识Nginx的架构

一、概述 Nginx的架构设计旨在高效处理并发的网络请求。它采用了事件驱动的、非阻塞的IO模型&#xff0c;可以同时处理成千上万个并发连接&#xff0c;而不会消耗太多的系统资源。 二、主要组件 Nginx的主要组件包括&#xff1a; Master Process&#xff08;主进程&#xf…...

网络性能提升10%,ZStack Edge 云原生超融合基于第四代英特尔®至强®可扩展处理器解决方案发布

随着业务模式的逐渐转变、业务架构逐渐变得复杂&#xff0c;同时容器技术的兴起和逐渐成熟&#xff0c;使得Kubernetes、微服务等新潮技术逐步应用于业务应用系统上。 为了充分释放性能、为业务系统提供更高效的运行环境&#xff0c;ZStack Edge 云原生超融合采用了第四代英特尔…...

双非计算机考研目标211,选11408还是22408更稳?

求稳得话&#xff0c;11408比22408要稳&#xff01; 很多同学只知道&#xff0c;11408和22408在考察的科目上有区别&#xff0c;比如&#xff1a; 11408考的是考研数学一和英语一&#xff0c;22408考察的是考研数学二和英语二&#xff1a; 考研数学一和考研数学二的区别大吗…...

简单了解策略模式

什么是策略模式&#xff1f; 策略模式提供生成某一种产品的不同方式 Strategy策略类定义了某个各种算法的公共方法&#xff0c;不同的算法类通过继承Strategy策略类&#xff0c;实现自己的算法 Context的作用是减少客户端和Strategy策略类之间的耦合&#xff0c;客户端只需要…...

算法——运动模型

智能驾驶中常用的速度计算算法包括基于GPS的速度计算、惯性测量单元&#xff08;IMU&#xff09;的速度计算、雷达测距的速度计算、视觉测距的速度计算等。这些算法可以单独使用或者结合使用&#xff0c;以提高速度计算的准确性和稳定性。 智能驾驶中常用的加速度计算算法包括…...

基于R语言lavaan结构方程模型(SEM)技术应用

结构方程模型&#xff08;Sructural Equation Modeling&#xff0c;SEM&#xff09;是分析系统内变量间的相互关系的利器&#xff0c;可通过图形化方式清晰展示系统中多变量因果关系网&#xff0c;具有强大的数据分析功能和广泛的适用性&#xff0c;是近年来生态、进化、环境、…...

本地虚拟机服务器修改站点根目录并使用域名访问的简单示例

说明&#xff1a;本文提及效果是使用vmware虚拟机&#xff0c;镜像文件是Rocky8.6 一、配置文件路径 1. /etc/httpd/conf/httpd.conf #主配置文件 2. /etc/httpd/conf.d/*.conf #调用配置文件 调用配置文件的使用&#xff1a; vim /etc/httpd/conf.d/webpage.conf 因为在主配…...

生信数据分析——GO+KEGG富集分析

生信数据分析——GOKEGG富集分析 目录 生信数据分析——GOKEGG富集分析1. 富集分析基础知识2. GO富集分析&#xff08;Rstudio&#xff09;3. KEGG富集分析&#xff08;Rstudio&#xff09; 1. 富集分析基础知识 1.1 为什么要做功能富集分析&#xff1f; 转录组学数据得到的基…...

微服务(基础篇-007-RabbitMQ)

目录 初识MQ(1) 同步通讯&#xff08;1.1&#xff09; 异步通讯&#xff08;1.2&#xff09; MQ常见框架&#xff08;1.3&#xff09; RabbitMQ快速入门(2) RabbitMQ概述和安装&#xff08;2.1&#xff09; 常见消息模型&#xff08;2.2&#xff09; 快速入门&#xff…...

汇总:五个开源的Three.js项目

Three.js 是一个基于 WebGL 的 JavaScript 库&#xff0c;它提供了一套易于使用的 API 用来在浏览器中创建和显示 3D 图形。通过抽象和简化 WebGL 的复杂性&#xff0c;Three.js 使开发者无需深入了解 WebGL 的详细技术就能够轻松构建和渲染3D场景、模型、动画、粒子系统等。 T…...

快速排序:核心知识点全解析

一、快速排序 核心所有知识点1. 核心思想分治 挖坑 / 左右双指针 基准值 pivot选一个基准值 pivot把数组划分成&#xff1a;左边 ≤ pivot&#xff0c;右边 ≥ pivot递归对左、右子区间重复划分区间长度为 1 时终止&#xff0c;整体有序2. 时间复杂度平均&#xff1a;\(O(n\l…...

从NLP基础到LLM实战:手把手构建大模型全栈能力

1. 从NLP到LLM&#xff1a;为什么你需要一个坚实的“地基” 最近几年&#xff0c;大语言模型&#xff08;LLM&#xff09;的火爆程度有目共睹&#xff0c;ChatGPT、Claude、文心一言这些名字几乎成了日常谈资。很多开发者&#xff0c;尤其是刚入行的朋友&#xff0c;可能一上来…...

AI开发配置管理利器aiworkspace:实现多项目技能与提示词集中分发

1. 项目概述与核心价值如果你和我一样&#xff0c;在日常开发中同时使用 Cursor、Claude Code 或 Codex 这类 AI 编程工具&#xff0c;并且手头管理着多个项目仓库&#xff0c;那你一定遇到过这个痛点&#xff1a;每个项目里&#xff0c;那些精心调教好的 AI 技能&#xff08;S…...

秋招编程面试,应届生必备的面试技巧,通过率直接翻倍

文章目录前言一、2026秋招编程面试新趋势&#xff1a;别再用老方法准备&#xff0c;踩坑就出局1.1 八股文不再是核心&#xff0c;底层理解才是硬通货1.2 代码手撕重思路轻结果&#xff0c;工程思维成加分项1.3 项目经历拒绝烂大街&#xff0c;真实落地细节把控是关键二、简历优…...

Docker多阶段构建与镜像优化实战

Docker多阶段构建与镜像优化实战:从1GB到50MB的瘦身之旅 🐳 镜像太大?构建太慢?安全隐患太多?本文通过真实 Node.js + Python 项目,手把手教你用多阶段构建把 Docker 镜像从 1GB 压缩到 50MB,附带完整的优化策略和踩坑指南。 一、为什么你的 Docker 镜像这么大? 很多…...

城市道路自动驾驶避障规划与MPC跟踪控制【附仿真】

✨ 长期致力于自动驾驶、路径规划、速度规划、跟踪控制、模型预测控制研究工作&#xff0c;擅长数据搜集与处理、建模仿真、程序编写、仿真设计。 ✅ 专业定制毕设、代码 ✅如需沟通交流&#xff0c;点击《获取方式》 &#xff08;1&#xff09;SL图五次多项式代价路径决策与凸…...

计算机视觉与3D重建:模型加速与质量优化的全栈实践

1. 项目概述&#xff1a;当计算机视觉遇见效率与精度革命最近&#xff0c;微软研究院在计算机视觉领域的两项进展引起了我的注意。一项是关于如何让模型“看”得更快更准&#xff0c;另一项则是关于如何让3D扫描模型从“毛坯”变成“精装”。这听起来像是两个独立的方向&#x…...

从Excel到BI Launchpad:SAP BW/4HANA数据分析实战,手把手教你用BO做报表

从Excel到BI Launchpad&#xff1a;SAP BW/4HANA数据分析实战指南 1. 企业级数据分析的进化之路 在当今数据驱动的商业环境中&#xff0c;企业数据分析正经历着从静态报表到动态洞察的革命性转变。传统Excel虽然灵活易用&#xff0c;但在处理海量数据、实现实时协作和构建企业级…...

开源数字白板the-board:基于React+Fabric.js的实时协作技术解析

1. 项目概述&#xff1a;一个开源的“数字白板”能做什么&#xff1f;最近在GitHub上看到一个挺有意思的项目&#xff0c;叫the-board。乍一看名字&#xff0c;可能觉得平平无奇&#xff0c;但点进去你会发现&#xff0c;它其实是一个功能相当完整的在线白板应用。简单来说&…...

别再只用memcpy了!手把手教你用memcpy_s写出更安全的C语言代码(附VS2022实战)

从memcpy到memcpy_s&#xff1a;现代C语言安全编程实战指南 在Visual Studio 2022的编译输出窗口中&#xff0c;那个刺眼的C4996警告已经成为许多C语言开发者的"老朋友"。当看到"error C4996: memcpy: This function or variable may be unsafe"时&#xf…...