手把手教你写项目之个人云盘系统全栈开发---第2篇:“芝麻开门!”——揭秘云盘的“门禁系统”

地图打印与 GeoTIFF 导出:框选区域、矢量标绘、一键出图 空间智能实验室 Vol.19:地图打印与 GeoTIFF 导出:框选区域、矢量标绘、一键出图 「把这块区域导成一张带地理坐标的高清图」是个很朴素的需求,但朴素不等于简单。你要在浏览器里框一个框、画几个箭头标个文字、叠一层 阅读详情

阅读前请先下载项目源码,边读边看源码以加深理解和实操,
源码地址已放于文章末尾!

第2篇:“芝麻开门!”——揭秘云盘的“门禁系统”

欢迎回来,各位“云盘建筑师”!
在这里插入图片描述

在这里插入图片描述

在上一篇中,我们已经搭好了“施工脚手架”,成功让我们的云盘项目在本地跑了起来。现在,我们的“云盘大厦”有了一个漂亮的入口,但问题是——这个入口谁都能进,简直就像个“公共厕所”,毫无隐私可言!

这可不行。我们的私人云盘,必须得有个靠谱的“门禁系统”,只有手持“钥匙”的主人才能进入。今天,我们就来扮演一回“金牌保镖”,为我们的云盘打造一套坚不可摧的用户认证系统!

核心探秘:PHP Session 是如何发放“临时通行证”的?

想象一下,你的云盘是一个守备森严的私人城堡。当你想进去时,不能直接闯,得先去门口的岗亭(登录页面)报上你的“暗号”(用户名和密码)。

岗亭里的守卫(服务器)会核对你的暗号。如果暗号正确,他不会把城堡的主钥匙给你(这太危险了!),而是会给你一张**“临时通行证”**,并告诉你:“嘿,拿着这个,今天你在城堡里可以畅通无阻了!”

同时,守卫自己也会在一个小本本上记下:“通行证编号007,发给了张三,有效。”

这张“临时通行证”,在我们的技术世界里,就是 PHP Session。

当你拿到通行证后,无论你是想去城堡的“书房”(查看文件),还是想去“后花园”(上传文件),每个关卡的守卫都会检查你的通行证。他们只需在自己的小本本上查一下这个编号是否有效,就知道该不该放行了。

等你离开城堡(关闭浏览器),这张通行证就会自动失效。下次再来?不好意思,请重新报暗号领证。

这个过程,我用一张时序图给你描绘出来,保证一清二楚:

用户 登录页面 (login.php) 服务端 (index.php) Session存储 输入“admin / admin” 发起登录请求(POST) 验证用户名和密码是否匹配 "喂,老铁,给他注册个通行证!" "OK,通行证ID: xyz123 已记录" "口令正确!重定向到云盘主页" "好嘞!我要访问主页(带着通行证ID)" "查一下,这个通行证ID有效吗?" "有效,是自己人!" "欢迎回家!(显示主页内容)" "暗号不对!显示错误信息" alt [验证成功] [验证失败] 用户 登录页面 (login.php) 服务端 (index.php) Session存储

看明白了吗?Session 机制的核心,就是通过一个独一无二的ID来跟踪用户的登录状态,避免了每次请求都得重新输入密码的尴尬。

代码实战:“四位一体”深扒登录逻辑

好了,理论学习结束,是时候亮出我们的“手术刀”,解剖代码了!咱们的门禁系统,主要由 login.php、config.php 和 index.php 这三位同志协同完成。

1. “后勤部长”的秘密武器 - config.php

这里存放着我们最核心的“暗号”。

a. 文件路径定位: config.php

b. 全面讲解引用:

  • define(): 这是PHP中用来定义一个常量的函数。常量一旦定义,就不能被改变。把账号密码这种重要信息定义为常量,可以防止在代码的其他地方被意外修改。
  • password_hash(): 这是PHP官方推荐的密码加密函数。它会使用一种强单向哈希算法来加密你的密码。PASSWORD_DEFAULT 表示使用当前PHP版本最推荐的算法,非常安全。

