热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

Bootstrapfileinput组件封装及使用详解

这篇文章主要介绍了Bootstrapfileinput组件封装及使用的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

介绍

通过本文,你可以学习到如何封装或者开发一个前端组件,同时学习Bootstrap-fileinput组件的使用,封装后使用更加简单方便。

BaseFile是AdminEAP框架中基于Bootstrap-fileinput的附件上传组件,它支持 支持多文件、在线预览、拖拽上传等功能,封装后BaseFile主要包括以下功能:

  • 弹出窗口的附件上传
  • 当前界面的附件上传
  • 显示附件明细
  • 可编辑的附件明细(删除、预览、不可新增)

关于Bootstrap-fileinput的API文档可参考http://plugins.krajee.com/file-input

本文源码已在AdminEAP框架(一个基于AdminLTE的Java开发平台)中开源,可在Github下载相关代码:

Github:https://github.com/bill1012/AdminEAP

AdminEAP官网:http://www.admineap.com

使用说明

1、初始化

如果需要在当前界面使用附件上传功能(非弹窗方式)则需要在头部引入相关的css和js文件

css文件



js文件





form表单上还需要配置enctype="multipart/form-data"属性

2、弹窗方式调用

BaseFile支持弹窗方式打开一个附件上传窗口,点击附件上传后,弹出窗口,上传附件关闭窗口后,上传的附件在type=file的控件回填。

在表单中点击弹窗上传附件:

BaseFile组件

BaseFile组件

上传完毕,关闭窗口,附件回填

再次打开上传附件上传窗口时,会把已有的附件回填到附件上传窗口。

配置如下:

html代码

   
   
上传附件(Max. 10MB)

js代码

$("#uploadFile").file({
   title: "请上传附件",
   fileinput: {
    maxFileSize: 10240,
    maxFileCount:3
   },
   fileIdContainer:"[name='fileIds']",
   showContainer:'#attachment',
   //显示文件类型 edit=可编辑 detail=明细 默认为明细
   showType:'edit',
   //弹出窗口 执行上传附件后的回调函数(window:false不调用此方法)
   window:true,
   callback:function(fileIds,oldfileIds){
    //更新fileIds
    this.showFiles({
     fileIds:fileIds
    });
   }
  });

3、本地界面调用

本地界面调用附件上传,如下图所示:

将上传附件嵌入到当前界面方式

BaseFile组件

上传后的附件可删除、可预览


(目前图片文件可预览,其他文件不可预览,后期将集成txt/xml/html/pdf的预览功能)

配置如下:

html代码

js代码

 $("#attachment").file({
   fileinput: {
    maxFileSize: 10240,
    maxFileCount:3
   },
   fileIdContainer:"[name='fileIds']",
   window:false
  });

4、控件参数说明

window 默认为true,弹窗方式打开

title window=true时配置,弹窗的标题,默认为“文件上传”

width window=true时配置,弹窗的宽度,默认900

winId window=true时配置,弹出的id,默认为fileWin

fileinput Bootstrap-fileinput的配置参数,会覆盖默认配置,比如允许上传哪种类型的附件allowedFileTypes,允许上传最大附件大小maxFileSize,允许上传附件的个数maxFileCount等,具体的配置参数可以查询Bootstrap-fileinput的API文档。

fileIdContainer 必须,上传后的附件id存储的位置,id以逗号分隔

showContainer window=true必须配置,文件上传后回填的区域,window=false时如不配置,则取base-file的初始对象

showType window=true配置,值为edit或者detail,edit表示回填后可对数据进行删除、预览,detail只能显示,不能删除

callback window=true配置,关闭附件上传的窗口后执行的回调函数(比如更新当前的文件列表),fileIds,oldfileIds两个参数分别是更新后文件ids和更新前的文件ids

BaseFile默认配置,BaseFile的更多实现,请查看BaseFile源码

BaseFile.prototype.default = {
  winId: "fileWin",
  width: 900,
  title: "文件上传",
  //通用文件上传界面
  url: basePath + "/file/uploader",
  //默认支持多文件上传
  multiple: true,
  //默认弹出附件上传窗口
  window:true,
  showType:"detail",
  fileinput: {
   language: 'zh',
   uploadUrl: basePath + "/file/uploadMultipleFile",
   deleteUrl:basePath+"/file/delete",
   uploadAsync:false,
   validateInitialCount:true,
   overwriteInitial: false,
   allowedPreviewTypes: ['image'],
   previewFileIcon:'',
   previewFileIconSettings: null,
   slugCallback: function (text) {
    var newtext=(!text||text=='') &#63; '' : String(text).replace(/[\-\[\]\/\{}:;#%=\(\)\*\+\&#63;\\\^\$\|<>&"']/g, '_');
    //去除空格
    return newtext.replace(/(^\s+)|(\s+$)/g,"").replace(/\s/g,"");
   }
  }
 }

