2b勿扰
2b勿扰

JS 第三方工具封装经典案例（canvas元素拖动）

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>图片绘制并拖拽</title>
    <style>
        body,div{
            margin:0;
            padding:0;
        }
    </style>
</head>
<body>
    <canvas id="myCanvas" width="500" height="400" style="border:1px solid red;">
        <p>您的系统不支持此程序!</p>
    </canvas>

    <a href="" id="downlink">下载图片</a>

    <img src='' id="modelImg">
    <script>
        var canvas = document.getElementById('myCanvas');
        var cansText =  canvas.getContext('2d');

        var img = new Image();
        img.src="./images/finger.png";
        img.onload = function(){ 
            cansText.drawImage(img,50,50,150,100);
        }
    cansText.save();  
    cansText.fillStyle = "#000000";
    cansText.font='15px Arial';
    cansText.translate(300,350);
 
    cansText.fillText("canvas生成图片测试",0,0);
    cansText.fillText("长按保存到手机",0,30);
    cansText.restore();

        function dragImg(){
            var moving = false; //标记是否在拖动
            var movingLine = false; //涂鸦
            var imgCurrent =  {
                x:50,
                y:50
            };
            var dis = {};
            canvas.onmousedown = function(e){
              
                //计算鼠标落下点与被拖动的左边和上边的距离
                dis={
                    x:e.clientX-imgCurrent.x,
                    y:e.clientY-imgCurrent.y
                }
                //判断是不是在图片上
                if(dis.x>150 || dis.y>100){
                    return;
                }
                moving = true;
            }
            canvas.onmousemove = function(e){
                if(!moving) {
                    return;
                }  
                var px = e.clientX - dis.x;
                var py = e.clientY - dis.y;

                //不要超出边界 如何处理
                // 横坐标  0 - （画布的宽度-图片的宽度）
                // 纵坐标  0 - （画布的高度-图片的高度）

                var movescope = {
                    mx:canvas.width - 150,
                    my:canvas.height-100
                };
                if(px>movescope.mx || px<0){
                    return;
                }
                if(py>movescope.my || py<0){
                    return;
                }

                cansText.clearRect(0,0,canvas.width,canvas.height);   
                cansText.drawImage(img,px,py,150,100);
                imgCurrent= {
                    x:px,
                    y:py
                }
            }
            canvas.onmouseup = function(){
                moving = false;
                movingLine = false;
            }

            canvas.addEventListener('mousedown',function(ev){
                movingLine = true;
            })
            canvas.addEventListener('mousemove',function(ev){
                if(!movingLine){
                    return;
                }
                // drawLine()
                cansText.fillStyle = 'red';
                cansText.beginPath(); //开始一条路径
                cansText.arc(ev.clientX,ev.clientY,5,0,2 *Math.PI,true); //路径
                cansText.fill();

            })

        }
        dragImg();

        //图片的下载   base64
        document.getElementById('downlink').addEventListener('click',function(ev){          
             ev.preventDefault();
            //  this.download = 'hello.png';

            this.href = canvas.toDataURL('image/png');
             modelImg.src= this.href;

        })
    </script>
</body>
</html>