c. 逐行注释与结构化分析:

// 文件路径: config.php

<?php
// ...

// 定义系统配置常量
define('USERNAME', 'admin'); // 用户名
// 使用 password_hash 对密码进行加密,增强安全性
define('PASSWORD_HASH', password_hash('admin', PASSWORD_DEFAULT)); // 默认密码:admin
define('UPLOAD_DIR', __DIR__ . '/uploads'); // 上传目录

// ...
?>

逻辑拆解:
这段代码非常直白。它定义了三个系统级别的“铁律”:用户名是admin,密码是admin加密后的那一长串神秘代码,文件仓库在uploads文件夹。最关键的是 password_hash(),它不是简单的把’admin’变成’nimda’,而是生成一个几乎无法逆向破解的字符串。这意味着,即使数据库被盗,黑客也无法知道你的原始密码是什么。安全感,瞬间爆棚!

2. “门卫岗亭”的职责 - login.php

这是用户唯一能看到的认证界面,一个纯粹的“门面担当”。

a. 文件路径定位: login.php

b. 全面讲解引用:

  • $_POST: PHP中的一个超全局变量,专门用来收集method="post"的表单提交过来的数据。
  • <form method="POST">: 定义了一个HTML表单,method="POST"意味着表单数据将在HTTP请求体中发送,比GET方法更安全,适合传输密码这类敏感信息。

c. 逐行注释与结构化分析:

<!-- 文件路径: login.php -->

<!-- ... (HTML头部和样式) ... -->
<body>
    <!-- ... (外层容器) ... -->
    
    <!-- 如果有登录错误,则显示错误提示 -->
    <?php if (isset($loginError)): ?>
        <div class="bg-red-50 ...">
            <span><?php echo $loginError; ?></span>
        </div>
    <?php endif; ?>
    
    <!-- 登录表单 -->
    <form method="POST" class="space-y-5">
        <!-- 用户名输入框 -->
        <div>
            <input type="text" id="username" name="username" required>
        </div>
        
        <!-- 密码输入框 -->
        <div>
            <input type="password" id="password" name="password" required>
        </div>
        
        <!-- 登录按钮,注意 name="login" -->
        <button type="submit" name="login">登录</button>
    </form>
    
    <!-- ... (其他HTML) ... -->
</body>
</html>

逻辑拆解:
login.php本身不处理任何逻辑,它就是一个纯粹的“信息采集员”。它的任务就是提供两个输入框(name分别为username和password)和一个提交按钮(name为login),然后把用户填写的信息打包,通过POST方式,恭恭敬敬地交给“总指挥”index.php去处理。如果index.php发现暗号不对,会把错误信息$loginError传回来,这里就负责把它显示给用户看。

3. “总指挥”的决断 - index.php

所有认证的核心逻辑,都在这里!

a. 文件路径定位: index.php

b. 全面讲解引用:

  • session_start(): 启动或恢复一个会话。这是使用$_SESSION变量的前提,必须在任何输出之前调用。它就像打开了岗亭里那个“小本本”。
  • isset(): 检查一个变量是否已设置并且非NULL。我们用它来判断用户是否提交了表单,或者Session里是否已经有登录标记。
  • password_verify(): 用于验证一个密码是否和指定的哈希值匹配。这是password_hash()的“官方CP”。
  • $_SESSION: PHP的另一个超全局变量,用于在用户的多个页面请求之间存储信息。我们把登录状态就存在这里。
  • header('Location: ...'): 发送一个原始的HTTP头,常用于页面重定向。
  • exit: 终止脚本执行。重定向后通常要加上它,防止后续代码意外执行。

c. 逐行注释与结构化分析:

// 文件路径: index.php

<?php
// ...

// 引入配置文件,获取账号密码
require_once 'config.php';