5、BaseFile控件源码

/**
 * 通用文件管理组件
 * @author billjiang qq:475572229
 */
(function ($, window, document, undefined) {
 'use strict';

 var pluginName = 'file';

 $.fn[pluginName] = function (options) {
  var self = $(this);
  if (this == null)
   return null;
  var data = this.data(pluginName);
  if (!data) {
   data = new BaseFile(this, $.extend(true, {}, options));
   self.data(pluginName, data);
  }
 };


 var BaseFile = function (element, options) {
  this.element = element;
  //extend优先级 后面的会覆盖前面的
  //alert(this.element.selector);
  //将容器ID传过去便于弹窗获取到BaseFile对象,如果页面布局不在使用jquery.load方法,则该方法会失效,因为不是一个页面了
  options.cOntainer= options.container || this.element.selector.replace("#", "");
  //初始化文件图标信息
  this.getFileIconSettings();
  this.optiOns= $.extend(true, {}, this.default, options);
  //初始化图标信息
  this.initFileIds();

  if(this.options.window) {
   this.element.click(function () {
    $(this).data('file').openWin();
   });
  }else{
   //非弹窗形式
   if(this.options.multiple)
    this.element.attr("multiple","multiple");
  }

  //如果配置了附件编辑容器showContainer(附件列表,可单个删除),则进行初始化
  if(this.hasDisplayZone()){
   this.showFiles();
  }


 }

 BaseFile.prototype.default = {
  winId: "fileWin",
  width: 900,
  title: "文件上传",
  //通用文件上传界面
  url: basePath + "/file/uploader",
  //默认支持多文件上传
  multiple: true,
  //默认弹出附件上传窗口
  window:true,
  showType:"detail",
  fileinput: {
   language: 'zh',
   uploadUrl: basePath + "/file/uploadMultipleFile",
   deleteUrl:basePath+"/file/delete",
   uploadAsync:false,
   validateInitialCount:true,
   overwriteInitial: false,
   allowedPreviewTypes: ['image'],
   previewFileIcon:'',
   previewFileIconSettings: null,
   slugCallback: function (text) {
    var newtext=(!text||text=='') &#63; '' : String(text).replace(/[\-\[\]\/\{}:;#%=\(\)\*\+\&#63;\\\^\$\|<>&"']/g, '_');
    //去除空格
    return newtext.replace(/(^\s+)|(\s+$)/g,"").replace(/\s/g,"");
   }
  }
 }

 BaseFile.prototype.getFileInputCOnfig=function () {
  return this.options.fileinput;
 }
 BaseFile.prototype.getFileIcOnSettings= function () {
  var self = this;
  ajaxPost(basePath + "/file/icons", null, function (icons) {
   self.previewFileIcOnSettings= icons;
   //console.log(self.previewFileIconSettings);
  })
 }


 BaseFile.prototype.openWin = function () {
  var that = this;
  var self = $.extend(true, {}, this.options);
  //深拷贝后删除属性,这样不会通过后台传送过去,防止被XSS过滤掉特殊字符
  //不需要通过参数cOnfig=传递到弹窗的参数可使用delete删除
  delete self.callback;
  delete self.fileIds;
  delete self.showContainer;
  delete self.fileIdContainer;
  delete self.fileinput;

  /*console.log(this.options);
   console.log("=============");
   console.log(self);*/
  modals.openWin({
   winId: that.options.winId,
   url: that.options.url + "&#63;cOnfig=" + JSON.stringify(self),
   width: that.options.width + "px",
   title: that.options.title,
   backdrop: "static"
  });
 }

 BaseFile.prototype.callbackHandler = function (fileIds) {
  //更新fileIds并执行回调函数
  var oldfileIds = this.options.fileIds;
  this.options.fileIds = fileIds;
  this.updateFileIds();
  if (this.options.callback) {
   this.options.callback.call(this, fileIds, oldfileIds);
  }
 }

 //调用成功后执行显示附件
 BaseFile.prototype.showFiles=function(options){
  optiOns=options||{};
  if(!this.hasDisplayZone()){
   modals.error("请配置showContainer属性,并在容器下配置type=file的input组件");
   return;
  }
  var fileIds=options.fileIds||this.options.fileIds;
  if(!fileIds&&this.options.window){
   $(this.options.showContainer).hide();
   return;
  }
  //显示
  $(this.options.showContainer).show();
  var fileCompOnet=$(this.options.showContainer);
  var fileResult=this.getFileResult(fileIds),preview=fileResult.initialPreview,previewCOnfig=fileResult.initialPreviewConfig,self=this;
  //配置三类参数 edit=附件列表(可删除) detail=附件列表(显示) 可上传
  var defaultCOnfig={
   initialPreview:preview,
   initialPreviewConfig:previewConfig
  };
  var config;
  if(this.options.window){
   if(this.options.showType=="edit"){
    //全局配置->本方法默认配置->edit属性下配置->外部参数
    cOnfig=$.extend({},self.options.fileinput,defaultConfig,{
     showRemove:false,
     showUpload:false,
     showClose:false,
     showBrowse:false,
     showCaption:false
    },options);
   }else if(this.options.showType=="detail"){
    cOnfig=$.extend({},self.options.fileinput,defaultConfig,{
     showRemove:false,
     showUpload:false,
     showClose:false,
     showBrowse:false,
     showCaption:false,
     initialPreviewShowDelete:false
    },options);
   }
  }else{
   cOnfig=$.extend({},self.options.fileinput,defaultConfig,{
    showClose:false
   },options);
  }

  if(!config){
   modals.error("未找到showFiles中的相关配置");
   return;
  }
  //console.log("cOnfig=========="+JSON.stringify(config));
  fileComponet.fileinput('destroy');
  fileComponet.fileinput(config).on("filedeleted",function (event,key) {
   var newfids=self.deleteFileIds(key,self.options.fileIds);
   self.options.fileIds=newfids;
   self.updateFileIds();
  }).on("fileuploaded",function(event,data,previewId,index){
   var newfids=self.addFileIds(data.response.fileIds,self.options.fileIds);
   self.options.fileIds=newfids;
   self.updateFileIds();
  }).on("filebatchuploadsuccess",function (event,data,previewId,index) {
   var newfids=self.addFileIds(data.response.fileIds,self.options.fileIds);
   self.options.fileIds=newfids;
   self.updateFileIds();
  }).on("filezoomhidden", function(event, params) {
   $(document.body).removeClass('modal-open');
   $(document.body).css("padding-right","0px");
  });
 }

 /**
  * 向targetIds里删除数据fileIds
  * @param fileIds
  * @param targetIds
  */
 BaseFile.prototype.deleteFileIds=function(fileIds,targetIds){
  if(!fileIds) return targetIds;
  //没有文件删除,其中必有蹊跷
  if(!targetIds){
   modals.error("没有要删除的文件,请检查是否数据没有初始化");
   return;
  }
  var fileIdArr=fileIds.split(",");
  var fresult=targetIds.split(",");
  $.each(fileIdArr,function (index,fileId){
   //存在则删除
   if($.inArray(fileId,fresult)>-1){
    fresult.splice($.inArray(fileId,fresult),1);
   }
  })
  return fresult.join();
 }

 /**
  * 向targetIds里加数据fileIds
  * @param fileIds
  * @param targetIds
  */
 BaseFile.prototype.addFileIds=function (fileIds,targetIds) {
  if(!fileIds)return targetIds;
  var fileIdArr=fileIds.split(",");
  var fresult=[];
  if(targetIds){
   fresult=targetIds.split(",");
  }
  $.each(fileIdArr,function (index,fileId){
   //不存在,新增
   if($.inArray(fileId,fresult)==-1){
    fresult.push(fileId);
   }
  })
  return fresult.join();
 }

 BaseFile.prototype.updateFileIds=function(){
  if(this.options.fileIdContainer)
   $(this.options.fileIdContainer).val(this.options.fileIds);
 }

 BaseFile.prototype.initFileIds=function(){
  //不弹出窗口的话一定要绑定fileIdContainer
  if(!this.options.window){
   if(!this.options.fileIdContainer||!$(this.options.fileIdContainer)){
    modals.info("请设置fileIdContainer属性");
    return;
   }
  }
  if(!this.options.fileIds){
   if(this.options.fileIdContainer){
    this.options.fileIds=$(this.options.fileIdContainer).val();
   }
  }
 }

 BaseFile.prototype.getFileResult=function(fileIds){
  var ret=null;
  ajaxPost(basePath+"/file/getFiles",{fileIds:fileIds},function(result){
   ret=result;
  });
  return ret;
 };

 /**
  * 是否有显示区域
  * @returns {boolean}
  */
 BaseFile.prototype.hasDisplayZOne=function(){
  if(!this.options.showContainer){
   this.options.showCOntainer=this.element.selector;
  }
  if(!this.options.showContainer||!$(this.options.showContainer)){
   return false;
  }
  return true;
 }


})(jQuery, window, document);