你可能感兴趣的:(前端)

  • 个人网站搭建1-域名及虚机 一条西瓜皮
    前情提要由于本人的初衷不是做网站，只是想搭建后台，为前端提供服务，所以网站放在国外服务器上。国内服务器上搭建网站，需要备案，备案需要准备材料，大概耗费一个月时间。根据网上的资料，国外建站，只要不发布非法内容，被墙的概率极小。虽然概率小，但是为了不影响后期的服务，时间充裕后会考虑进行备案，将网站迁移至国内。毕竟天朝的网络响应速度比出去绕一圈要快得多。本文只涉及域名购买、云虚拟主机购买、域名解析等基础
  • 从面向对象(OOP)到面向切面(AOP)：编程范式的演变 妍思码匠 妍思码匠的前端乐园面向切面编程AOP前端代码复用模块化设计装饰器模式
    什么是AOP？AOP是一种编程范式，它允许你将那些横切应用程序多个部分的“例行公事”（称为“切面”）从核心业务逻辑中分离出来，以模块化的方式进行管理和重用。在前端开发中，AOP可以用于处理日志记录、性能监控、错误处理等。想象一下，你在一家餐厅工作，每次有顾客点餐时，你都需要记录订单，然后在厨房和顾客之间传递信息。这个过程包括了接收订单、记录、传递信息等多个步骤，每个步骤都可能需要执行一些“例行公事
  • JavaWeb——前端工程化 A_Tai2333333 JavaWeb前端
    一、前端工程化1.什么是前端工程化:前端工程化是使用软件工程的方法来单独解决前端的开发流程中模块化、组件化、规范化、自动化的问题，以提高效率和降低成本。2.前端工程化实现技术栈:ES6+Nodejs+npm+Vite+VUE3+Router+Pinia+Axios+Element-plusECMAScript6:VUE3中大量使用ES6语法;Nodejs:前端项目运行环境npm:依赖下载工具Vit
  • Vue搭建前端监控，采集用户行为的 N 种姿势 奋斗的工程师 前端vue.jsjavascript
    Vue搭建前端监控，采集用户行为的N种姿势最近我在3A平台购买了服务器。在一个产品中，用户最基本的行为就是切换页面。用户使用了哪些功能，也能从切换页面中体现出来。因此通用数据一般是在页面切换时产生，表示某个用户访问了某个页面。页面切换对应到前端就是路由切换，可以通过监听路由变化来拿到新页面的数据。Vue在全局路由守卫中监听路由变化，任意路由切换都能执行这里的回调函数。//Vue3路由写法const
  • BCrypt.checkpw()报错java.lang.IllegalArgumentException: Invalid salt 玩物丧志汪某人 Java异常参数传递前端开发后端交互明文密文数据库操作
    先看一下方法参数，放两个String第一个参数是明文（一般是前端传过来的值），第二个是密文（从数据库取出来的值），各位大聪明们是不是把参数放反了
  • 前端性能监控、异常监控的一些记录 一只小白菜~ 其他!前端异常监控性能监控
    文章目录常见异常类型常用的一些异常监控的方法window.errorwindow.addEventListener('error')window.addEventListener('load')window.addEventListener('DOMContentLoaded')window.performancenavigator.sendBeacon1*1像素gifaxios请求/响应拦截器V
  • 前端监控之白屏异常 github_35780652 前端监控JavaScript前端javascript监控类
    一、意义：  这里和测速的白屏不同，测速的白屏是指：导航页面开始到TTFB之间的时间称之为白屏时间。白屏异常是指：用户看到的一直是白屏，页面没有任何内容。比如渲染函数报错、Vue或React路由页面没有内容、网页加载很慢很慢以至规定的时间范围内一直没内容。  监控白屏异常能发现一些遗漏的bug并及时修复。二、捕获方法：  页面加载后2秒或进入页面后12秒（兼容一些特殊页面不会触发load事件）检查
  • Spring Boot + Mybatis + Shiro 后台权限管理系统 chuxia_vlog
    平台简介一直想做一款后台管理系统，看了很多优秀的开源项目但是发现没有合适的。于是利用空闲休息时间开始自己写了一套后台系统。如此有了若依。她可以用于所有的Web应用程序，如网站管理后台，网站会员中心，CMS，CRM，OA。所有前端后台代码封装过后十分精简易上手，出错概率低。同时支持移动客户端访问。系统会陆续更新一些实用功能。性别男，若依是给还没有出生女儿取的名字（寓意：你若不离不弃，我必生死相依）若
  • 前端速通面经八股系列(六）—— Vue(下) 真的很上进 前端面经八股合集前端javascript开发语言面试javavue.js前端框架
    接上ueueVue下篇四、路由1.Vue-Router的懒加载如何实现2.路由的hash和history模式的区别1.hash模式2.history模式3.两种模式对比3.如何获取页面的hash变化4.`$route和$router`的区别5.如何定义动态路由？如何获取传过来的动态参数？6.Vue-router路由钩子在生命周期的体现7.Vue-router跳转和location.href有什么区
  • uniapp开发中遇到的兼容性问题（待续） 呆呆papa uniapp开发ios
    1、日期格式问题使用uniapp开发过程中，有这么一段代码，将两个时间字符串通过JS的date构造函数，构造出两个日期并比较大小，在Android平台没有问题，在ios上就出现了日期比较失败，无法执行正常的校验。ios中不支持-作为日期之间的分隔符，需要使用/。使用replaceAll替换掉日期字符串中的-就好了。参考文献进阶之路-前端：ios对newDate()的兼容问题2、输入框click事件
  • 提交保存，要做重复请求拦截，避免出现重复保存的问题 niceLiuSir 幂等性
    **问题：**前端ajax提交数据的时候，当频繁点击的时候，或者两个账号以相同数据创建的时候，会出现问题。**处理办法：**前端拦截，防止重复提交数据，在上一次请求返回结果之后才允许提交第二次；后端和数据库也同意做拦截判断。**1.前端拦截：**结合layer.confirm可以屏蔽掉重复点击确认按钮产生重复请求的情况。//创建征地补差价协议functioncreateDisparityContr
  • 使用 Shell 脚本管理 RocketMQ 服务：启动、停止与状态检查 heromps rocketmq
    在分布式系统中，RocketMQ是一个流行的消息队列中间件。在开发和运维过程中，能够高效地启动、停止和检查RocketMQ相关服务的状态非常重要。本文将介绍如何使用Shell脚本来管理RocketMQ的NameServer、Broker和Dashboard服务，并提供相应的脚本示例和说明。安装可以查看这篇博客RocketMQ实战：在macOS上安装与前端访问全流程指南1.脚本概述这个脚本将涵盖以下
  • 马云谈未来暴利行业：高省APP，让你走在赚钱的最前端！ 高省APP
    随着科技的飞速发展，互联网经济的日益成熟，越来越多的人开始关注未来的赚钱行业。在众多行业中，电商导购平台因其独特的商业模式和广阔的市场前景，吸引了众多投资者的目光。其中，高省APP作为2021年推出的平台，以其0投资、0风险、高佣金的特点，成为了电商导购行业的一匹黑马。高省APP，是一个自用省钱佣金高，分享推广赚钱多的平台。运行三年以来，稳定可靠，吸引了百万终端用户。注册送2皇冠会员，送万元推广大
  • 2019-03-21 蜜思1013
    SPA:单页应用https://baike.baidu.com/item/SPA/175363131.场景（1）中后台管理系统（2）H5前端开发（3）跨端APP开发2.技术栈（1）SpringBootvue-cliIDEnpmElementUI（2）vue-cliSPA,npm,建议自己布局写样式（3）uni-app,Flutter,RN,cordova(调用底层API)3.IDE（1）WSVSc
  • Web前端 2301_78085386 前端
    网页开发学习内容:htmlcssJavaScript两个框架:VUE.jsElementUIUI->userinterface用户界面html(HyperTextMarkupLanguage):超文本标记语言文本:文字字符超文本:网页内容标记:标签标识例如商品上的标签,介绍了商品的信息html语言就是一种标记语言,提供许多的标签,不同的标签功能不同,网页就是通过这些标签描述出来的,最终通过浏览器解
  • Chapter 06 axios使用指南 Heaven645 vue.js前端Vueaxios
    欢迎大家订阅【Vue2+Vue3】入门到实践专栏，开启你的Vue学习之旅！文章目录前言一、导入二、发送GET请求三、发送POST请求四、处理响应前言在现代前端开发中，与后端API进行数据交互是至关重要的。Axios是一个基于Promise的HTTP客户端，用于浏览器和Node.js。本文详细介绍了Axios的基本用法。一、导入导入官网提供的axios在线地址：二、发送GET请求axios.get(
  • 前端播放RTSP视频流，使用FLV请求RTSP视频流播放（Vue项目，在Vue中使用插件flv.js请求RTSP视频流播放） 北城笑笑 JavaScriptVueJSjavascriptvue.js
    简述：在浏览器中请求RTSP视频流并进行播放时，直接使用原生的浏览器API是行不通的，因为它们不支持RTSP协议。为了解决这个问题，开发者通常会选择使用像flv.js这样的库，它专为在浏览器中播放FLV和其他流媒体格式设计。然而，flv.js本身并不直接支持RTSP，这意味着我们需要一个额外的步骤来桥接RTSP和flv.js。这里来记录一下详细介绍：在Vue中使用flv.js插件播放RTSP视频流
  • 前端vue播放m3u8、flv、mp4视频的方法_vue mp4(1) 2401_84437982 程序员前端vue.js音视频
    //this.db.src([//{//src:“https://e-sign.dms.t.cn-np.com/files/m3u8_file/c4b94118-3c8d-4410-9987-985c2b44c278/c4b94118-3c8d-4410-9987-985c2b44c278.m3u8”,//地址//type:“application/x-mpegURL”,//告诉videojs,这
  • 【渗透测试】利用hook技术破解前端JS加解密 - JS-Forward Hello_Brian 渗透测试安全Hook技术前端JS加解密渗透测试web安全
    前言在做渗透测试项目时，尤其是金融方面，经常会遇到前端JS加解密技术，看着一堆堆密密麻麻的密文，会给人一种无力感。Hook技术则会帮助我们无需获取加解密密钥的前提下，获取明文进行渗透测试环境准备JS-ForwardBurpsuiteFiddler网上公开的加解密逻辑漏洞的靶场源码某大佬搭建的公网测试环境（请礼貌使用）：http://39.98.108.20:8085/Hook-JS技术详解正常访问
  • 前端数据库——WebSQL和IndexedDB 凡凡的小web
    一、WebSQLWebSQL是前端的一个独立模块，是web存储方式的一种，我们调试的时候会经常看到，只是一般很少使用。并且，当前只有谷歌支持，ie和火狐均不支持。image我们对数据库的一般概念是后端才会跟数据库打交道，进行一些业务性的增删改查。而这里的数据库也不同于真正意义上的数据库。废话少说，先出招吧：主要方法：openDatabase：这个方法使用现有的数据库或者新建的数据库创建一个数据库对
  • WebGL入门（019）：WebGLSync 简介、使用方法、示例代码 还是大剑师兰特 #webGL开发教程webgl大剑师
    还是大剑师兰特：曾是美国某知名大学计算机专业研究生，现为航空航海领域高级前端工程师；CSDN知名博主，GIS领域优质创作者，深耕openlayers、leaflet、mapbox、cesium，canvas，webgl，echarts等技术开发，欢迎加底部微信（gis-dajianshi），一起交流。No.内容链接1Openlayers【入门教程】-【源代码+示例300+】2Leaflet【入门教
  • 【学习笔记】用Mac自学虚幻4 左上方的天空&roc 虚幻4学习笔记ue4macos
    文章目录前言学习过程总结前言首先，我是大学自学的前端，之后实习做的是前端是Webgl可视化工作，从实习到转正再到离职大概一年时间，辞职以后我考虑了目前比较火的UE引擎，于是重新学习了一遍C++和数据结构后，开始自学UE。由于本人手里只有一台MacBookAir，本次学习全程用Mac来运行。提示：建议学习UE的新人去学一遍C++，并且了解一下STL源码，以及底层的数据结构。一、安装UE4进入UE官网
  • nginx部署前端vue项目完整详细讲解 程序员小羊！ 运维前端nginxvue.js
    大家好，我是程序员小羊！前言：在使用Nginx部署前端Vue项目时，确保项目的生产环境版本已经打包，并且Nginx已经安装并配置在服务器上。以下是详细的步骤，包括打包Vue项目、配置Nginx、部署和测试项目。1.打包Vue项目首先，你需要将Vue项目编译为生产环境版本。可以通过VueCLI完成这一步。1.1安装依赖确保已经安装了Node.js和npm。然后在项目根目录下运行以下命令安装依赖：np
  • 基于SpringBoot的流浪猫狗救援网站 超级无敌暴龙战士塔塔开 Java课设与毕设资源java
    文章目录项目介绍主要功能截图：部分代码展示设计总结项目获取方式作者主页：超级无敌暴龙战士塔塔开简介：Java领域优质创作者、简历模板、学习资料、面试题库【关注我，都给你】文末获取源码联系项目介绍基于SpringBoot的流浪猫狗救援网站,java项目。eclipse和idea都能打开运行。推荐环境配置：eclipse/ideajdk1.8mavenmysql前端技术：vue，Ajax，Json后端
  • React-Router 安装及使用 书生丶
    安装[email protected]引入核心路由器组件import{BrowserRouter,HashRouter}from'react-router-dom'BrowserRouter:localhost:xxxx/user/liuna服务器可知所有请求细节HashRouter:localhost:xxxx/#/user/liuna使用#瞄点纯前端跳转,服务器不知
  • 是什么让尤大选择放弃Webpack？面向未来的前端构建工具 Vite 码民的飘柔 前端vue前端vue.jswebpack面试Vite
    写在开头前两天在知乎看到过一篇文章，大致意思是讲：字节跳动已经开始“弃用Webpack”，尝试在自研构建工具中使用类似Vite的ESmodule构建方式。引起下方一大片焦虑：Webpack是不是要被取代了？现在学Vite就行了吧Webpack还没学会，就又来新的了！甚至有人搬出了去年尤大所发的一个动态：再也回不去Webpack了。PS：最近的vite比较火，而且发布了2.0版本，vue的作者尤雨溪
  • 关于 Vue/React 的 cli 中运用 webpack 打包的原理简单解析 F-125 webpackvue.jsreact.jswebpack
    webpack、webpack-cli的打包关于webpack对前端工程中进行资源文件进行打包处理的过程中，运用到的核心插件主要是webpack和webpack-cli，在react和vue对于打包各自工程中的cli则是进行了自定义的构建，专门用于项目打包的cli。可简单的进行自定义运行webpack的编译运行文件。例如：通过webpack-cli运用webpack进行文件资源打包压缩处理，执行s
  • 2024React前端面试题 司宁 前端面试题前端
    1.Diff算法Diff算法比较过程第一步：patch函数中对新老节点进行比较如果新节点不存在就销毁老节点如果老节点不存在，直接创建新的节点当两个节点是相同节点的时候，进入patctVnode的过程，比较两个节点的内部第二步：patchVnode函数比较两个虚拟节点内部如果两个虚拟节点完全相同，返回当前vnode的children不是textNode，再分成三种情况-有新children，没有旧c
  • Vue3 + Axios双Token刷新解决方案 洛*璃 vue.js前端javascriptAxios双token刷新
    在现代前端开发中，使用API进行数据交互时，我们常常会遇到身份认证的问题。为了提高安全性，许多应用采用了Token机制，如JWT（JSONWebToken）来管理用户的身份状态。本文将介绍如何在Vue3项目中使用Axios实现双Token刷新机制，确保用户体验流畅的同时提高安全性。前置条件本文只针对Vue3前端所编写的双Token刷新解决方案，关于SpringCloud微服务项目的双Token刷新
  • 【前端面试题】前端工程化、Webpack、Vite、Git项目管理相关问题 快乐点吧 前端webpackgit
    目录关于前端工程化关于Webpack关于Vite关于Git项目管理综合性问题关于前端工程化1.前端工程化的定义和好处问题：什么是前端工程化？它的主要好处是什么？答案：前端工程化是指在前端开发中应用系统化、自动化和标准化的方法，包括模块化、组件化、自动化构建、测试等，以提高开发效率和代码质量。主要好处包括提升开发效率、增强代码可维护性、提高代码质量和团队协作效率。2.前端项目的目录结构问题：你通常如
  • 遍历dom 并且存储（将每一层的DOM元素存在数组中） 换个号韩国红果果 JavaScripthtml
    数组从0开始！！ var a=[],i=0; for(var j=0;j<30;j++){ a[j]=[];//数组里套数组，且第i层存储在第a[i]中 } function walkDOM(n){ do{ if(n.nodeType!==3)//筛选去除#text类型 a[i].push(n); //con
  • Android+Jquery Mobile学习系列(9)-总结和代码分享 白糖_ JQuery Mobile
    目录导航   经过一个多月的边学习边练手，学会了Android基于Web开发的毛皮，其实开发过程中用Android原生API不是很多，更多的是HTML/Javascript/Css。   个人觉得基于WebView的Jquery Mobile开发有以下优点： 1、对于刚从Java Web转型过来的同学非常适合，只要懂得HTML开发就可以上手做事。 2、jquerym
  • impala参考资料 dayutianfei impala
    记录一些有用的Impala资料   1. 入门资料 >>官网翻译：     http://my.oschina.net/weiqingbin/blog?catalog=423691   2. 实用进阶 >>代码&架构分析：     Impala/Hive现状分析与前景展望：http
  • JAVA 静态变量与非静态变量初始化顺序之新解 周凡杨 java静态非静态顺序
    今天和同事争论一问题，关于静态变量与非静态变量的初始化顺序，谁先谁后，最终想整理出来！测试代码： import java.util.Map; public class T { public static T t = new T(); private Map map = new HashMap(); public T(){ System.out.println(&quo
  • 跳出iframe返回外层页面 g21121 iframe
    在web开发过程中难免要用到iframe，但当连接超时或跳转到公共页面时就会出现超时页面显示在iframe中，这时我们就需要跳出这个iframe到达一个公共页面去。 首先跳转到一个中间页，这个页面用于判断是否在iframe中，在页面加载的过程中调用如下代码： <script type="text/javascript"> //<!-- function
  • JAVA多线程监听JMS、MQ队列 510888780 java多线程
    背景：消息队列中有非常多的消息需要处理，并且监听器onMessage（）方法中的业务逻辑也相对比较复杂，为了加快队列消息的读取、处理速度。可以通过加快读取速度和加快处理速度来考虑。因此从这两个方面都使用多线程来处理。对于消息处理的业务处理逻辑用线程池来做。对于加快消息监听读取速度可以使用1.使用多个监听器监听一个队列；2.使用一个监听器开启多线程监听。 对于上面提到的方法2使用一个监听器开启多线
  • 第一个SpringMvc例子 布衣凌宇 spring mvc
    第一步：导入需要的包； 第二步：配置web.xml文件 <?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi=
  • 我的spring学习笔记15-容器扩展点之PropertyOverrideConfigurer aijuans Spring3
    PropertyOverrideConfigurer类似于PropertyPlaceholderConfigurer，但是与后者相比，前者对于bean属性可以有缺省值或者根本没有值。也就是说如果properties文件中没有某个bean属性的内容，那么将使用上下文（配置的xml文件）中相应定义的值。如果properties文件中有bean属性的内容，那么就用properties文件中的值来代替上下
  • 通过XSD验证XML antlove xmlschemaxsdvalidationSchemaFactory
    1. XmlValidation.java package xml.validation; import java.io.InputStream; import javax.xml.XMLConstants; import javax.xml.transform.stream.StreamSource; import javax.xml.validation.Schem
  • 文本流与字符集 百合不是茶 PrintWrite()的使用字符集名字 别名获取
    文本数据的输入输出;           输入;数据流,缓冲流         输出;介绍向文本打印格式化的输出PrintWrite();   package 文本流; import java.io.FileNotFound
  • ibatis模糊查询sqlmap-mapping-**.xml配置 bijian1013 ibatis
            正常我们写ibatis的sqlmap-mapping-*.xml文件时，传入的参数都用##标识，如下所示： <resultMap id="personInfo" class="com.bijian.study.dto.PersonDTO"> <res
  • java jvm常用命令工具——jdb命令(The Java Debugger) bijian1013 javajvmjdb
            用来对core文件和正在运行的Java进程进行实时地调试，里面包含了丰富的命令帮助您进行调试，它的功能和Sun studio里面所带的dbx非常相似，但 jdb是专门用来针对Java应用程序的。         现在应该说日常的开发中很少用到JDB了，因为现在的IDE已经帮我们封装好了，如使用ECLI
  • 【Spring框架二】Spring常用注解之Component、Repository、Service和Controller注解 bit1129 controller
    在Spring常用注解第一步部分【Spring框架一】Spring常用注解之Autowired和Resource注解（http://bit1129.iteye.com/blog/2114084）中介绍了Autowired和Resource两个注解的功能，它们用于将依赖根据名称或者类型进行自动的注入，这简化了在XML中，依赖注入部分的XML的编写，但是UserDao和UserService两个bea
  • cxf wsdl2java生成代码super出错,构造函数不匹配 bitray super
        由于过去对于soap协议的cxf接触的不是很多,所以遇到了也是迷糊了一会.后来经过查找资料才得以解决. 初始原因一般是由于jaxws2.2规范和jdk6及以上不兼容导致的.所以要强制降为jaxws2.1进行编译生成.我们需要少量的修改: 我们原来的代码 wsdl2java com.test.xxx -client http://..... 修改后的代
  • 动态页面正文部分中文乱码排障一例 ronin47
    公司网站一部分动态页面，早先使用apache+resin的架构运行，考虑到高并发访问下的响应性能问题，在前不久逐步开始用nginx替换掉了apache。 不过随后发现了一个问题，随意进入某一有分页的网页，第一页是正常的（因为静态化过了）；点“下一页”，出来的页面两边正常，中间部分的标题、关键字等也正常，唯独每个标题下的正文无法正常显示。 因为有做过系统调整，所以第一反应就是新上
  • java-54- 调整数组顺序使奇数位于偶数前面 bylijinnan java
    import java.util.Arrays; import java.util.Random; import ljn.help.Helper; public class OddBeforeEven { /** * Q 54 调整数组顺序使奇数位于偶数前面 * 输入一个整数数组，调整数组中数字的顺序，使得所有奇数位于数组的前半部分，所有偶数位于数组的后半
  • 从100PV到1亿级PV网站架构演变 cfyme 网站架构
    一个网站就像一个人，存在一个从小到大的过程。养一个网站和养一个人一样，不同时期需要不同的方法，不同的方法下有共同的原则。本文结合我自已14年网站人的经历记录一些架构演变中的体会。 1：积累是必不可少的 架构师不是一天练成的。 1999年，我作了一个个人主页，在学校内的虚拟空间，参加了一次主页大赛，几个DREAMWEAVER的页面，几个TABLE作布局，一个DB连接，几行PHP的代码嵌入在HTM
  • [宇宙时代]宇宙时代的GIS是什么？ comsci Gis
           我们都知道一个事实，在行星内部的时候，因为地理信息的坐标都是相对固定的，所以我们获取一组GIS数据之后，就可以存储到硬盘中，长久使用。。。但是，请注意，这种经验在宇宙时代是不能够被继续使用的          宇宙是一个高维时空
  • 详解create database命令 czmmiao database
    完整命令 CREATE DATABASE mynewdb   USER SYS IDENTIFIED BY sys_password   USER SYSTEM IDENTIFIED BY system_password   LOGFILE GROUP 1 ('/u01/logs/my/redo01a.log','/u02/logs/m
  • 几句不中听却不得不认可的话 datageek
    1、人丑就该多读书。 2、你不快乐是因为：你可以像猪一样懒，却无法像只猪一样懒得心安理得。 3、如果你太在意别人的看法，那么你的生活将变成一件裤衩，别人放什么屁，你都得接着。 4、你的问题主要在于：读书不多而买书太多，读书太少又特爱思考，还他妈话痨。 5、与禽兽搏斗的三种结局：(1)、赢了，比禽兽还禽兽。(2)、输了，禽兽不如。(3)、平了，跟禽兽没两样。结论：选择正确的对手很重要。 6
  • 1 14:00 PHP中的“syntax error, unexpected T_PAAMAYIM_NEKUDOTAYIM”错误 dcj3sjt126com PHP
    原文地址：http://www.kafka0102.com/2010/08/281.html   因为需要，今天晚些在本机使用PHP做些测试，PHP脚本依赖了一堆我也不清楚做什么用的库。结果一跑起来，就报出类似下面的错误：“Parse error: syntax error, unexpected T_PAAMAYIM_NEKUDOTAYIM in /home/kafka/test/
  • xcode6 Auto layout and size classes dcj3sjt126com ios
    官方GUI   https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/AutolayoutPG/Introduction/Introduction.html   iOS中使用自动布局（一）   http://www.cocoachina.com/ind
  • 通过PreparedStatement批量执行sql语句【sql语句相同，值不同】 梦见x光 sql事务批量执行
    比如说：我有一个List需要添加到数据库中，那么我该如何通过PreparedStatement来操作呢？ public void addCustomerByCommit(Connection conn , List<Customer> customerList) {    String sql = "inseret into customer(id
  • 程序员必知必会----linux常用命令之十【系统相关】 hanqunfeng Linux常用命令
    一.linux快捷键 Ctrl+C : 终止当前命令 Ctrl+S : 暂停屏幕输出 Ctrl+Q : 恢复屏幕输出 Ctrl+U : 删除当前行光标前的所有字符 Ctrl+Z : 挂起当前正在执行的进程 Ctrl+L : 清除终端屏幕，相当于clear   二.终端命令 clear : 清除终端屏幕 reset : 重置视窗，当屏幕编码混乱时使用 time com
  • NGINX IXHONG nginx
    pcre 编译安装 nginx conf/vhost/test.conf   upstream admin { server 127.0.0.1:8080; }   server {                 listen       80; &
  • 设计模式--工厂模式 kerryg 设计模式
    工厂方式模式分为三种：   1、普通工厂模式：建立一个工厂类，对实现了同一个接口的一些类进行实例的创建。   2、多个工厂方法的模式：就是对普通工厂方法模式的改进，在普通工厂方法模式中，如果传递的字符串出错，则不能正确创建对象，而多个工厂方法模式就是提供多个工厂方法，分别创建对象。   3、静态工厂方法模式：就是将上面的多个工厂方法模式里的方法置为静态，
  • Spring InitializingBean/init-method和DisposableBean/destroy-method mx_xiehd javaspringbeanxml
    1.initializingBean/init-method 实现org.springframework.beans.factory.InitializingBean接口允许一个bean在它的所有必须属性被BeanFactory设置后，来执行初始化的工作，InitialzingBean仅仅指定了一个方法。 通常InitializingBean接口的使用是能够被避免的，（不鼓励使用，因为没有必要
  • 解决Centos下vim粘贴内容格式混乱问题 qindongliang1922 centosvim
    有时候，我们在向vim打开的一个xml，或者任意文件中，拷贝粘贴的代码时，格式莫名其毛的就混乱了，然后自己一个个再重新，把格式排列好，非常耗时，而且很不爽，那么有没有办法避免呢？ 答案是肯定的，设置下缩进格式就可以了，非常简单： 在用户的根目录下 直接vi  ~/.vimrc文件 然后将set pastetoggle=<F9> 写入这个文件中，保存退出，重新登录，
  • netty大并发请求问题 tianzhihehe netty
    多线程并发使用同一个channel java.nio.BufferOverflowException: null at java.nio.HeapByteBuffer.put(HeapByteBuffer.java:183) ~[na:1.7.0_60-ea] at java.nio.ByteBuffer.put(ByteBuffer.java:832) ~[na:1.7.0_60-ea]
  • Hadoop NameNode单点问题解决方案之一 AvatarNode wyz2009107220 NameNode
    我们遇到的情况 Hadoop NameNode存在单点问题。这个问题会影响分布式平台24*7运行。先说说我们的情况吧。 我们的团队负责管理一个1200节点的集群(总大小12PB)，目前是运行版本为Hadoop 0.20，transaction logs写入一个共享的NFS filer(注：NetApp NFS Filer)。 经常遇到需要中断服务的问题是给hadoop打补丁。 DataNod
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他