// 开启Session,准备记录登录状态
session_start();

// 函数:检查当前用户是否已登录
function isLoggedIn() {
    // 检查Session中是否有'authenticated'标记,并且值为true
    return isset($_SESSION['authenticated']) && $_SESSION['authenticated'] === true;
}

// ---- 核心:登录处理 ----
// 检查用户是否点击了名为 'login' 的按钮提交了表单
if (isset($_POST['login'])) {
    $username = $_POST['username'];
    $password = $_POST['password'];
    
    // 验证用户名是否正确,并使用 password_verify 验证密码
    if ($username === USERNAME && password_verify($password, PASSWORD_HASH)) {
        // 验证通过!在Session中打上“已认证”的标记
        $_SESSION['authenticated'] = true;
        // 重定向到主页,刷新页面以展示登录后的内容
        header('Location: index.php');
        exit;
    } else {
        // 验证失败,准备一条错误消息
        $loginError = '用户名或密码错误';
    }
}

// ... (登出处理) ...

// ---- 核心:权限守卫 ----
// 如果用户未登录 (isLoggedIn() 返回 false)
if (!isLoggedIn()) {
    // 把 login.php 的内容“搬”过来显示,不让他看到云盘主页
    include 'login.php';
    // 终止后续所有代码的执行,保卫主页内容
    exit;
}

// 如果代码能执行到这里,说明用户已经登录成功!
// 后面就是文件管理等核心功能代码...

?>

d. 上下文关联:
整个流程就像一个精密的齿轮:

  1. 用户访问 index.php。
  2. index.php 的“权限守卫”代码立刻执行 isLoggedIn() 检查。
  3. 第一次访问,$_SESSION['authenticated'] 肯定不存在,isLoggedIn() 返回 false。
  4. 守卫发现是“闲杂人等”,立刻 include 'login.php',把登录页面展示出来,并 exit 掉,后面的代码根本没机会执行。
  5. 用户在 login.php 页面输入账号密码,点击提交。表单数据被 POST 到 index.php。
  6. index.php 的“登录处理”代码块被触发(因为 isset($_POST['login']) 为 true)。
  7. 它从 config.php 获取正确的用户名和密码哈希,与用户提交的数据进行 password_verify() 比对。
  8. 比对成功,就在 $_SESSION 里存入 ['authenticated' => true],然后 header('Location: index.php') 刷新一下页面。
  9. 浏览器收到重定向指令,再次访问 index.php。
  10. 这一次,“权限守卫”再次执行 isLoggedIn(),发现 $_SESSION['authenticated'] 已经是 true 了!
  11. 守卫放行,不再执行 include 'login.php' 和 exit。代码继续往下执行,用户最终看到了云盘的主界面。

完美闭环!

总结与预告

今天,我们成功为云盘安装了一套可靠的“门禁系统”。我们理解了PHP Session的“通行证”机制,并深入代码,搞懂了从配置、前端表单到后端验证的每一个细节。

现在,我们的云盘已经是一个安全的私人空间了。但是,一个空荡荡的城堡有什么意思呢?

在下一篇中,我们将进入最核心、最激动人心的部分——“乾坤大挪移”:文件上传与列表展示的艺术。我将带你揭秘文件是如何从你的电脑“飞”到服务器上,并被优雅地展示出来的。

准备好迎接你的第一个文件了吗?我们下期见!

源码下载地址:
https://thmail.lanzouu.com/if4Yn34b31cf

BAPI_REPMANCONF1_CREATE_MTS实战:从MFBF事务码到精准零件反冲的代码级解析 本文深入解析了如何通过BAPI_REPMANCONF1_CREATE_MTS函数实现SAP生产模块中的零件反冲自动化。文章对比了MFBF事务码的手动操作与BAPI编程的优劣,详细拆解了函数的核心参数、数据结构、调用流程及事务控制,并提供了从数据准备到凭证获取的完整代码示例与避坑指南,帮助开发者实现高效、精准的批量投料过账。 阅读详情