6、后端源码

package com.cnpc.framework.base.controller;


import com.cnpc.framework.base.entity.SysFile;
import com.cnpc.framework.base.entity.User;
import com.cnpc.framework.base.pojo.AvatarResult;
import com.cnpc.framework.base.pojo.FileResult;
import com.cnpc.framework.base.pojo.MarkDownResult;
import com.cnpc.framework.base.pojo.Result;
import com.cnpc.framework.base.service.UploaderService;
import com.cnpc.framework.util.SecurityUtil;
import com.cnpc.framework.utils.DateUtil;
import com.cnpc.framework.utils.FileUtil;
import com.cnpc.framework.utils.PropertiesUtil;
import com.cnpc.framework.utils.StrUtil;
import org.apache.commons.fileupload.util.Streams;
import org.hibernate.criterion.DetachedCriteria;
import org.hibernate.criterion.Order;
import org.hibernate.criterion.Restrictions;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;

import javax.annotation.Resource;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.*;
import java.util.*;

@Controller
@RequestMapping("/file")
public class UploaderController {

 private static Logger logger= LoggerFactory.getLogger(UploaderController.class);

 //previewFileIconSettings
 public static Map fileIcOnMap=new HashMap();
 @Resource
 private UploaderService uploaderService;

 static {
  fileIconMap.put("doc" ,"");
  fileIconMap.put("docx","");
  fileIconMap.put("xls" ,"");
  fileIconMap.put("xlsx","");
  fileIconMap.put("ppt" ,"");
  fileIconMap.put("pptx","");
  fileIconMap.put("jpg" ,"");
  fileIconMap.put("pdf" ,"");
  fileIconMap.put("zip" ,"");
  fileIconMap.put("rar" ,"");
  fileIconMap.put("default" ,"");
 }

