红99
红99

【实战】前端实现电子签名（web、移动端）通用组件

参考：https://mp.weixin.qq.com/s/Q_fauZiauj06GneBrUQKtg

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
    </style>
</head>
<body>
    <canvas></canvas>
    <div>
        <button onclick="cancel()">取消</button>
        <button onclick="save()">保存</button>
    </div>
</body>
<script>
    // 配置内容
    const config = {
        width: 400, // 宽度
        height: 200, // 高度
        lineWidth: 5, // 线宽
        strokeStyle: 'red', // 线条颜色
        lineCap: 'round', // 设置线条两端圆角
        lineJoin: 'round', // 线条交汇处圆角
    }

    // 获取canvas 实例
    const canvas = document.querySelector('canvas')
    // 设置宽高
    canvas.width = config.width
    canvas.height = config.height
    // 设置一个边框
    canvas.style.border = '1px solid #000'
    // 创建上下文
    const ctx = canvas.getContext('2d')

    // 设置填充背景色
    ctx.fillStyle = 'transparent'
    // 绘制填充矩形
    ctx.fillRect(
        0, // x 轴起始绘制位置
        0, // y 轴起始绘制位置
        config.width, // 宽度
        config.height // 高度
    );

    // 保存上次绘制的 坐标及偏移量
    const client = {
        offsetX: 0, // 偏移量
        offsetY: 0,
        endX: 0, // 坐标
        endY: 0
    }

    // 判断是否为移动端
    const mobileStatus = (/Mobile|Android|iPhone/i.test(navigator.userAgent))

    // 初始化
    const init = event => {
        // 获取偏移量及坐标
        const { offsetX, offsetY, pageX, pageY } = mobileStatus ? event.changedTouches[0] : event 

        // 修改上次的偏移量及坐标
        client.offsetX = offsetX
        client.offsetY = offsetY
        client.endX = pageX
        client.endY = pageY

        // 清除以上一次 beginPath 之后的所有路径，进行绘制
        ctx.beginPath()
        // 根据配置文件设置相应配置
        ctx.lineWidth = config.lineWidth
        ctx.strokeStyle = config.strokeStyle
        ctx.lineCap = config.lineCap
        ctx.lineJoin = config.lineJoin
        // 设置画线起始点位
        ctx.moveTo(client.endX, client.endY)
        // 监听 鼠标移动或手势移动
        window.addEventListener(mobileStatus ? "touchmove" : "mousemove", draw)
    }
    // 绘制
    const draw = event => {
        // 获取当前坐标点位
        const { pageX, pageY } = mobileStatus ? event.changedTouches[0] : event
        // 修改最后一次绘制的坐标点
        client.endX = pageX
        client.endY = pageY

        // 根据坐标点位移动添加线条
        ctx.lineTo(pageX , pageY )

        // 绘制
        ctx.stroke()
    }
    // 结束绘制
    const cloaseDraw = () => {
        // 结束绘制
        ctx.closePath()
        // 移除鼠标移动或手势移动监听器
        window.removeEventListener("mousemove", draw)
    }
    // 创建鼠标/手势按下监听器
    window.addEventListener(mobileStatus ? "touchstart" : "mousedown", init)
    // 创建鼠标/手势 弹起/离开 监听器
    window.addEventListener(mobileStatus ? "touchend" :"mouseup", cloaseDraw)
    
    // 取消-清空画布
    const cancel = () => {
        // 清空当前画布上的所有绘制内容
        ctx.clearRect(0, 0, config.width, config.height)
    }
    // 保存-将画布内容保存为图片
    const save = () => {
        // 将canvas上的内容转成blob流
        canvas.toBlob(blob => {
            // 获取当前时间并转成字符串，用来当做文件名
            const date = Date.now().toString()
            // 创建一个 a 标签
            const a = document.createElement('a')
            // 设置 a 标签的下载文件名
            a.download = `${date}.png`
            // 设置 a 标签的跳转路径为 文件流地址
            a.href = URL.createObjectURL(blob)
            // 手动触发 a 标签的点击事件
            a.click()
            // 移除 a 标签
            a.remove()
        })
    }