相关推荐

vscode中创建vue快捷键

1.安装Vetur插件(扩展里面直接搜) 2.vscode 界面里面左上角选则 文件=> 首选项=> 用户代码片段=>新建全局代码片段=>在输入框中新建名称为vue.json 3.删除里面的注释,当然你也可以留着,把下面的代码粘贴进去! { // Place your 全局 snippets here. Each snippet is defined under a snippet name and has a scope, prefix, body and // descri

Leon_940002463的博客 3207

【项目推荐】基于 SpringBoot3 + Spring AI 的游泳馆管理系统:Agent + RAG + Function Calling 一次学全

它不是玩具 Demo,而是一个「业务 + AI」双主线交织的真实系统——预约业务在跑,AI 客服在旁边实时查库作答,两条线通过 Function Calling、RAG、站内消息串成一体。面试官问「你做过什么 AI 项目」时,你能从业务场景讲到架构取舍,从 RAG 切分参数讲到降级兜底——这和「我调了一下 ChatGPT 的 API」是完全不同的两个段位。项目已包含完整的建表 SQL、初始化数据、部署文档,克隆下来就能跑。获取方式:见文末说明 / 后台回复关键词获取。—— 完 ——

深耕开发,专注编程实战。分享源码解析、项目搭建、问题排查笔记,沉淀技术,持续更新。 347

WPS Office 2026免费安装指南:AI办公与安全使用全解析

办公软件作为数字化办公的核心工具,其基本原理是通过文档处理、数据计算和演示展示等功能模块满足用户日常办公需求。随着人工智能技术的发展,现代办公软件逐步集成AI能力,通过自然语言处理和数据分析算法提升工作效率。在技术价值层面,优秀的办公软件不仅需要保持格式兼容性和跨平台同步能力,更要注重用户数据安全防护。从应用场景来看,无论是个人文档编辑、企业报表分析还是团队协作演示,办公软件都发挥着关键作用。WPS Office 2026作为国产办公软件代表,深度融合AI助手功能,支持智能写作和数据分析,同时通过官方免费策

weixin_30599769的博客 715

Web 版翻译者资料库

本项目是桌面版《翻译者资料库》的 Web 移植版,基于 Spring Boot 3.3、Thymeleaf、Bootstrap 5.3 与 MySQL 8.0 构建。它面向翻译写作提供资料、词汇、句库、文本工具、对照制作、查找、备份恢复及旧库迁移等功能,完整继承桌面版核心业务规则,支持一键启动与离线访问。

howard2005的专栏 137

基于eBPF的零侵入LLM智能体观测:AgentSight架构与实战

在分布式系统和云原生架构中,可观测性是保障应用稳定运行与高效排障的核心能力。其原理在于通过日志、指标和追踪三大支柱,从外部视角持续收集和分析系统状态,而非依赖应用内部埋点。这一技术价值在于能以统一、低开销的方式,理解复杂系统的内部行为,尤其在微服务、容器化及Serverless等动态环境中至关重要。应用场景广泛覆盖了性能监控、安全审计、故障诊断与根因分析。当我们将这一基础理念应用于当下快速发展的AI智能体领域时,便自然引出了对LLM智能体进行无侵入、系统级行为观测的需求。传统的应用层方案需要集成SDK,对闭

weixin_28696185的博客 324

CMOS锁相环核心:四种鉴频鉴相器(PFD)结构深度剖析与选型指南

本文深入剖析了CMOS锁相环中四种鉴频鉴相器(PFD)的结构与性能,包括传统RS触发器型、非时钟型、预充电型和边沿触发型PFD。通过详细的电路分析、实测数据和工程案例,提供了PFD选型的实用指南,帮助工程师根据速度、功耗和精度需求选择最优方案,提升锁相环设计效率。

weixin_42530458的博客 587

2026小红书小工具怎么制作:纯前端 ZIP 打包、沙箱限制与笔记挂载流程

小红书小工具制作的核心不是复杂开发,而是把需求压缩成纯前端轻交互,并按平台要求完成 ZIP 交付。适合做的方向是测试、计算器、生成器、学习小测和记录工具;不适合做的方向是账号体系、云端数据、支付和远程接口。制作时先确认沙箱限制,再整理输入、计算、输出链路,最后通过 Builder Hub 提交审核并挂载笔记。在需求简单、素材较少的情况下,十几分钟做出一个可用的小工具是现实路径,袋马就是一个选择。

qq_39308835的博客 284

3D模型文件格式全解析:从STL到glTF,10种主流格式与转换实战指南

在三维数字内容创作与工程制造领域,3D模型文件格式是数据交换与协作的基石。其核心原理在于以不同的数据结构(如三角网格、NURBS曲面、边界表示等)对三维物体的几何、外观及场景信息进行编码。理解这些格式的技术特性,对于保障数据完整性、提升工作流效率具有关键价值,广泛应用于3D打印、游戏开发、影视动画及工业设计等场景。例如,面向增材制造的STL格式以其极简的三角面片结构成为行业通用语,而支持丰富材质与动画的FBX格式则在影视游戏管线中扮演核心角色。本文聚焦于STL、OBJ、FBX、3MF、STEP等10种主流格

weixin_28520495的博客 355

Agent 的 ReAct、Plan、Execute、Reflection 模式

本文系统解析 Agent 的 ReAct、Plan、Execute、Reflection 四模式,揭示其核心为“下一步谁定”与“错了怎么发现”两大问题。ReAct 逐步决策,适合动态环境但易冗余;Plan 一次性规划,高效却惧变化;Execute 严格落地,需明确判据与失败策略;Reflection 事后校验,强化纠错闭环。四者协同:外层规划,执行中嵌入思考,每步后反思,连续失败才重规划,构建稳定可控的智能体工作流。

2401_89855466的博客 325

使用Android Studio调试系统应用之TvSettings(一):移植

对于做ROM的同仁、以及想要深入学习Android同学,必定会去调试Android的系统APK,而 *aosp* 源码中的系统APK源码,无法直接在Android Studio中进行调试,本文将持续更新细节,手把手教你,使用Android Studio调试安卓的系统应用。在每个阶段,提供知识点的梳理、总结,为您答疑解惑!

上周的博客 2054

Open-Sora代码详细解读(1):解读DiT结构

目前开源的DiT视频生成模型不是很多,Open-Sora是开发者生态最好的一个,涵盖了DiT、时空DiT、3D VAE、Rectified Flow、因果卷积等Diffusion视频生成的经典知识点。本篇博客从Open-Sora的代码出发,深入解读背后的原理。

沉迷单车的追风少年 2264

海外平台频繁弹验证?从 DNS、WebRTC 到浏览器指纹的环境异常排查清单

在运营多地区海外平台账号时,即使代理节点通畅、TCP 握手成功,仍可能遇到频繁人机验证、地区限制、播放失败等异常。核心结论是:这类问题往往不在网络传输层,而在浏览器环境参数与网络出口之间的逻辑自洽性。本文从 DNS 泄漏、WebRTC 穿透、时区与语言匹配、Canvas/WebGL 指纹、TLS 特征五个维度,给出一份可复现的环境异常排查清单,并对比个人手动配置与工程化环境管理方案的适用边界。适用于跨境运营、多账号运维团队。

P1Browser【p1指纹浏览器】的博客 182

RK3568_Android15适配以太网网卡gmac+国产phy芯片YT8531

本文介绍了在Android15 SDK上适配正点原子ATK-DLRK3568开发板网卡的过程。开发板采用GMAC接口搭配YT8531C PHY芯片,包含两个千兆网口。主要内容包括:硬件原理图确认、网络链路连接方式、内核DTS配置(包括GMAC0和GMAC1的参数设置)、PHY驱动适配(基于motorcomm.c驱动文件)、PHY寄存器读写调试方法以及MAC地址设置方式。文章还分析了常见问题,如网卡注册后无法ping通网络的故障现象。通过详细的硬件确认和软件配置,实现了双网卡在Android系统上的完整适配。

Android/Linux驱动开发传帮带学习,让驱动入门门槛更低! 2014

信号链电路怎么选运放?奥特四款信号链运放解析【选型参考】

在模拟电路设计中,运放作为信号链的“第一道门槛”,其微小误差往往决定了整个系统的成败。

naNa_1120的博客 191

计算机控制技术及应用

《计算机控制技术及应用》通过总结作者的科研成果和吸收国内外的先进理论、方法和技术,以计算机控制系统的网络化、开放化、智能化和集成化发展趋势为主线索,主要介绍计算机控制系统的基本概念和计算机控制系统的典型形式,计算机控制系统的数学描述与基本分析方法,以及数字PID控制器、最少拍控制系统、达林算法、状态变量设计法等设计方法及其各种改进算法。重点突出计算机控制系统输入输出通道接口的设计方法和典型控制系统的设计案例与实现方法等。

文档:亲测可用解决vnc灰屏,黑屏,鼠标大黑叉情况

主要解决vnc-viewer灰屏,黑屏,鼠标大黑叉等现象,详细见文档。

智能问诊的流程

本文介绍基于FastAPI构建的医疗多Agent系统MediAgent,通过症状分析、诊断推理与治疗建议等模块协同,实现从问诊到报告生成的完整工作流。系统采用前后端分离架构,结合MySQL、RabbitMQ与Docker实现工程化部署,支持异步化验结果接入。虽当前状态暂存于内存,但已具备可扩展性,未来可通过Redis持久化、消息队列联动及医疗安全机制完善,应用于慢病管理、辅助决策等场景,推动AI在医疗流程中的落地应用。

Joey 的工作空间~ 669

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

流式输出 SSE:实现 AI 对话打字机效果后端开发

摘要解决传统 HTTP 请求在 LLM 长文本生成时导致的客户端长时间阻塞与 TTFT 极高的问题。适用于需为 AI 应用提供打字机效果、优化交互体验的后端开发工程师。读完可获得基于 FastAPI 与 SSE(Server-Sent Events)技术的流式响应实现代码、协议规范及生产环境避坑指南。关键词SSE、流式输出、FastAPI、打字机效果、TTFT、大模型推理背景与问题大模型(LLM)生成完整回复通常耗时数秒至数十秒,传统请求-响应模型导致用户界面长时间无响应,体验极差。

2402_85729970的博客 178

ssm框架搭建

这个是一个在idea上成功跑起来的ssm框架项目,保存在这里方便以后使用直接下载

Vue-Router

本文详解前端路由原理与实现,以网易云音乐为例,介绍通过 vue-router 实现页面无刷新切换。核心步骤包括:安装模块、创建路由实例、注册应用、配置页面组件与路由出口。使用 router-link 实现声明式导航,结合 query 和 params 传参,支持模糊与精确匹配激活状态。强调 useRoute(读取参数)与 useRouter(执行跳转)的区别,帮助开发者掌握单页应用路由的核心机制。

2301_79245606的博客 340

基于 YOLOv8 的森林火灾检测系统(Web 版)

本项目面向林区早期火情识别场景,使用YOLOv8完成火焰(Fire)与烟雾(Smoke)两类目标的检测模型训练,并以FastAPI构建 Web 检测平台,把模型能力封装为可直接登录使用的系统。平台除常规的图片、批量、视频、摄像头检测外,还提供同图多权重对比、数据集浏览与标注核对、模型热切换,以及把训练搬到网页上的能力:可在浏览器配置超参数发起真实训练,训练中在线调整学习率、查看进度与动态曲线,训练完成后下载产物或直接应用到检测。

Michael_Jay的博客 59

身份验证漏洞专题(三):持久登录、密码重置与密码修改中的凭据绑定缺陷

密码登录与双因素认证是身份验证的主干流程,但一个完整的认证体系还依赖三类辅助机制:持久登录("记住我")、密码重置、密码修改。这三类机制的共同特征是:它们同样携带或验证凭据,同样直接决定认证状态的归属,但实现时获得的防护强度往往远低于登录页面本身。攻击者绕不开登录接口时,常常可以从这些辅助入口进入。

2401_85321170的博客 629

二进制木马免杀-Python 分离免杀与 Web 挂马

二进制木马免杀-Python 分离免杀与 Web 挂马

2503_94637398的博客 268

Vue 前端开发 AI 对话页面:流式消息渲染、文件上传

关键点是不能手动设置 Content-Type 为 multipart/form-data,必须由浏览器自动生成带有 boundary 的请求头,否则后端无法解析。思路:将对象序列化为 JSON 字符串,作为 FormData 的一个普通字段(如 formData.append(‘payload’, JSON.stringify(data))),后端接收该字段后再反序列化。若上传大文件(>10MB),需实现独立的分片上传接口,在提交对话前先获取文件 id 或 url,再随文本发送引用。移除输入框的禁用态;

2402_85729970的博客 387

在Open-WebUI中提升向量化速度

让Open-WebUI AI聊天的向量化过程不超过10秒,而不是默认的20+分钟……

xyzzklk的博客 573

Writeup 4 0xGame 2021 · command (WEB)

前端限制不可信:永远不要相信前端的任何限制(如disabled按钮、JS 验证等)。攻击者可以直接构造 HTTP 数据包绕过前端校验,所有的安全限制必须在后端实现。命令执行/注入(RCE):Web 应用如果直接调用系统命令且未对输入进行严格过滤,攻击者可以利用;||等符号拼接恶意命令。绕过技巧:在 CTF 中,如果遇到命令执行被过滤,常见的绕过方式包括:${IFS}$IFS$9等。。cat /fla?或cat /fl*。Linux 基础。

hengdonghui的博客 131

vue3 markdown编辑框与压缩包文件上传及预览

el-input v-model="form.author" placeholder="作者/组织" maxlength="50" clearable /><el-select v-model="form.category" placeholder="请选择标签" class="full-width"><el-select v-model="form.license" placeholder="请选择" class="full-width">'编辑技能' : '新建技能' }}</div>