 //从setting.properties文件中注入文件相对目录(相对目录为显示文件)
 //@Value("${uploaderPath}") 只有配置@Config才能注入
 private static final String uploaderPath=PropertiesUtil.getValue("uploaderPath");


 /**
  * 跳转到通用文件上传窗口
  * @return
  */
 @RequestMapping(value="/uploader",method = RequestMethod.GET)
 public String uploader(String config,HttpServletRequest request){
  request.setAttribute("config",config);
  return "base/file/file_uploader";
 }


 /**
  * 通用文件上传接口,存储到固定地址,以后存储到文件服务器地址
  */
 @RequestMapping(value = "/uploadFile", method = RequestMethod.POST)
 @ResponseBody
 public SysFile uploadFile(@RequestParam(value = "file", required = false) MultipartFile file,
        HttpServletRequest request, HttpServletResponse response) {
  //TODO dosomething
  return new SysFile();
 }

 /**
  * 多文件上传,用于uploadAsync=false(同步多文件上传使用)
  * @param files
  * @param request
  * @param response
  * @return
  */
 @RequestMapping(value = "/uploadMultipleFile", method = RequestMethod.POST)
 @ResponseBody
 public FileResult uploadMultipleFile(@RequestParam(value = "file", required = false) MultipartFile[] files,
           HttpServletRequest request, HttpServletResponse response) throws IOException {
  System.out.println("the num of file:"+files.length);

  FileResult msg = new FileResult();

  ArrayList arr = new ArrayList<>();
  //缓存当前的文件
  List fileList=new ArrayList<>();
  String dirPath = request.getRealPath("/");
  for (int i = 0; i \n" +
       "\n" +
       "
");*/ logger.info("Server File Location=" + serverFile.getAbsolutePath()); } catch (Exception e) { logger.error( file.getOriginalFilename()+"上传发生异常,异常原因:"+e.getMessage()); arr.add(i); } finally { if (out != null) { out.close(); } if (in != null) { in.close(); } } } else { arr.add(i); } } if(arr.size() > 0) { msg.setError("文件上传失败!"); msg.setErrorkeys(arr); } FileResult preview=getPreivewSettings(fileList,request); msg.setInitialPreview(preview.getInitialPreview()); msg.setInitialPreviewConfig(preview.getInitialPreviewConfig()); msg.setFileIds(preview.getFileIds()); return msg; } //删除某一项文件 @RequestMapping(value="/delete",method = RequestMethod.POST) @ResponseBody public Result delete(String id,HttpServletRequest request){ SysFile sysFile=uploaderService.get(SysFile.class,id); String dirPath=request.getRealPath("/"); FileUtil.delFile(dirPath+uploaderPath+File.separator+sysFile.getSavedName()); uploaderService.delete(sysFile); return new Result(); } /** * 获取字体图标map,base-file控件使用 */ @RequestMapping(value="/icons",method = RequestMethod.POST) @ResponseBody public Map getIcons(){ return fileIconMap; } /** * 根据文件名获取icon * @param fileName 文件 * @return */ public String getFileIcon(String fileName){ String ext= StrUtil.getExtName(fileName); return fileIconMap.get(ext)==null&#63;fileIconMap.get("default").toString():fileIconMap.get(ext).toString(); } /** * 根据附件IDS 获取文件 * @param fileIds * @param request * @return */ @RequestMapping(value="/getFiles",method = RequestMethod.POST) @ResponseBody public FileResult getFiles(String fileIds,HttpServletRequest request){ String[] fileIdArr=fileIds.split(","); DetachedCriteria criteria=DetachedCriteria.forClass(SysFile.class); criteria.add(Restrictions.in("id",fileIdArr)); criteria.addOrder(Order.asc("createDateTime")); List fileList=uploaderService.findByCriteria(criteria); return getPreivewSettings(fileList,request); } /** * 回填已有文件的缩略图 * @param fileList 文件列表 * @param request * @return initialPreiview initialPreviewConfig fileIds */ public FileResult getPreivewSettings(List fileList,HttpServletRequest request){ FileResult fileResult=new FileResult(); List previews=new ArrayList<>(); List previewCOnfigs=new ArrayList<>(); //缓存当前的文件 String dirPath = request.getRealPath("/"); String[] fileArr=new String[fileList.size()]; int index=0; for (SysFile sysFile : fileList) { //上传后预览 TODO 该预览样式暂时不支持theme:explorer的样式,后续可以再次扩展 //如果其他文件可预览txt、xml、html、pdf等 可在此配置 if(FileUtil.isImage(dirPath+uploaderPath+File.separator+sysFile.getSavedName())) { previews.add("" + sysFile.getFileName() + " title="); }else{ previews.add("
" + ""+getFileIcon(sysFile.getFileName())+"
"); } //上传后预览配置 FileResult.PreviewConfig previewCOnfig=new FileResult.PreviewConfig(); previewConfig.setWidth("120px"); previewConfig.setCaption(sysFile.getFileName()); previewConfig.setKey(sysFile.getId()); // previewConfig.setUrl(request.getContextPath()+"/file/delete"); previewConfig.setExtra(new FileResult.PreviewConfig.Extra(sysFile.getId())); previewConfig.setSize(sysFile.getFileSize()); previewConfigs.add(previewConfig); fileArr[index++]=sysFile.getId(); } fileResult.setInitialPreview(previews); fileResult.setInitialPreviewConfig(previewConfigs); fileResult.setFileIds(StrUtil.join(fileArr)); return fileResult; } }

总结

本文源码已在AdminEAP框架(一个基于AdminLTE的Java开发平台)中开源,可在Github下载相关代码:

Github:https://github.com/bill1012/AdminEAP

AdminEAP官网:http://www.admineap.com

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


推荐阅读
  • 本文详细解析了JSONP(JSON with Padding)的跨域机制及其工作原理。JSONP是一种通过动态创建``标签来实现跨域请求的技术,其核心在于利用了浏览器对``标签的宽松同源策略。文章不仅介绍了JSONP的产生背景,还深入探讨了其具体实现过程,包括如何构造请求、服务器端如何响应以及客户端如何处理返回的数据。此外,还分析了JSONP的优势和局限性,帮助读者全面理解这一技术在现代Web开发中的应用。 ... [详细]
  • 《精通 jQuery》第六章:深入解析与实战应用
    《精通 jQuery》第六章:深入解析与实战应用本章详细探讨了 Ajax 技术的核心机制及其实际应用。Ajax 通过 XMLHttpRequest 对象实现客户端与服务器之间的异步数据交换,从而在不重新加载整个页面的情况下更新部分内容。这种技术不仅提升了用户体验,还提高了应用的响应速度和效率。此外,本章还介绍了如何利用 jQuery 简化 Ajax 操作,并提供了多个实战案例,帮助读者更好地理解和掌握这一重要技术。 ... [详细]
  • 作为140字符的开创者,Twitter看似简单却异常复杂。其简洁之处在于仅用140个字符就能实现信息的高效传播,甚至在多次全球性事件中超越传统媒体的速度。然而,为了支持2亿用户的高效使用,其背后的技术架构和系统设计则极为复杂,涉及高并发处理、数据存储和实时传输等多个技术挑战。 ... [详细]
  • 本文介绍了如何通过掌握 IScroll 技巧来实现流畅的上拉加载和下拉刷新功能。首先,需要按正确的顺序引入相关文件:1. Zepto;2. iScroll.js;3. scroll-probe.js。此外,还提供了完整的代码示例,可在 GitHub 仓库中查看。通过这些步骤,开发者可以轻松实现高效、流畅的滚动效果,提升用户体验。 ... [详细]
  • Django框架进阶教程:掌握Ajax请求的基础知识与应用技巧
    本教程深入探讨了Django框架中Ajax请求的核心概念与实用技巧,帮助开发者掌握异步数据交互的方法,提升Web应用的响应速度和用户体验。通过实例解析,详细介绍了如何在Django项目中高效实现Ajax请求,涵盖从基础配置到复杂场景的应用。 ... [详细]
  • 在CentOS 7上部署WebRTC网关Janus
    在CentOS 7上部署WebRTC网关Janus ... [详细]
  • 如何在PHP中嵌入JavaScript(2023年最新实践指南) ... [详细]
  • Go 项目中数据库配置文件的优化与应用 ... [详细]
  • 在订单服务启动过程中,首先会从Eureka服务器中查找已注册的配置中心,随后从Gitee配置仓库中获取特定的 `order-test.yml` 文件,以确保服务能够正确加载所需的配置信息。这一流程保证了配置管理的灵活性和可维护性。 ... [详细]
  • 深入解析Spring Boot启动过程中Netty异步架构的工作原理与应用
    深入解析Spring Boot启动过程中Netty异步架构的工作原理与应用 ... [详细]
  • 本项目在Java Maven框架下,利用POI库实现了Excel数据的高效导入与导出功能。通过优化数据处理流程,提升了数据操作的性能和稳定性。项目已发布至GitHub,当前最新版本为0.0.5。该项目不仅适用于小型应用,也可扩展用于大型企业级系统,提供了灵活的数据管理解决方案。GitHub地址:https://github.com/83945105/holygrail,Maven坐标:`com.github.83945105:holygrail:0.0.5`。 ... [详细]
  • 本文介绍了使用 Python 编程语言高效抓取微博文本和动态网页图像数据的方法。通过详细的示例代码,展示了如何利用爬虫技术获取微博内容和动态图片,为数据采集和分析提供了实用的技术支持。对于对网络数据抓取感兴趣的读者,本文具有较高的参考价值。 ... [详细]
  • 深入解析Tomcat:开发者的实用指南
    深入解析Tomcat:开发者的实用指南 ... [详细]
  • 在Laravel中实现PHP对JSON数据的发布与处理 ... [详细]
  • 构建顶级PHP博客系统:实践与洞见
    构建顶级PHP博客系统不仅需要扎实的技术基础,还需深入理解实际应用需求。本文以Zend Studio为开发环境,MySQL作为数据存储,Apache服务器为运行平台,结合jQuery脚本语言,详细阐述了从环境搭建到功能实现的全过程,分享了开发PHP博客管理系统的宝贵经验和实用技巧。 ... [详细]
author-avatar
幸福-一路向南_654
这个家伙很懒,什么也没留下!
Tags | 热门标签
RankList | 热门文章
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有