企业官网建设流程全解析

济南集团网站建设方案,头像设计易做图网站,电商运营培训班,网站建设86215北京码农の10G文件上传奇遇#xff1a;在胡同里写信创代码 各位好#xff0c;我是老张#xff0c;北京中关村某软件公司“脱发攻坚队”队长。最近接了个政府项目#xff0c;要求上传10G文件#xff0c;还必须兼容信创环境并提供全套文档——这活儿就像在故宫里装Wi-Fi在胡同里写信创代码各位好我是老张北京中关村某软件公司“脱发攻坚队”队长。最近接了个政府项目要求上传10G文件还必须兼容信创环境并提供全套文档——这活儿就像在故宫里装Wi-Fi既要保持古风古韵又要让5G信号覆盖御花园一、开源组件の“坟场”探险WebUploaderの安魂曲这货停更得比簋街小龙虾还彻底分片上传在统信UOS上直接表演“自由落体”进度条卡得比早高峰地铁还瓷实。其他组件の“三无”体验无文档看源码像破译甲骨文无维护GitHub issue区比护城河还安静无信创适配在飞腾浏览器里跑起来比让熊猫骑三轮还费劲二、自研方案の“胡同版”实现经过三天三夜与项目经理的“友好切磋”我们决定自己造个“三轮车”以下是核心代码Vue JSP版前端核心代码Vue组件// FileUploader.vue - 专为信创环境定制的“胡同三轮车”上传组件exportdefault{data(){return{chunkSize:16*1024*1024,// 16MB分片适配国产服务器fileMd5:,uploadUrl:/FileUploadServlet,// JSP后端接口mergeUrl:/FileMergeServlet,govMode:/UOS|Kylin|Loongson/.test(navigator.userAgent),// 国产系统检测concurrent:2// 信创环境并发数默认2避免服务器宕机};},methods:{// 计算文件MD5支持国密算法降级asynccalculateFileHash(file){returnnewPromise((resolve){if(window.SM2window.SM3){// 优先使用国产密码库constreadernewFileReader();reader.onload(e){try{consthashwindow.SM3(e.target.result);resolve(sm3:${hash});}catch{resolve(mock-hash-${file.name}-${file.size});// 审核模式降级方案}};reader.readAsArrayBuffer(file.slice(0,2*1024*1024));// 只读前2MB}else{// 降级方案实际项目中需替换为合规算法console.warn(使用非国密算法仅供演示);resolve(md5:${file.name.replace(/\./g,)}-${file.size%1000});}});},// 分片上传带“胡同网络”优化asyncuploadChunk(file,chunkIndex){conststartchunkIndex*this.chunkSize;constendMath.min(file.size,startthis.chunkSize);constchunkfile.slice(start,end);constformDatanewFormData();formData.append(file,newBlob([chunk]));formData.append(chunkIndex,chunkIndex);formData.append(totalChunks,Math.ceil(file.size/this.chunkSize));formData.append(fileHash,this.fileMd5);formData.append(fileName,file.name);// 信创环境特殊配置constconfig{headers:{X-Gov-Env:this.govMode?true:false},timeout:this.govMode?300000:60000,// 信创网络延迟高onUploadProgress:(progressEvent){this.$emit(chunk-progress,{index:chunkIndex,loaded:progressEvent.loaded,total:progressEvent.total});}};try{constresponseawaitaxios.post(this.uploadUrl,formData,config);returnresponse.data;}catch(error){if(this.govModeerror.codeECONNABORTED){this.$emit(network-warning,信创网络波动启动“胡同重试机制”...);awaitnewPromise(resolvesetTimeout(resolve,5000));// 信创环境重试间隔returnthis.uploadChunk(file,chunkIndex);// 无限重试}throwerror;}},// 主上传方法带“四合院”进度管理asyncstartUpload(file){this.fileMd5awaitthis.calculateFileHash(file);consttotalChunksMath.ceil(file.size/this.chunkSize);this.$emit(upload-start,{total:totalChunks});// 并发控制避免信创服务器“宕机”constuploading[];for(leti0;itotalChunks;i){if(uploading.lengththis.concurrent){awaitPromise.race(uploading);}uploading.push(this.uploadChunk(file,i).finally((){constindexuploading.indexOf(this.uploadChunk);if(index-1)uploading.splice(index,1);}));}awaitPromise.all(uploading);// 触发合并请求constmergeResultawaitaxios.post(this.mergeUrl,{fileHash:this.fileMd5,fileName:file.name,totalChunks});this.$emit(upload-complete,mergeResult.data);returnmergeResult.data;}}};三、JSP后端の“胡同串儿”实现1. 文件分片接收Servlet (FileUploadServlet.java)WebServlet(/FileUploadServlet)MultipartConfig(fileSizeThreshold1024*1024*10,// 10MB内存缓冲maxFileSize1024*1024*100,// 100MB单文件限制maxRequestSize1024*1024*500// 500MB总请求限制)publicclassFileUploadServletextendsHttpServlet{protectedvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{// 1. 获取参数StringfileHashrequest.getParameter(fileHash);intchunkIndexInteger.parseInt(request.getParameter(chunkIndex));inttotalChunksInteger.parseInt(request.getParameter(totalChunks));StringfileNamerequest.getParameter(fileName);// 2. 保存分片到临时目录信创环境需适配PartfilePartrequest.getPart(file);StringtempDirSystem.getProperty(gov.temp.dir,/tmp/gov_upload);FilechunkFilenewFile(tempDir,fileHash_chunkIndex);try(InputStreaminputfilePart.getInputStream();OutputStreamoutputnewFileOutputStream(chunkFile)){byte[]buffernewbyte[1024*1024];// 1MB缓冲区intbytesRead;while((bytesReadinput.read(buffer))!-1){output.write(buffer,0,bytesRead);}}// 3. 返回结果信创环境需简化JSONresponse.setContentType(application/json);response.setCharacterEncoding(UTF-8);response.getWriter().write(String.format({\success\:true,\chunkIndex\:%d,\message\:\分片已存入四合院\},chunkIndex));}}2. 文件合并Servlet (FileMergeServlet.java)WebServlet(/FileMergeServlet)publicclassFileMergeServletextendsHttpServlet{protectedvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)throwsServletException,IOException{// 1. 获取参数StringfileHashrequest.getParameter(fileHash);StringfileNamerequest.getParameter(fileName);inttotalChunksInteger.parseInt(request.getParameter(totalChunks));// 2. 合并文件信创环境用Java NIO优化StringtempDirSystem.getProperty(gov.temp.dir,/tmp/gov_upload);StringfinalDirSystem.getProperty(gov.final.dir,/data/gov_files);FilemergedFilenewFile(finalDir,fileName);try(FileChanneloutChannelnewFileOutputStream(mergedFile,false).getChannel()){for(inti0;itotalChunks;i){FilechunkFilenewFile(tempDir,fileHash_i);try(FileChannelinChannelnewFileInputStream(chunkFile).getChannel()){inChannel.transferTo(0,inChannel.size(),outChannel);}chunkFile.delete();// 清理临时文件}}// 3. 返回结果response.setContentType(application/json);response.getWriter().write(String.format({\success\:true,\fileUrl\:\/download/%s\,\message\:\文件已存入四合院\},fileName));}}四、信创环境の“生存指南”浏览器适配// 在main.js中添加信创环境检测Vue.prototype.$isGovBrowser(){constuanavigator.userAgent.toLowerCase();returnua.includes(uos)||ua.includes(kylin)||ua.includes(loongson);};文件系统适配// 信创环境路径适配工具类publicclassGovPathUtil{publicstaticStringgetTempDir(){StringosSystem.getProperty(os.name).toLowerCase();if(os.contains(linux)System.getenv(GOV_ENV)!null){return/opt/gov_upload;// 信创专用路径}returnSystem.getProperty(java.io.tmpdir);}}并发控制// 根据运行环境动态调整并发数if(this.$isGovBrowser()){this.concurrent2;// 信创服务器“心脏不好”}else{this.concurrent5;// 普通服务器“身强力壮”}五、项目の“胡同文档”清单《10G文件上传系统设计文档》含架构图、时序图、信创适配说明《Vue前端开发手册》含组件API、事件说明、信创环境调试技巧《JSP后端接口文档》含Servlet配置、参数说明、错误码定义《信创环境部署指南》含麒麟/统信系统配置、国密算法集成步骤六、现状与吐槽目前这个方案已经通过飞腾浏览器兼容性测试在银河麒麟服务器上稳定运行代码100%开源注释全是“京片子”风格获得客户“比政务大厅WiFi还稳定”的评价唯一的问题是测试时把单位内网带宽占满现在IT部门看到我就喊“老张啊你那个上传组件能不能限制下速度啊我们OA系统要跑不动了…”附实际项目建议用国产中间件如华为云OBS SDK或阿里云OSS信创版但既然客户要求自研那我们就把“三轮车”改造成“复兴号”将组件复制到项目中示例中已经包含此目录引入组件配置接口地址接口地址分别对应文件初始化文件数据上传文件进度文件上传完毕文件删除文件夹初始化文件夹删除文件列表参考http://www.ncmem.com/doc/view.aspx?ide1f49f3e1d4742e19135e00bd41fa3de处理事件启动测试启动成功效果数据库效果预览文件上传文件刷新续传支持离线保存文件进度在关闭浏览器刷新浏览器后进行不丢失仍然能够继续上传文件夹上传支持上传文件夹并保留层级结构同样支持进度信息离线保存刷新页面关闭页面重启系统不丢失上传进度。批量下载支持文件批量下载下载续传文件下载支持离线保存进度信息刷新页面关闭页面重启系统均不会丢失进度信息。文件夹下载支持下载文件夹并保留层级结构不打包不占用服务器资源。下载示例点击下载完整示例