每一篇博客都是对自己技术的沉淀 173

使用HTML+CSS+JavaScript实现文件上传弹窗

使用HTML+CSS+JavaScript实现文件上传弹窗

bjzhang75的博客 199

ArkWeb 混合开发的内存清理与桥接陷阱

起初我以为是 H5 内部的定时器没有清理,结果接了 DevEco Studio 的 Profiler 一看,全是 ArkTS 侧的原生对象没有释放。改用 RESIZE 后,键盘弹出只会压缩窗口高度,底部的输入框会自适应滚动到可视区域,页面顶部的元素则岿然不动。综上所述,混合开发绝不是简单的拼接,管好桥接的生命周期,做好跨域兜底,才是稳定运行的前提。如果不去主动干预,它会把你的原生内存吃得连骨头都不剩。在 H5 的输入框打字时,软键盘一弹出来,整个 Web 页面就被顶得飞起,连顶部的原生导航栏都不见了。

2502_91284977的博客 235
上一篇: 手把手教你写项目之个人云盘系统全栈开发---第1篇:开篇!不当“网盘难民”,我们亲手造个云盘
下一篇: 手把手教你写项目之个人云盘系统全栈开发---第3篇:“乾坤大挪移”——文件上传与列表展示的艺术
THMAIL
博客等级 码龄10年 2434粉丝 432原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

THMAIL

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值