前端项目部署问题总结

简介: 【7月更文挑战第13天】

1. 网络接口问题,会出现报错,误导为跨域问题

image.png

image.png

has been blocked by CoRs
indexpc.html:1
policy: Response to preflight request doesn't pass access control check: No "Access-Control-Allow 0rigin header is present on the reouested resource.
< Failed to load resource: net::ERR FAILED
:8001/schoolweb/bd/sys/doLogin:

这个问题实际的解决是,检查接口地址是否正确,

不需要先考虑跨域的问题

2. sweetalert2 插件更新问题

影响页面跳转,传参和使用方法调整变化

参考 ;https://stackoverflow.com/questions/58950870/sweetalert2-swal-fire-disappears-after-popup-very-strange-error

image.png

image.png

image.png

更改后

        <script src="https://cdn.jsdelivr.net/npm/sweetalert2@10.5.0/dist/sweetalert2.all.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" integrity="sha512-bLT0Qm9VnAYZDflyKcBaQ2gg0hSYNQrJ8RilYldYQ1FxQYoCLtUjuuRuZo+fjqhx/qtq/1itJ0C2ejDxltZVFg==" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@10/dist/sweetalert2.min.css" id="theme-styles">

swal.fire({
   
   
                            title: 'success!',
                            text: '登录成功',
                            // icon: 'error',
                            confirmButtonText: '确 定'
                        }).then((result) => {
   
   
                            if (result.isConfirmed)
                                window.location.href = "searchpc.html";
                            else
                                swal.fire("Error!", "Coudn't delet!", "error");
                        });

3. 服务端部署问题

net::ERR CONNECTION REFUSED
sudo systemctl restart tomcat

服务器接口 启动问题检查

更新插件时间;2024年7月13日

目录
相关文章
|
22天前
|
Cloud Native 前端开发 JavaScript
前端开发者必看:不懂云原生你就OUT了!揭秘如何用云原生技术提升项目部署与全栈能力
【10月更文挑战第23天】随着云计算的发展,云原生逐渐成为技术热点。前端开发者了解云原生有助于提升部署与运维效率、实现微服务化、掌握全栈开发能力和利用丰富技术生态。本文通过示例代码介绍云原生在前端项目中的应用,帮助开发者更好地理解其重要性。
54 0
|
7天前
|
资源调度 前端开发 JavaScript
vite3+vue3 实现前端部署加密混淆 javascript-obfuscator
【11月更文挑战第10天】本文介绍了在 Vite 3 + Vue 3 项目中使用 `javascript-obfuscator` 实现前端代码加密混淆的详细步骤,包括安装依赖、创建混淆脚本、修改 `package.json` 脚本命令、构建项目并执行混淆,以及在 HTML 文件中引用混淆后的文件。通过这些步骤,可以有效提高代码的安全性。
|
25天前
|
缓存 前端开发 JavaScript
前端serverless探索之组件单独部署时,利用rxjs实现业务状态与vue-react-angular等框架的响应式状态映射
本文深入探讨了如何将RxJS与Vue、React、Angular三大前端框架进行集成,通过抽象出辅助方法`useRx`和`pushPipe`,实现跨框架的状态管理。具体介绍了各框架的响应式机制,展示了如何将RxJS的Observable对象转化为框架的响应式数据,并通过示例代码演示了使用方法。此外,还讨论了全局状态源与WebComponent的部署优化,以及一些实践中的改进点。这些方法不仅简化了异步编程,还提升了代码的可读性和可维护性。
|
10天前
|
前端开发 JavaScript 安全
vite3+vue3 实现前端部署加密混淆 javascript-obfuscator
【11月更文挑战第7天】本文介绍了在 Vite 3 + Vue 3 项目中使用 `javascript-obfuscator` 实现前端代码加密混淆的详细步骤。包括项目准备、安装 `javascript-obfuscator`、配置 Vite 构建以应用混淆,以及最终构建项目进行混淆。通过这些步骤,可以有效提升前端代码的安全性,防止被他人轻易分析和盗用。
|
1月前
|
前端开发 JavaScript 应用服务中间件
linux安装nginx和前端部署vue项目(实际测试react项目也可以)
本文是一篇详细的教程,介绍了如何在Linux系统上安装和配置nginx,以及如何将打包好的前端项目(如Vue或React)上传和部署到服务器上,包括了常见的错误处理方法。
296 0
linux安装nginx和前端部署vue项目(实际测试react项目也可以)
|
2月前
|
前端开发 应用服务中间件 nginx
docker部署本地前端项目思路
docker部署本地前端项目思路
40 7
|
3月前
|
前端开发 应用服务中间件 nginx
前端服务器部署方式
【8月更文挑战第25天】前端服务器部署方式
79 1
|
3月前
|
负载均衡 前端开发 应用服务中间件
使用Nginx配置SSL以及部署前端项目
本文介绍了如何使用Nginx配置SSL证书以启用HTTPS,并展示了如何通过Nginx部署前端项目,包括配置SSL证书、设置代理和负载均衡的示例。
112 2
|
3月前
|
缓存 前端开发 应用服务中间件
看看高手是怎么部署前端代码的
【8月更文挑战第8天】从简单的前端项目部署开始,构建dist文件夹并通过Nginx代理接口请求,以解决跨域问题。为进一步优化大型系统的性能及稳定性,需采用高级部署策略。例如,利用CDN分发静态资源并采用缓存控制减少带宽消耗,通过文件哈希值更新URL确保资源按需刷新。面对大规模部署挑战,采用非覆盖式发布方法避免样式错乱风险,并通过灰度部署逐步验证新版功能,确保服务平稳过渡。借助Nginx实现流量切分,可灵活调整新旧版本流量比例,有效降低上线风险。
60 3
|
4月前
|
前端开发 NoSQL 数据库
部署常用的流程,可以用后端,连接宝塔,将IP地址修改好,本地只要连接好了,在本地上前后端跑起来,前端能够跑起来,改好了config.js资料,后端修改好数据库和连接redis,本地上跑成功了,再改
部署常用的流程,可以用后端,连接宝塔,将IP地址修改好,本地只要连接好了,在本地上前后端跑起来,前端能够跑起来,改好了config.js资料,后端修改好数据库和连接redis,本地上跑成功了,再改