前端报错:has been blocked by CORS policy No Access-Control-Allow-Origin header is present on the requested resource
问题描述项目上线后,发现如果上传的文件超过1M,就会报错:has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
分析使用浏览器的开发者工具查看了上传文件报错的那个请求,状态码为:413 Request Entity Too Large
错误代码413 Request Entity Too Large表示客户端尝试发送的请求体超过了服务器能够或愿意处理的大小限制,这通常发生在以下几种情况下:
上传大文件:当您尝试上传的文件超过了服务器设置的最大文件大小限制时
POST请求体过大:当您通过POST请求发送大量数据时,如果数据超过了服务器的限制,也会出现这个错误
以下是一些解决这个问题的方法:
减小请求体大小:
如果是上传文件,尝试上传一个更小的文件
如果是发送数据,检查是否可以优化数据结构或分批发送数据
修改服务器配置:
如果您有权访问服务器配置,可以增加允许的最大请求体大小
解决办法上面的第一种 ...
部落冲突阵型小程序通过赞助获取复制次数
付钱后一定要到你复制阵型的微信小程序里面留言,不然我无法找到你的账号给你加复制次数,详情看下面
赞助后你能得到什么如果你不希望在使用阵型小程序时看到任何广告,可以考虑通过赞助作者获得复制次数和免广告时间
所谓免广告就是小程序内页面的广告全部消失,但是你打开小程序时的封面广告是无法消除的(这是因为封面广告不属于小程序内的广告)
赞助5元及以上,每1元钱可以获得30次的复制次数和60天的无广告时间,例如:赞助5元你可以获得150次的复制次数和300天的无广告时间、赞助6元你可以获得180次的复制次数和360天的无广告时间、赞助7元你可以获得210次的复制次数和420天的无广告时间,以此类推……
赞助5元以下,每1元钱可以获得25次的复制次数和50天的无广告时间,最低需要赞助3元,赞助3元以下你不会获得复制次数和免广告时间,例如:赞助2元你不会获得复制次数和免广告时间、赞助3元你可以获得75次的复制次数和150天的无广告时间、赞助4元你可以获得100次的复制次数和200天的无广告时间
赞助流程付款先在这里说明一下,你付款后不会马上获得复制次数,因为我是手动给你加复制次数的,我会在12个小时内 ...
Nginx重新部署SSL证书
问题描述现在腾讯云免费的SSL证书有效期只有3个月,每三个月就要部署一次SSL证书,写本文是为了以后的方便
腾讯云可以申请50个免费证书,当证书到期后会自动释放额度,例如:如果你的证书全部到期,那么你还是可以申请50个免费证书
操作步骤申请证书选择免费证书
验证方式选自动,并勾选自动删除验证,其它的根据自己的情况填即可
下载证书下载Nginx格式的证书
解压证书解压刚才下载的压缩文件,里面会有4个文件
替换云服务器中的文件Nginx的配置文件一般在/etc/nginx/conf.d/目录下,把旧的直接删除再在把新的复制进去即可,旧的文件和新的文件的文件名应该是一样的,不一样的话就去改配置
重新加载Nginx的配置文件不重新加载的话,生效的还会是旧的文件,即使已经删除了旧的文件
先测试配置是否有语法错误,可以使用以下命令进行测试,如果输出显示 syntax is ok 和 test is successful,说明配置文件没有问题
1nginx -t
测试通过后,可以通过以下命令让Nginx重新加载配置文件而不中断服务
1nginx -s reload
使用下面命令查看Ngi ...
VS Code在开发Vue.js时F12转到定义快捷键失效的解决办法
问题描述在使用VS Code开发时,如果想从HTML代码中快速跳转到对应的JavaScript方法,可以使用F12转到定义快捷键快速跳转,但是却失效了,大大降低了开发的效率
原因分析在 Vue 项目中,使用 VS Code 进行代码开发时,有时按下快捷键 F12 无法跳转到函数的定义位置。这可能是因为你的引用路径中包含了 @ 符号,而 VS Code 默认的跳转定义功能在这种情况下失效了,并且在导入时也不会出现路径提示。
解决办法在项目根目录下新建一个名为jsconfig.json的新文件,文件的内容如下所示,直接全部复制进去即可
12345678910111213141516171819202122{ "compilerOptions": { "module": "commonjs", "target": "es6", "baseUrl": ".", "p ...
解决Java代码中的魔法值
魔法值的定义未经定义的常量叫做魔法值,通常是指在代码编写时莫名出现的数字,无法直接判断数值代表的含义,必须通过联系代码上下文分析才可以明白,严重降低了代码的可读性,例如在下图中的3和2都是魔法值
解决办法下面代码的用户身份有三种:1代表管理员、2代表房东、3代表租户,即在数据库中只存储1、2、3,不存储实际的含义,如果想知道从数据库查询到的用户身份就会出现魔法值了,例如想知道用户身份是不是管理员就需要判断user.getType()==1,1就是魔法值
要消除魔法值可以定义静态常量,也可以使用枚举类,建议使用枚举类更加方便管理
定义静态常量
定义,如果想定义一次可以在多个类中使用,那么请将下面代码中的private关键词修改为public,其它类想使用下面的静态常量需要先import导入(根据IntelliJ IDEA的提示导入即可)
123456789101112/** * 管理员 */private final static int USER_TYPE_ADMINISTRATOR = 1;/** * 房东 */private final static int USER_TYPE_ ...
报错Caused by: java.nio.charset.MalformedInputException: Input length = 1的解决办法
描述这个报错发生在从GitHub仓库clone代码在本地部署的时候,和配置文件application.yml有关
解决办法
修改IntelliJ IDEA的编码为UTF-8,下图的三个地方都改掉
先复制配置文件application.yml的内容,再把它删除,最后新建配置文件application.yml,把之前复制的配置内容复制进去即可
前端的Date类型和Java的LocalDateTime类型互相转换
问题描述前端操作的时间类型一般为Date类型(不是Java的Date类型),而Java则为LocalDateTime类型
前端的时间传到后端保存到数据库需要先转换成LocalDateTime类型,后端的时间显示到前端则需要转换成前端的Date类型
解决办法前端的Date类型转换成后端的LocalDateTime类型首先根据前端的Date类型获得对应的时间戳(单位为秒),后端将时间戳转换成LocalDateTime类型
后端的LocalDateTime类型转换成前端的Date类型首先根据后端的LocalDateTime类型获得对应的时间戳(单位为秒),前端再将前面的秒时间戳转换成毫秒时间戳(秒时间戳×1000),最后将毫秒时间戳转换成前端的Date类型
代码实现Date类型转换成LocalDateTime类型前端获得当前时间的秒时间戳,下面的getTime()获得的时间戳单位为毫秒,所以要除以1000,小数部分则通过Math.floor()舍去
1const timestampSeconds = Math.floor(new Date().getTime()/1000)
后端将秒时间戳 ...
Vue3使用ECharts图表库
安装ECharts1npm install echarts --save
在页面中使用HTML代码12345678910<template> <div> <div class="echarts-box"> <div id="myEcharts1" :style="{ height: '300px' }"></div> </div> <div class="echarts-box"> <div id="myEcharts2" :style="{ height: '300px' }"></div> </div> </div></template& ...
在前端格式化Element Plus表格数据
问题描述有时候后端返回的数据不易于阅读,需要格式化一下,虽然后端也可以格式化数据,但是在前端格式化会更加方便,且前端的代码部署起来比后端方便多了
简单数据格式化目标2024-02-01T15:10:43格式化成2024-02-01 15:10:43
HTML代码下面代码的scope.row可以拿到整行的数据
12345<el-table-column prop="addDate" label="添加时间" align="center"> <template #default="scope"> <span>{{ scope.row.addDate.replace('T', ' ') }}</span> </template></el-table-column>
复杂数据格式化目标Wed Feb 07 2024 00:00:00 GM ...
Vue3使用v-viewer实现查看大图功能
安装1npm install v-viewer@next
全局引入在main.js文件中引入
12345import Viewer from 'v-viewer'import 'viewerjs/dist/viewer.css'const app = createApp(App)app.use(Viewer).mount('#app')
在页面中使用定义options的url123const options = ref({ url: 'data-src'})
HTML代码src填图片在页面中的展示图片链接(一般是略缩图),data-src则填大图的图片链接(一般是更清晰的原图)
123456789<el-table-column fixed="left" prop="imageName" label="头像" align="center" width="180"> ...