</script>
</html>

你可能感兴趣的:(study,前端,javascript,开发语言)

  • Angular 17与Material Design 3的结合之旅 t0_54program 编程问题解决手册angular.js前端javascript个人开发
    引言随着前端技术的不断发展，用户界面的设计和体验变得越来越重要。MaterialDesign3作为谷歌推出的最新设计语言，其简洁、直观的设计理念吸引了众多开发者的关注。特别是对于Angular开发者来说，如何将MaterialDesign3与Angular框架无缝结合是一个值得探讨的问题。本文将带你一步一步了解如何在Angular17中使用MaterialDesign3组件。准备工作在开始之前，我
  • Go语言 vs Java语言：核心差异与适用场景解析 By北阳 golangjava开发语言
    在当今的软件开发领域，Go（Golang）和Java都是备受关注的后端开发语言。尽管二者都能构建高性能服务，但它们在设计哲学、语法特性和应用场景上存在显著差异。本文将从多个维度对比这两种语言，帮助开发者更好地理解它们的优缺点，并为技术选型提供参考。一、设计哲学与语言定位1.Go语言定位：专为高并发、分布式系统设计，强调简洁性和高效性。特点：语法简单，学习曲线平缓。静态编译为单一二进制文件，部署便捷
  • Maven 的核心包 旷野说 mavenjava
    由于前端项目不是核心，阅读nexus-public源代码似乎绕远路了。nexus-oss社区版主要就是集成maven的上传包、认证、包解析、包存储这几个核心功能，前端实现重新可以使用新的现代前端工具来提高生产力。故重新疏理一下maven的核心机制，即要深入解析Maven的源代码，需要结合其核心设计思想、模块架构和实际运行机制。一、前置知识准备Maven基础熟悉pom.xml结构、生命周期（Life
  • JavaScript基础-创建对象的三种方式 難釋懷 javascript开发语言
    在JavaScript编程中，对象（Object）是构建复杂数据结构和实现面向对象编程的基础。了解如何有效地创建对象对于编写高效、可维护的代码至关重要。本文将介绍三种主要的创建对象的方式：对象字面量、构造函数模式以及Object.create()方法，并讨论它们的特点及适用场景。一、使用对象字面量1.简介对象字面量是最简单直接的创建对象的方法。它允许你以一种非常直观的方式定义属性和方法。示例：le
  • 探索DeepSeek：前端开发者不可错过的新一代AI技术实践指南 formerlyai 人工智能前端
    引言：为什么DeepSeek成为技术圈焦点？最近，国产AI模型DeepSeek凭借其低成本训练、高性能输出和开源策略，迅速成为开发者社区的热门话题。作为覆盖语言、代码、视觉的多模态技术矩阵，DeepSeek不仅实现了与ChatGPT相媲美的能力，还通过强化学习驱动的架构创新，解决了大模型落地中的成本与效率瓶颈。对于前端开发者而言，DeepSeek的API接入能力和私有化部署方案，为智能应用开发提供
  • Android adb shell报错：more than one device/emulator li-yizhi Androidadbandroid
    使用环境：一台电脑（win10），一个模拟器（mumu）报错过程在cmd中运行adbkill-serveradbconnect127.0.0.1:7555startstudy.pyadbshell出现报错morethanonedevice/emulator查找原因C:\Users\neo>adbdevicesListofdevicesattached10.192.229.32:
  • 一篇文章让你实现前端JS 、 Golang 、 Python如何接入DeepSeek大模型实现自己的AI 一只理智恩 AI前端后端pythongolangjavascript
    本文将通过三种技术栈实现与DeepSeek大模型的对话交互，提供可直接运行的代码示例及详细注释。一、通用准备步骤1.获取API密钥登录DeepSeek开发者平台创建应用获取DEEPSEEK_API_KEY2.创建测试环境#项目结构deepseek-demo/├──frontend/#前端代码│└──index.html├──go-backend/#Golang后端│└──main.go├──py-
  • 前端知识点---一行代码检测数据类型(javascript) *星之卡比* javascriptjavascript前端原型模式
    typeof只能检测基本数据类型和函数,instanceof不能检测基本数据类型如何一句话检测数据类型呢?function_typeof(value){returnObject.prototype.toString.call(value).slice(8,-1).toLowerCase();}结果是一个全为小写的字符串下面来一步一步分析这段代码:原型链解析Object是原型链中最上层的构造函数，但
  • 从零开始开发微信小程序：全面指南 百态老人 经验分享微信小程序小程序
    学习制作微信小程序，希望通过这次学习能够实现跨平台的统一开发，从而提高自己的编程和开发能力。第一部分需要事先准备的工具和环境：一、工具：1、微信开发者工具：用于开发、调试和预览微信小程序。微信开发者工具是专门为微信小程序开发提供的集成开发环境（IDE）。它的主要功能包括：1）开发：可以编写、编辑、管理小程序的代码，支持多种编程语言和框架（如JavaScript、TypeScript、WXML、WX
  • Singleton 单例模式 后端
    一、实现在javascript中，实现一个单例模式可以用一个变量来标志当前的类已经创建过对象，如果下次获取当前类的实例时，直接返回之前创建的对象即可，如下：//定义一个类functionSingleton(name){this.name=name;this.instance=null;}//原型扩展类的一个方法getName()Singleton.prototype.getName=functio
  • SvelteKit 最新中文文档教程（4）—— 表单 actions
    前言Svelte，一个语法简洁、入门容易，面向未来的前端框架。从Svelte诞生之初，就备受开发者的喜爱，根据统计，从2019年到2024年，连续6年一直是开发者最感兴趣的前端框架No.1：Svelte以其独特的编译时优化机制著称，具有轻量级、高性能、易上手等特性，非常适合构建轻量级Web项目。为了帮助大家学习Svelte，我同时搭建了Svelte最新的中文文档站点。如果需要进阶学习，也可以入手我
  • JavaScript_Day3 Mswanga 前端javascripthtml
    classList操作元素属性//追加一个类元素.classList.add('类名')//删除一个类元素.classList.remove('类名')//切换一个类元素.classList.toggle('类名')操作表单元素属性获取：DOM对象.属性值设置：DOM对象.属性值=新值模板字符串在没有模板字符串之前，要拼接变量比较麻烦letuname=prompt("请输入你的姓名")letage
  • 文件上传漏洞总结（含原因+防御措施）+白名单+黑名单+内容、头+解析漏洞/修补方案 南部余额 漏洞总结安全漏洞web安全安全
    文件上传漏洞简单总结+白名单+黑名单+内容、头+解析漏洞/修补方案问题什么是文件上传漏洞?危害?防御措施?文件上传(验证/绕过)措施?前端js类绕过?后端黑名单绕过特殊解析后缀.htaccess解析大小写绕过点绕过空格绕过::$DATA绕过配合解析漏洞(*待补充)双后缀名绕过白名单绕过MIME绕过%00截断0x00截断0x0a截断内容及其他绕过?文件头检测二次渲染条件竞争突破getimagesiz
  • Node.js系列（1）--架构设计指南 一进制ᅟᅠ        ‌‍‎‏  Node.jsnode.jsvim编辑器
    Node.js架构设计指南️引言Node.js作为一个高性能的JavaScript运行时环境，其架构设计对于构建可扩展的服务端应用至关重要。本文将深入探讨Node.js的架构设计原则、最佳实践和实现方案。架构概述Node.js架构主要包括以下方面：事件驱动：基于事件循环的异步非阻塞架构模块系统：CommonJS和ES模块系统进程模型：单线程主进程与工作线程流处理：基于Stream的数据处理错误处理
  • Github2025-03-10 开源项目周报 Top13 老孙正经胡说 开源Github趋势分析开源项目PythonGolang
    根据GithubTrendings的统计，本周(2025-03-10统计)共有13个项目上榜。根据开发语言中项目的数量，汇总情况如下：开发语言项目数量Python项目7TypeScript项目2JavaScript项目2C++项目1JupyterNotebook项目1Vue项目1文档项目1Rust项目1Svelte项目1从零开始构建你喜爱的技术创建周期：2156天Star数量：253338个For
  • 利用github部署项目 浪裡遊 github前端持续部署
    挂载GitHubPages的方法基本步骤创建仓库：在GitHub上创建一个新的仓库。如果使用自定义域名，则仓库名应为.github.io；否则可以是任意名称。启用GitHubPages：进入仓库的设置页面，在“Pages”部分选择要发布的分支（通常是main或master），然后保存更改。上传网站内容：将你的HTML、CSS、JavaScript等文件上传到仓库中指定的分支。什么是SSHSSH是一
  • JavaScript松散比较与严格比较 hzw0510 前端开发javascript开发语言ecmascript
    在JavaScript中，==（双等号）和===（三等号）都用于比较两个值，但它们的比较方式有显著区别。以下是它们的详细对比：1.==（双等号）名称:松散相等（LooseEquality）行为:在比较之前会尝试进行类型转换，将两个值转换为相同类型后再比较。示例:console.log(5=="5")
  • 前端缓存接口数据 jjjjjjjjj¢ 笔记前端
    在前端缓存接口数据时，可以结合浏览器缓存策略、前端存储（localStorage、sessionStorage、IndexedDB）、内存缓存（变量存储）、ServiceWorker等方式，选择适合的方案。使用浏览器HTTP缓存（推荐，依赖后端支持）如果接口数据不会频繁变化，可以使用HTTP缓存策略（强缓存+协商缓存），减少不必要的请求。后端设置Cache-Control在接口响应头中，服务器可以
  • element-ui简介、安装和使用代码 alankuo 前端前端
    一、Element-UI简介Element-UI是一套基于Vue.js的桌面端组件库，由饿了么前端团队开源。它提供了丰富的组件，如按钮、表单、表格、菜单、对话框等，这些组件具有统一的视觉风格和交互设计，能够帮助开发者快速构建美观、易用的Web应用程序。Element-UI的特点包括：丰富的组件库涵盖了Web应用开发中常见的各种组件需求，无论是简单的UI元素还是复杂的交互组件都能找到，大大减少了开发
  • 学习Web3.0需要具备哪些基础知识？ alankuo 人工智能人工智能
    学习Web3.0需要具备以下基础知识：一、计算机科学基础1.编程知识-了解至少一种编程语言，如Python、JavaScript等。这将有助于理解Web3.0应用程序的开发和智能合约的编写。-熟悉编程概念，如变量、数据类型、控制结构、函数等。2.数据结构和算法-掌握常见的数据结构，如数组、链表、栈、队列、树、图等，以及它们的操作和应用。-了解基本的算法，如排序、搜索、递归等，以及它们的时间和空间复
  • vue2和vue3的响应式原理有何不同？
    大家好，我是V哥。Vue2和Vue3在响应式原理上存在显著差异，下面为你详细介绍。如果你是前端开发，V哥建议抓紧入坑鸿蒙，2025年鸿蒙趋势将引领国产化替代的新征程，大量内推岗位等你来拿。推荐一本鸿蒙NEXT书《鸿蒙HarmonyOS开发之路》卷1，可以让你少走弯路。Vue2响应式原理Vue2使用Object.defineProperty()方法来实现响应式系统。该方法可以直接在一个对象上定义一个
  • Vue 路由 (vue-router) 详细总结 遇见~未来 Vue.jsvue.js前端javascript
    一、传统web应用与单页面web应用1.1传统web应用传统web应用由多个HTML页面组成，页面切换时会重新加载整个页面，导致用户体验不够流畅，对服务器压力较大。1.2单页面web应用(SPA)单页面应用只有一个HTML页面，通过JavaScript动态更新页面内容，实现局部刷新，具有以下特点：用户体验好：响应性强，类似桌面应用的即时性。服务器压力小：服务器只需提供数据，不负责页面渲染。前后端分
  • Ajax原理笔记 小鱼ccd 前端
    1.后端如何把数据传给前端？后端通常通过HTTP接口（API）把数据传给前端，一般流程如下：（1）后端提供API接口后端使用SpringBoot开发API，通常返回JSON数据。例如，在Controller层定义一个接口，返回商品列表：@RestController@RequestMapping("/api/products")publicclassProductController{@GetMa
  • sequelize + Nodejs + MySQL 的简单用法 小公鸡卡哇伊呀~ mysql数据库
    HowtoUseSequelizeORMinNodeJS-Tutorial1Sequlize简介Sequelize是最流行的可以与Nodejs一起使用的一种关系数据库ORM(Object-relationalmapping对象关系映射)，Mongoose是MongoDB的ORM.Sequelize的作用，简单地说，就是避免在代码里写原生SQL语句，而是将这种语句改成JavaScript：不必再写类
  • JavaScript 的 requestAnimationFrame 小华0000 javascript开发语言ecmascript
    在现代Web开发中，用户体验至关重要。动画作为用户交互的重要组成部分，如果处理不当，很容易出现卡顿、掉帧等问题，严重影响用户体验。幸运的是，JavaScript提供了一个强大的API：requestAnimationFrame（简称rAF），它为我们创建平滑、高效的动画提供了坚实的基础。本文将深入探讨requestAnimationFrame的原理、使用、高级技巧以及在实际项目中的应用，帮助你掌握
  • css预处理器sass 小华0000 scss前端css
    在前端开发的世界中，CSS是构建网页样式的基础。然而，随着项目规模的增大，纯CSS的编写和维护往往会变得复杂而繁琐。为了解决这些痛点，Sass（SyntacticallyAwesomeStyleSheets）应运而生。Sass是一种CSS预处理器，它扩展了CSS的功能，让CSS的编写更加高效、灵活和易于维护。本文将深入探讨Sass的概念、优势、语法、以及如何在实际项目中应用它，帮助你提升CSS技能
  • 前端学习网站大全 洪布斯
    CSDN-专业IT技术社区：https://www.csdn.net/GitHub：https://github.com/jQuery插件库-收集最全最新最好的jQuery插件：http://www.jq22.com/Iconfont-阿里巴巴矢量图标库：https://www.iconfont.cn/菜鸟教程-学的不仅是技术，更是梦想!：https://www.runoob.com/Animat
  • Cesium在三维模型中的应用 IT邦少 前端贴图
    Cesium在三维模型中的应用Cesium简介Cesium介绍Cesium是一个跨平台,跨浏览器的展示三维地球和地图的javascript库Cesium使用WebGL来进行硬件加速图形,使用时不需要任何插件支持,但是浏览器必须支持WebGLCesium是基于Apache2.0许可的开源程序,它可以免费的用于商业和非商业用途Cesium特点支持2D,2.5D,3D形式的地图展示可以绘制各种几何图形,
  • 前端面试技巧与实践 北辰alk 前端前端面试职场和发展
    在当今快速发展的互联网行业中，前端开发已经成为了一个至关重要的角色。随着技术的不断进步和用户需求的日益复杂，前端工程师的职责不再仅仅是实现页面的布局和交互，而是需要具备全方位的技术能力和工程思维。根据2023年StackOverflow的开发者调查报告，前端开发仍然是全球最受欢迎的技术岗位之一，竞争也愈发激烈。在这样的背景下，前端面试成为了每个开发者职业生涯中的重要关卡。无论是初入职场的新人，还是
  • 2025前端面试题超全面解析（附答案与深度扩展） 北辰alk 前端前端
    文章目录一、HTML篇（扩展版）1.**HTML5语义化标签的实际应用场景**2.**WebComponents实战：如何封装一个自定义按钮组件？**3.**WebWorker的用途与限制**二、CSS篇（扩展版）1.**CSS盒模型详解：border-boxvscontent-box**2.**CSS动画性能优化技巧**3.**CSS预处理器（Sass/Less）核心功能对比**三、JavaSc
  • xml解析 小猪猪08 xml
    1、DOM解析的步奏 准备工作：    1.创建DocumentBuilderFactory的对象    2.创建DocumentBuilder对象    3.通过DocumentBuilder对象的parse(String fileName)方法解析xml文件    4.通过Document的getElem
  • 每个开发人员都需要了解的一个SQL技巧 brotherlamp linuxlinux视频linux教程linux自学linux资料
      对于数据过滤而言CHECK约束已经算是相当不错了。然而它仍存在一些缺陷，比如说它们是应用到表上面的，但有的时候你可能希望指定一条约束，而它只在特定条件下才生效。 使用SQL标准的WITH CHECK OPTION子句就能完成这点，至少Oracle和SQL Server都实现了这个功能。下面是实现方式： CREATE TABLE books (   id &
  • Quartz——CronTrigger触发器 eksliang quartzCronTrigger
    转载请出自出处：http://eksliang.iteye.com/blog/2208295 一.概述 CronTrigger 能够提供比 SimpleTrigger 更有具体实际意义的调度方案，调度规则基于 Cron 表达式，CronTrigger 支持日历相关的重复时间间隔（比如每月第一个周一执行），而不是简单的周期时间间隔。 二.Cron表达式介绍 1）Cron表达式规则表 Quartz
  • Informatica基础 18289753290 InformaticaMonitormanagerworkflowDesigner
    1. 1）PowerCenter Designer：设计开发环境，定义源及目标数据结构；设计转换规则，生成ETL映射。 2）Workflow  Manager：合理地实现复杂的ETL工作流，基于时间，事件的作业调度 3）Workflow  Monitor：监控Workflow和Session运行情况，生成日志和报告 4）Repository  Manager：
  • linux下为程序创建启动和关闭的的sh文件，scrapyd为例 酷的飞上天空 scrapy
    对于一些未提供service管理的程序  每次启动和关闭都要加上全部路径，想到可以做一个简单的启动和关闭控制的文件   下面以scrapy启动server为例，文件名为run.sh：   #端口号，根据此端口号确定PID PORT=6800 #启动命令所在目录 HOME='/home/jmscra/scrapy/' #查询出监听了PORT端口
  • 人--自私与无私 永夜-极光
                今天上毛概课,老师提出一个问题--人是自私的还是无私的,根源是什么?               从客观的角度来看,人有自私的行为,也有无私的
  • Ubuntu安装NS-3 环境脚本 随便小屋 ubuntu
      将附件下载下来之后解压，将解压后的文件ns3environment.sh复制到下载目录下（其实放在哪里都可以，就是为了和我下面的命令相统一）。输入命令：   sudo ./ns3environment.sh >>result   这样系统就自动安装ns3的环境，运行的结果在result文件中，如果提示     com
  • 创业的简单感受 aijuans 创业的简单感受
           2009年11月9日我进入a公司实习，2012年4月26日，我离开a公司，开始自己的创业之旅。      今天是2012年5月30日，我忽然很想谈谈自己创业一个月的感受。 当初离开边锋时，我就对自己说：“自己选择的路，就是跪着也要把他走完”，我也做好了心理准备，准备迎接一次次的困难。我这次走出来，不管成败
  • 如何经营自己的独立人脉 aoyouzi 如何经营自己的独立人脉
    独立人脉不是父母、亲戚的人脉，而是自己主动投入构造的人脉圈。“放长线，钓大鱼”，先行投入才能产生后续产出。   现在几乎做所有的事情都需要人脉。以银行柜员为例，需要拉储户，而其本质就是社会人脉，就是社交！很多人都说，人脉我不行，因为我爸不行、我妈不行、我姨不行、我舅不行……我谁谁谁都不行，怎么能建立人脉？我这里说的人脉，是你的独立人脉。   以一个普通的银行柜员
  • JSP基础 百合不是茶 jsp注释隐式对象
      1,JSP语句的声明 <%! 声明 %> 　　 声明：这个就是提供java代码声明变量、方法等的场所。 表达式 <%= 表达式 %> 　　 这个相当于赋值，可以在页面上显示表达式的结果， 程序代码段/小型指令　<% 程序代码片段 %>   2,JSP的注释   <!-- -->
  • web.xml之session-config、mime-mapping bijian1013 javaweb.xmlservletsession-configmime-mapping
    session-config 1.定义： <session-config> <session-timeout>20</session-timeout> </session-config> 2.作用：用于定义整个WEB站点session的有效期限，单位是分钟。   mime-mapping 1.定义： <mime-m
  • 互联网开放平台（1） Bill_chen 互联网qq新浪微博百度腾讯
    现在各互联网公司都推出了自己的开放平台供用户创造自己的应用，互联网的开放技术欣欣向荣，自己总结如下： 1.淘宝开放平台(TOP) 网址：http://open.taobao.com/ 依赖淘宝强大的电子商务数据，将淘宝内部业务数据作为API开放出去，同时将外部ISV的应用引入进来。 目前TOP的三条主线： TOP访问网站：open.taobao.com ISV后台：my.open.ta
  • 【MongoDB学习笔记九】MongoDB索引 bit1129 mongodb
    索引 可以在任意列上建立索引 索引的构造和使用与传统关系型数据库几乎一样,适用于Oracle的索引优化技巧也适用于Mongodb 使用索引可以加快查询,但同时会降低修改,插入等的性能 内嵌文档照样可以建立使用索引 测试数据     var p1 = { "name":"Jack", "age&q
  • JDBC常用API之外的总结 白糖_ jdbc
    做JAVA的人玩JDBC肯定已经很熟练了，像DriverManager、Connection、ResultSet、Statement这些基本类大家肯定很常用啦，我不赘述那些诸如注册JDBC驱动、创建连接、获取数据集的API了，在这我介绍一些写框架时常用的API，大家共同学习吧。     ResultSetMetaData获取ResultSet对象的元数据信息
  • apache VelocityEngine使用记录 bozch VelocityEngine
    VelocityEngine是一个模板引擎，能够基于模板生成指定的文件代码。   使用方法如下：     VelocityEngine engine = new VelocityEngine();// 定义模板引擎     Properties properties = new Properties();// 模板引擎属
  • 编程之美-快速找出故障机器 bylijinnan 编程之美
    package beautyOfCoding; import java.util.Arrays; public class TheLostID { /*编程之美 假设一个机器仅存储一个标号为ID的记录，假设机器总量在10亿以下且ID是小于10亿的整数，假设每份数据保存两个备份，这样就有两个机器存储了同样的数据。 1.假设在某个时间得到一个数据文件ID的列表，是
  • 关于Java中redirect与forward的区别 chenbowen00 javaservlet
    在Servlet中两种实现： forward方式：request.getRequestDispatcher(“/somePage.jsp”).forward(request, response); redirect方式：response.sendRedirect(“/somePage.jsp”); forward是服务器内部重定向，程序收到请求后重新定向到另一个程序，客户机并不知
  • [信号与系统]人体最关键的两个信号节点 comsci 系统
            如果把人体看做是一个带生物磁场的导体,那么这个导体有两个很重要的节点,第一个在头部,中医的名称叫做 百汇穴, 另外一个节点在腰部,中医的名称叫做 命门         如果要保护自己的脑部磁场不受到外界有害信号的攻击,最简单的
  • oracle 存储过程执行权限 daizj oracle存储过程权限执行者调用者
    在数据库系统中存储过程是必不可少的利器，存储过程是预先编译好的为实现一个复杂功能的一段Sql语句集合。它的优点我就不多说了，说一下我碰到的问题吧。我在项目开发的过程中需要用存储过程来实现一个功能，其中涉及到判断一张表是否已经建立，没有建立就由存储过程来建立这张表。 CREATE OR REPLACE PROCEDURE TestProc  IS    fla
  • 为mysql数据库建立索引 dengkane mysql性能索引
    前些时候，一位颇高级的程序员居然问我什么叫做索引，令我感到十分的惊奇，我想这绝不会是沧海一粟，因为有成千上万的开发者（可能大部分是使用MySQL的）都没有受过有关数据库的正规培训，尽管他们都为客户做过一些开发，但却对如何为数据库建立适当的索引所知较少，因此我起了写一篇相关文章的念头。  最普通的情况，是为出现在where子句的字段建一个索引。为方便讲述，我们先建立一个如下的表。
  • 学习C语言常见误区 如何看懂一个程序 如何掌握一个程序以及几个小题目示例 dcj3sjt126com c算法
    如果看懂一个程序，分三步   1、流程   2、每个语句的功能   3、试数   如何学习一些小算法的程序 尝试自己去编程解决它，大部分人都自己无法解决 如果解决不了就看答案 关键是把答案看懂，这个是要花很大的精力，也是我们学习的重点 看懂之后尝试自己去修改程序，并且知道修改之后程序的不同输出结果的含义 照着答案去敲 调试错误
  • centos6.3安装php5.4报错 dcj3sjt126com centos6
    报错内容如下: Resolving Dependencies --> Running transaction check ---> Package php54w.x86_64 0:5.4.38-1.w6 will be installed --> Processing Dependency: php54w-common(x86-64) = 5.4.38-1.w6 for
  • JSONP请求 flyer0126 jsonp
          使用jsonp不能发起POST请求。 It is not possible to make a JSONP POST request. JSONP works by creating a <script> tag that executes Javascript from a different domain; it is not pos
  • Spring Security（03）——核心类简介 234390216 Authentication
    核心类简介 目录 1.1     Authentication 1.2     SecurityContextHolder 1.3     AuthenticationManager和AuthenticationProvider 1.3.1  &nb
  • 在CentOS上部署JAVA服务 java--hhf javajdkcentosJava服务
        本文将介绍如何在CentOS上运行Java Web服务，其中将包括如何搭建JAVA运行环境、如何开启端口号、如何使得服务在命令执行窗口关闭后依旧运行     第一步：卸载旧Linux自带的JDK ①查看本机JDK版本 java -version    结果如下 java version "1.6.0"
  • oracle、sqlserver、mysql常用函数对比[to_char、to_number、to_date] ldzyz007 oraclemysqlSQL Server
    oracle                                &n
  • 记Protocol Oriented Programming in Swift of WWDC 2015 ningandjin protocolWWDC 2015Swift2.0
    其实最先朋友让我就这个题目写篇文章的时候，我是拒绝的，因为觉得苹果就是在炒冷饭， 把已经流行了数十年的OOP中的“面向接口编程”还拿来讲，看完整个Session之后呢，虽然还是觉得在炒冷饭，但是毕竟还是加了蛋的，有些东西还是值得说说的。 通常谈到面向接口编程，其主要作用是把系统设计和具体实现分离开，让系统的每个部分都可以在不影响别的部分的情况下，改变自身的具体实现。接口的设计就反映了系统
  • 搭建 CentOS 6 服务器(15) - Keepalived、HAProxy、LVS rensanning keepalived
    （一）Keepalived （1）安装 # cd /usr/local/src # wget http://www.keepalived.org/software/keepalived-1.2.15.tar.gz # tar zxvf keepalived-1.2.15.tar.gz # cd keepalived-1.2.15 # ./configure # make &a
  • ORACLE数据库SCN和时间的互相转换 tomcat_oracle oraclesql
    SCN（System Change Number 简称 SCN）是当Oracle数据库更新后，由DBMS自动维护去累积递增的一个数字，可以理解成ORACLE数据库的时间戳，从ORACLE 10G开始，提供了函数可以实现SCN和时间进行相互转换； 　　 用途：在进行数据库的还原和利用数据库的闪回功能时，进行SCN和时间的转换就变的非常必要了； 　 　操作方法： 　　1、通过dbms_f
  • Spring MVC 方法注解拦截器 xp9802 spring mvc
    应用场景，在方法级别对本次调用进行鉴权，如api接口中有个用户唯一标示accessToken,对于有accessToken的每次请求可以在方法加一个拦截器，获得本次请求的用户，存放到request或者session域。 python中，之前在python flask中可以使用装饰器来对方法进行预处理，进行权限处理 先看一个实例,使用@access_required拦截： ?
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他