SpringBoot3---核心特性---2、Web开发III(模板引擎、国际化、错误处理)
SpringBoot3---核心特性---2、Web开发III(模板引擎、国际化、错误处理)
星光下的赶路人star的个人主页
夏天就是吹拂着不可预期的风
文章目录
1、模板引擎
1.1 Thymeleaf
1.2 基础语法
1.3 属性设置
1.4 遍历
1.5 判断
1.6 属性优先级
1.7 行内写法
1.8 变量选择
1.9 模板布局
1.10 devtools
2、国家化
3、错误处理
3.1 默认机制
3.2 自定义错误响应
3.3 最佳实战
1、模板引擎
由于SpringBoot使用了嵌入式Servlet容器。所以JSP默认是不能使用的。
如果需要服务端页面渲染,优先考虑使用模板引擎。
模板引擎页面默认放在src/main/resources/templates SpringBoot包含以下模板引擎的自动配置
FreeMarker
Groovy
Thymeleaf
Mustache
Thymeleaf官网:https://www.thymeleaf.org/
DOCTYPE html >
< html xmlns: th= " http://www.thymeleaf.org" >
< head>
< title> Good Thymes Virtual Grocery title>
< meta http-equiv = " Content-Type" content = " text/html; charset=UTF-8" />
< link rel = " stylesheet" type = " text/css" media = " all" th: href= " @{/css/gtvg.css}" />
head>
< body>
< p th: text= " #{home.welcome}" > Welcome to our grocery store! p>
html>
1.1 Thymeleaf
导入依赖
< dependency>
< groupId> org.springframework.boot groupId>
< artifactId> spring-boot-starter-thymeleaf artifactId>
dependency>
自动配置原理 1、开启了org.springframework.boot.autoconfigure.thymeleaf.ThymeleafAutoConfiguration 自动配置。 2、属性绑定在ThymeleafProperties中,对应配置文件spring.thymeleaf内容 3、所以的模板页面默认在classpath:/templates文件夹下 4、默认效果
a、所有的模板页面在/classpath:/templates/下面找
1.2 基础语法
1、核心用法 th:xxx:动态渲染指定的html标签属性值、或者th指令(遍历、判断等)
th:text:标签体内文本值渲染
thutext:不会转义,显示为html原本的样子
th:属性:标签指定属性渲染
th:attr:标签任意属性渲染
th:if、th:each、…:其他th指令
例如
< p th: text= " ${content}" > 原内容 p>
< a th: href= " ${url}" > 登录 a>
< img src = " ../../images/gtvglogo.png"
th: attr= " src=@{/images/gtvglogo.png},title=#{logo},alt=#{logo}" />
表达式:用来动态取值
${}:变量取值:使用model共享给页面的值都直接用${}
@{}:url路径
#{}:国际化消息
~{}:片段引用
*{}:变量选择:需要配置th:object不到对象
系统工具&内置对象:详细文档 ● param:请求参数对象 ● session:session对象 ● application:application对象 ● #execInfo:模板执行信息 ● #messages:国际化消息 ● #uris:uri/url工具 ● #conversions:类型转换工具 ● #dates:日期工具,是java.util.Date对象的工具类 ● #calendars:类似#dates,只不过是java.util.Calendar对象的工具类 ● #temporals: JDK8+ java.time API 工具类 ● #numbers:数字操作工具 ● #strings:字符串操作 ● #objects:对象操作 ● #bools:bool操作 ● #arrays:array工具 ● #lists:list工具 ● #sets:set工具 ● #maps:map工具 ● #aggregates:集合聚合工具(sum、avg) ● #ids:id生成工具
2、语法示例 表达式:
变量取值:${…}
url取值:@{…}
国际化消息:#{…}
变量选择:*{…}
片段引用:~{…}
常见:
文本:‘one text’,‘another one’…
数字:0,34,…
布尔:true,false
null:null
变量名:one,sometext,main,…
文本操作:
拼串:+
文本替换:|The name is ${name}|
布尔操作
比较运算
比较:>,<,<=,>=(gt,lt,ge,le)
等值运算:=,!=
条件运算
if-then :(if)?(then)
if-then-else:(if)?(then):(else)
特殊操作
所有以上都可以嵌套组合
'User is of type ' + ( ${ user. isAdmin ( ) } ? 'Administrator ' : ( ${ user. type} ? : 'Unknown ') )
1.3 属性设置
th:href=“@{/product/list}”
th:attr=“class=${active}”
th:attr=“src=@{/images/gtvglogo.png},title=${logo},alt=#{logo}”
th:checked=“${user.active}”
< p th: text= " ${content}" > 原内容 p>
< a th: href= " ${url}" > 登录 a>
< img src = " ../../images/gtvglogo.png"
th: attr= " src=@{/images/gtvglogo.png},title=#{logo},alt=#{logo}" />
1.4 遍历
语法:th:each=“元素名,迭代状态:${集合}”
< tr th: each= " prod : ${prods}" >
< td th: text= " ${prod.name}" > Onions td>
< td th: text= " ${prod.price}" > 2.41 td>
< td th: text= " ${prod.inStock}? #{true} : #{false}" > yes td>
tr>
< tr th: each= " prod,iterStat : ${prods}" th: class= " ${iterStat.odd}? 'odd'" >
< td th: text= " ${prod.name}" > Onions td>
< td th: text= " ${prod.price}" > 2.41 td>
< td th: text= " ${prod.inStock}? #{true} : #{false}" > yes td>
tr>
iterStat有以下属性: ● ndex:当前遍历元素的索引,从0开始 ● count:当前遍历元素的索引,从1开始 ● size:需要遍历元素的总数量 ● current:当前正在遍历的元素对象 ● even/odd:是否偶数/奇数行 ● first:是否第一个元素 ● last:是否最后一个元素
1.5 判断
th:if
< a
href = " comments.html"
th: href= " @{/product/comments(prodId=${prod.id})}"
th: if= " ${not #lists.isEmpty(prod.comments)}"
> view
th:switch
< div th: switch= " ${user.role}" >
< p th: case= " ' admin'" > User is an administrator p>
< p th: case= " #{roles.manager}" > User is a manager p>
< p th: case= " *" > User is some other thing p>
div>
1.6 属性优先级
< ul>
< li th: each= " item : ${items}" th: text= " ${item.description}" > Item description here... li>
ul>
Order Feature Attributes 1 片段包含 th:insert th:replace 2 遍历 th:each 3 判断 th:if th:unless th:switch th:case 4 定义本地变量 th:object th:with 5 通用方式属性修改 th:attr th:attrprepend th:attrappend 6 指定属性修改 th:value th:href th:src … 7 文本值 th:text th:utext 8 片段指定 th:fragment 9 片段移除 th:remove
1.7 行内写法
[[…]] or [(…)]
< p> Hello, [[${session.user.name}]]! p>
1.8 变量选择
< div th: object= " ${session.user}" >
< p> Name: < span th: text= " *{firstName}" > Sebastian span> . p>
< p> Surname: < span th: text= " *{lastName}" > Pepper span> . p>
< p> Nationality: < span th: text= " *{nationality}" > Saturn span> . p>
div>
等同于
< div>
< p> Name: < span th: text= " ${session.user.firstName}" > Sebastian span> . p>
< p> Surname: < span th: text= " ${session.user.lastName}" > Pepper span> . p>
< p> Nationality: < span th: text= " ${session.user.nationality}" > Saturn span> . p>
1.9 模板布局
定义模板:th:fragment
引用模板:~{templatename::selector}
插入模板:th:insert、th:replace
< footer th: fragment= " copy" > © 2011 The Good Thymes Virtual Grocery footer>
< body>
< div th: insert= " ~{footer :: copy}" > div>
< div th: replace= " ~{footer :: copy}" > div>
body>
< body>
结果:
< body>
< div>
< footer> © 2011 The Good Thymes Virtual Grocery footer>
div>
< footer> © 2011 The Good Thymes Virtual Grocery footer>
body>
body>
1.10 devtools
< dependency>
< groupId> org.springframework.boot groupId>
< artifactId> spring-boot-devtools artifactId>
dependency>
修改页面后;ctrl+F9刷新效果; java代码的修改,如果devtools热启动了,可能会引起一些bug,难以排查
2、国家化
国际化的自动配置参照MessageSourceAutoConfiguration
实现步骤: 1、Spring Boot在类路径根下查找messages资源绑定文件。文件名为:message.properties. 2、多语言可以定义多个消息文件,命名为message_区域代码.properties。如:
messages.properties:默认
messages_zh_CN.properties:中文环境
messages_en_US.properties:英文环境
3、在程序中自动注入MessageSource组件,获取国际化的配置项值 4、在页面中可以使用表达式#{}获取国际化的配置项值
@Autowired
MessageSource messageSource;
@GetMapping ( "/haha" )
public String haha ( HttpServletRequest request) {
Locale locale = request. getLocale ( ) ;
String login = messageSource. getMessage ( "login" , null , locale) ;
return login;
}
3、错误处理
3.1 默认机制
错误处理的自动配置都在ErrorMvcAutoConfiguration中,两大核心机制:
SpringBoot会自适应处理错误,响应页面或JSON数据
SpringMVC的错位处理机制依然保留,MVC处理不了,才会交给Boot进行处理
发送错误以后,转发给/error路径,SpringBoot在底层写好应该BasicErrorController,专门处理这个请求
@RequestMapping ( produces = MediaType . TEXT_HTML_VALUE )
public ModelAndView errorHtml ( HttpServletRequest request, HttpServletResponse response) {
HttpStatus status = getStatus ( request) ;
Map < String , Object > model = Collections
. unmodifiableMap ( getErrorAttributes ( request, getErrorAttributeOptions ( request, MediaType . TEXT_HTML ) ) ) ;
response. setStatus ( status. value ( ) ) ;
ModelAndView modelAndView = resolveErrorView ( request, response, status, model) ;
return ( modelAndView != null ) ? modelAndView : new ModelAndView ( "error" , model) ;
}
@RequestMapping
public ResponseEntity < Map < String , Object > > error ( HttpServletRequest request) {
HttpStatus status = getStatus ( request) ;
if ( status == HttpStatus . NO_CONTENT ) {
return new ResponseEntity < > ( status) ;
}
Map < String , Object > body = getErrorAttributes ( request, getErrorAttributeOptions ( request, MediaType . ALL ) ) ;
return new ResponseEntity < > ( body, status) ;
}
ModelAndView modelAndView = resolveErrorView ( request, response, status, model) ;
return ( modelAndView != null ) ? modelAndView : new ModelAndView ( "error" , model) ;
容器中专门有一个错误视图解析器
@Bean
@ConditionalOnBean ( DispatcherServlet . class )
@ConditionalOnMissingBean ( ErrorViewResolver . class )
DefaultErrorViewResolver conventionErrorViewResolver ( ) {
return new DefaultErrorViewResolver ( this . applicationContext, this . resources) ;
}
SpringBoot解析自定义错误页的默认规则
@Override
public ModelAndView resolveErrorView ( HttpServletRequest request, HttpStatus status, Map < String , Object > model) {
ModelAndView modelAndView = resolve ( String . valueOf ( status. value ( ) ) , model) ;
if ( modelAndView == null && SERIES_VIEWS . containsKey ( status. series ( ) ) ) {
modelAndView = resolve ( SERIES_VIEWS . get ( status. series ( ) ) , model) ;
}
return modelAndView;
}
private ModelAndView resolve ( String viewName, Map < String , Object > model) {
String errorViewName = "error/" + viewName;
TemplateAvailabilityProvider provider = this . templateAvailabilityProviders. getProvider ( errorViewName,
this . applicationContext) ;
if ( provider != null ) {
return new ModelAndView ( errorViewName, model) ;
}
return resolveResource ( errorViewName, model) ;
}
private ModelAndView resolveResource ( String viewName, Map < String , Object > model) {
for ( String location : this . resources. getStaticLocations ( ) ) {
try {
Resource resource = this . applicationContext. getResource ( location) ;
resource = resource. createRelative ( viewName + ".html" ) ;
if ( resource. exists ( ) ) {
return new ModelAndView ( new HtmlResourceView ( resource) , model) ;
}
}
catch ( Exception ex) {
}
}
return null ;
}
容器中有一个默认的名为error的view;提供了默认白页功能
@Bean ( name = "error" )
@ConditionalOnMissingBean ( name = "error" )
public View defaultErrorView ( ) {
return this . defaultErrorView;
}
封装了JSON格式的错误信息
@Bean
@ConditionalOnMissingBean ( value = ErrorAttributes . class , search = SearchStrategy . CURRENT )
public DefaultErrorAttributes errorAttributes ( ) {
return new DefaultErrorAttributes ( ) ;
}
规则: 1、解析一个错误页 (1)如果发生了500、404、503、403这些错误
如果有模板引擎,默认在classpath:/templates/error/精确码.html
如果没有模板引擎,在静态资源文件夹下找精确码.html (2)如果匹配不到精确码.html这些精确的错误页,就去找5xx.html,4xx.html模糊匹配
如果有模板引擎,默认在classpath:/template/error/5xx.html
如果没有模板引擎,在静态资源目录下找5xx.html
2、如果模板引擎路径templates下有error.html页面,就直接去渲染
3.2 自定义错误响应
1、自定义json响应 使用@ControllerAdvice+@ExceptionHandler进行统一异常处理
2、自定义页面响应 根据boot的错误页面规则,自定义页面模板
3.3 最佳实战
前后分离
后台发生的所有错误,@ControllerAdvice+@Exceptionhandler进行统一异常处理
服务端页面渲染
不可预知的一些,HTTP码表示的服务器或客户端错误
给classpath:/templates/error/下面,放常用精确的错误码页面。500.html,404.html
核心业务,每一种错误,都应该代码控制,跳转到自己定制的错误页
通用业务,classpath:/templates/error.html页面,显示错误信息
页面,JSON,可用的Model数据如下
您的支持是我创作的无限动力
希望我能为您的未来尽绵薄之力
如有错误,谢谢指正;若有收获,谢谢赞美
你可能感兴趣的:(SpringBoot3,前端,springboot,java,后端)
【后端】k8s
骑鱼过海的猫123
kubernetes 容器 云原生
1.命令1.1获取service服务获取集群内所有命名空间的service服务sudokubectlgetservice--all-namespaces获取集群内指定命名空间的service服务sudokubectlgetservice-n命名空间当权限限制到一个命名空间时,只能使用下面这个sudokubectl-n命名空间getservice获取集群内当前命名空间的service服务sudoku
null和undefined的区别
编程星空
JavaScript 前端 javascript 开发语言
null和undefined是JavaScript中两个特殊的值,它们都表示“无”或“空”,但在语义和使用场景上有明显区别。以下是它们的详细对比:1.定义undefined表示变量已声明但未赋值,或函数没有返回值时的默认返回值。是JavaScript引擎默认赋予的初始值。类型为undefined。null表示一个空对象指针,通常用于显式表示“无”或“空”。是开发者主动赋值的值。类型为object(
深入理解Spring Boot中的事件驱动架构
省赚客APP开发者@聚娃科技
spring boot 架构 java
深入理解SpringBoot中的事件驱动架构大家好,我是微赚淘客系统3.0的小编,也是冬天不穿秋裤,天冷也要风度的程序猿!1.引言事件驱动架构在现代软件开发中越来越受欢迎,它能够提高系统的松耦合性和可扩展性。SpringBoot作为一个流行的Java框架,提供了强大的事件驱动支持。本文将深入探讨SpringBoot中事件驱动架构的实现原理和最佳实践。2.SpringFramework中的事件模型在
dreamweaver html语言,Dreamweaver网页设计与制作(HTML+CSS+JavaScript)
weixin_39979245
dreamweaver html语言
Dreamweaver网页设计与制作(HTML+CSS+JavaScript)编辑锁定讨论上传视频本词条缺少信息栏,补充相关内容使词条更完整,还能快速升级,赶紧来编辑吧!《Dreamweaver网页设计与制作(HTML+CSS+JavaScript)》是2014年清华大学出版社出版的图书。Dreamweaver网页设计与制作(HTML+CSS+JavaScript)图书详细信息编辑ISBN:978
html 5中css的含义,HTML 5+CSS+JavaScript网页设计与制作
律保阁-Michael
html 5中css的含义
HTML5+CSS+JavaScript网页设计与制作编辑锁定讨论上传视频《HTML5+CSS+JavaScript网页设计与制作》是2019年4月清华大学出版社出版的图书,作者是彭进香、张茂红、王玉娟、叶娟、孙秀娟、万幸、刘英。书名HTML5+CSS+JavaScript网页设计与制作作者彭进香张茂红王玉娟叶娟作者孙秀娟展开作者孙秀娟万幸刘英收起出版社清华大学出版社出版时间2019年4月定价48
html+css+javascript实用详解,HTML+CSS+JavaScript 课程标准
vvv666s
②学会运用HTML语言中的标记设置颜色、文本格式和列表;熟练掌握颜色值的配置和背景图案的设置方法,熟练掌握字符、链接颜色的设置方法;③掌握在网页中添加CSS、嵌入图像、声音、多媒体信息的方法;④熟练掌握表格的使用方法,学会利用表格设布局网页;掌握框架制作网页的方法,会使用框架设计网页;掌握制作表单的方法,会利用表单建立交互式页面;⑤掌握JavaScript语言的语法;⑥掌握在HTML语言代码中嵌入
Android Gradle使用总结
Wei_Leng
Android studio android gradle 脚本
其他Groovy入门学习http://blog.csdn.net/zhaoyanjun6/article/details/70313790AndroidGradleAndroid项目使用Gradle作为构建框架,Gradle又是以Groovy为脚本语言。所以学习Gradle之前需要先熟悉Groovy脚本语言。Groovy是基于Java语言的脚本语言,所以它的语法和Java非常相似,但是具有比jav
JavaScript的魔法世界:巧妙之处与实战技巧
skyksksksksks
综合个人杂记 javascript 开发语言 html5 css 前端
一、从浏览器玩具到全栈利器的蜕变之路JavaScript诞生于1995年,原本只是网景公司为浏览器设计的"小脚本"。谁能想到这个曾被戏称为"玩具语言"的家伙,如今已蜕变成支撑现代Web开发的擎天柱?就像一只破茧成蝶的幼虫,JavaScript经历了ECMAScript标准的持续进化,在Node.js的加持下突破了浏览器的桎梏,实现了从客户端到服务端的华丽转身。V8引擎的涡轮增压让它跑得比猎豹还快,
Redis 全方位解析:从入门到实战
kiss strong
redis 数据库 缓存
引言在当今互联网快速发展的时代,高并发、低延迟的应用场景越来越普遍。Redis,作为一款高性能的开源数据库,以其卓越的性能和灵活的功能,成为了许多开发者的首选工具。无论是在缓存、消息队列,还是在实时数据分析等领域,Redis都展现出了强大的能力。本文将从Redis的基本介绍、官网、安装、特性,到具体的存储类型、Java代码实例、SpringBoot整合,以及Redis的主要作用和应用场景,进行全面
前端性能优化——如何提高页面加载速度?
忘川...
前端 性能优化 html
1.将样式表放在头部首先说明一下,将样式表放在头部对于实际页面加载的时间并不能造成太大影响,但是这会减少页面首屏出现的时间,使页面内容逐步呈现,改善用户体验,防止“白屏”。我们总是希望页面能够尽快显示内容,为用户提供可视化的回馈,这对网速慢的用户来说是很重要的。将样式表放在文档底部会阻止浏览器中的内容逐步出现。为了避免当样式变化时重绘页面元素,浏览器会阻塞内容逐步呈现,造成“白屏”。这源自浏览器的
前端开发入门指南:HTML、CSS和JavaScript基础知识
方向感超强的
javascript css html 前端
引言:大家好,我是一名简单的前端开发爱好者,对于网页设计和用户体验的追求让我深深着迷。在本篇文章中,我将带领大家探索前端开发的基础知识,涵盖HTML、CSS和JavaScript。如果你对这个领域感兴趣,或者想要了解如何开始学习前端开发,那么这篇文章将为你提供一个良好的起点。1.前端开发概述在我们深入了解前端开发的细节之前,让我们先了解一下前端开发的定义和作用。简而言之,前端开发涉及构建用户直接与
《Java高级-Xml:利用DOM4j解析XML》
大大大钢琴
# Java:经验总结 java xml 开发语言
利用DOM4j解析XMLdom4j是一个简单的开源库,用于处理XML、XPath和XSLT,它基于Java平台,使用Java的集合框架,全面集成了DOM,SAX和JAXP。dom4j是目前在xml解析方面是最优秀的(Hibernate、Sun的JAXM也都使用dom4j来解析XML),它合并了许多超出基本XML文档表示的功能,包括集成的XPath支持、XMLSchema支持以及用于大文档或流化文档
小程序类毕业设计选题题目推荐 (29)
初尘屿风
毕业设计 后端 小程序 课程设计 spring boot 微信 后端 学习
基于微信小程序的设备故障报修管理系统设计与实现,SpringBoot+Vue+毕业论文基于微信小程序的设备故障报修管理系统设计与实现,SSM+Vue+毕业论文基于微信小程序的电影院购票小程序系统,SpringBoot+Vue+毕业论文+指导搭建视频基于微信小程序的宿舍报修管理系统设计与实现,SpringBoot(15500字)+Vue+毕业论文+指导搭建视频基于微信小程序的电影院订票选座系统的设计
React 渲染 Flash 接口数据
ox0080
# 北漂+滴滴出行 VIP 激励 Web react.js 前端 前端框架
1.后端Python代码使用Flask创建多个接口,每个接口返回不同的数据,并使用自定义装饰器来绑定路由。代码:#app.pyfromflaskimportFlask,jsonifyapp=Flask(__name__)defapi_route(route,methods=['GET']):"""自定义装饰器,用于将函数与HTTP路由绑定"""defdecorator(func):app.rout
前端504错误分析
ox0080
# 北漂+滴滴出行 Web VIP 激励 前端
前端出现504错误(网关超时)通常是由于代理服务器未能及时从上游服务获取响应。以下是详细分析步骤和解决方案:1.确认错误来源504含义:代理服务器(如Nginx、Apache)在等待后端服务响应时超时。常见架构:前端→代理服务器→后端服务,问题通常出在代理与后端之间。2.排查步骤(1)检查后端服务状态确认服务是否运行:通过日志或监控工具(如systemctlstatus,KubernetesPod
LQB---基础练习---十六进制转八进制
「已注销」
# LQB LQB
试题基础练习十六进制转八进制资源限制内存限制:512.0MBC/C++时间限制:1.0sJava时间限制:3.0sPython时间限制:5.0s问题描述给定n个十六进制正整数,输出它们对应的八进制数。输入格式输入的第一行为一个正整数n(1<=n<=10)。接下来n行,每行一个由09、大写字母AF组成的字符串,表示要转换的十六进制正整数,每个十六进制数长度不超过100000。输出格式输出n行,每行为
js如何直接下载文件流
涔溪
js javascript 前端 开发语言
在JavaScript中直接处理文件下载,尤其是在处理文件流的情况下,通常涉及到使用fetchAPI或者XMLHttpRequest来获取文件流,并通过创建一个临时的标签(锚点元素)触发下载。以下是使用fetchAPI的一个示例:fetch('你的文件URL',{method:'GET',headers:{//如果需要的话,可以在这里添加请求头}}).then(response=>response
部署前端项目2
augenstern416
前端
前端项目的部署是将开发完成的前端代码发布到服务器或云平台,使其能够通过互联网访问。以下是前端项目部署的常见步骤和工具:1.准备工作在部署之前,确保项目已经完成以下步骤:代码优化:压缩JavaScript、CSS和图片文件,减少文件体积。环境配置:区分开发环境和生产环境(如API地址、环境变量等)。测试:确保项目在本地测试通过,没有明显Bug。2.部署流程1.构建项目大多数前端项目(如React、V
对象的操作
augenstern416
javascript 开发语言 ecmascript
在前端开发中,JavaScript提供了许多内置对象和方法,用于处理数据、操作DOM、处理事件等。以下是一些常用对象及其方法和扩展技巧:1.Object对象Object是JavaScript中最基础的对象,几乎所有对象都继承自Object。常用方法Object.keys(obj):返回对象的所有可枚举属性的键名数组。constobj={a:1,b:2};console.log(Object.key
SpringBoot+Mybatis 实现简单的学生书籍管理系统
Chronoluckyy
spring boot mybatis 数据库
本文将介绍如何使用SpringBoot框架来构建一个简单的学生书籍管理系统,其中包括用户的注册和登录验证,并通过分层设计来实现系统的模块化和可维护性。一、准备工作1.使用Navicat创建数据库表2.导入依赖包和对应的数据库驱动在resources/application.propertiespom.xml下导入依赖包org.mybatis.spring.bootmybatis-spring-bo
前端基础入门:HTML、CSS 和 JavaScript
阿绵
前端 前端 html css js
在现代网页开发中,前端技术扮演着至关重要的角色。无论是个人网站、企业官网,还是复杂的Web应用程序,前端开发的基础技术HTML、CSS和JavaScript都是每个开发者必须掌握的核心技能。本文将详细介绍这三者的基本概念及其应用一、HTML——网页的骨架HTML(HyperTextMarkupLanguage)是构建网页的基础语言。它是网页的结构和内容的标记语言,决定了网页上的文本、图像、表单等元
网页制作03-html,css,javascript初认识のhtml的图像设置
Ama_tor
网页制作专栏 html css 前端
一、图像格式网页中图像的格式有三种,Gif,Jpeg,PngGif:Graphicinterchangeformat图像交换格式,文件最多可使用256种颜色,最适合显示色调不连续或具有大面积单一颜色的图像,例如导航条、按钮、图标、徽标或其他具有统一色彩和色调的图像;还可以制作动态图像Jpeg:Giantphotographicexpectgroup,它是一种图像压缩格式,可包含数百万种颜色,不支持
java进阶篇--生产环境如何排查bug和优化 JVM?
爱分享的淘金达人
Java源码剖析(30讲) jvm优化 jvm调优 优化jvm 生产环境优化jvm 生产环境jvm优化
通过前面几个课时的学习,相信你对JVM的理论及实践等相关知识有了一个大体的印象。而本课时将重点讲解JVM的排查与优化,这样就会对JVM的知识点有一个完整的认识,从而可以更好地应用于实际工作或者面试了。我们本课时的面试题是,生产环境如何排查问题?回答:如果是在生产环境中直接排查JVM的话,最简单的做法就是使用JDK自带的6个非常实用的命令行工具来排查。它们分别是:jps、jstat、jinfo、jm
JavaScript——操作浏览器窗口
yiqi_perss
JavaScript
学习内容:今天学习了alert提示框,提示框中的内容,就是alert后边小括号中的内容例如:alert('我要学JavaScript!');alert('我要学习!');学习总结:日常小总结例如:后面的分号;可以随便去掉,不影响运行效果。不能去掉小括号,否则会报错,不信你可以试试。必须是英文引号,否则会报错。课外扩展:历史渊源例如:ECMAScript是一种语言标准,而JavaScript是网景公
JVM内存模型分区
Lionel·
java基础 java jvm
JVM内存模型划分根据JVM规范,JVM内存共分为Java虚拟机栈,本地方法栈,堆,方法区,程序计数器,五个部分。1.Java堆(线程共享)Java堆是被所有线程共享的一块内存区域,在虚拟机启动时创建。此内存区域的唯一目的就是存放对象实例,几乎所有的对象实例以及数组都要在堆上分配。Java堆是垃圾收集器管理的主要区域,因此很多时候也被称做“GC堆”。从内存回收的角度看,由于现在收集器基本都采用分代
MapReduce 读取 Hive ORC ArrayIndexOutOfBoundsException: 1024 异常解决
一张假钞
mapreduce hive 大数据
个人博客地址:MapReduce读取HiveORCArrayIndexOutOfBoundsException:1024异常解决|一张假钞的真实世界在MR处理ORC的时候遇到如下异常:Exceptioninthread"main"java.lang.ArrayIndexOutOfBoundsException:1024atorg.apache.orc.impl.RunLengthIntegerRe
后端重载和重写的区别
kidding723
后端 重载 重写 Overriding Overloading
重载相同的方法名,形参数量不同或者参数顺序不同或者参数类型不同称为方法重载重写方法名和形参列表相同重写方法前提:必须存在继承关系(1)方法重载是:一个类中定义了多个方法名相同,而他们的参数的数量不同或数量相同而类型和次序不同,则称为方法的重载(Overloading)。(2)方法重写是:在子类存在方法与父类的方法的名字相同,而且参数的个数与类型一样,返回值也一样的方法,就称为重写(Overridi
记录一次进程被操作系统强制终止(OOM Killer)
别告诉我有BUG
jvm java
问题背景场景:在一次系统迁移中,团队将原本运行在16G内存物理机的Java服务迁移到8G内存虚拟机,直接复用了原有的JVM参数(如-Xmx12g)。服务启动后运行正常,但几小时后突然宕机,日志中无明确错误,仅显示进程终止。影响:服务不可用持续30分钟部分业务数据丢失,用户投诉激增分析过程1.初步排查现象确认:进程消失,无Java堆栈或异常日志。系统日志/var/log/messages中发现OOM
Flink CDC报错ArrayIndexOutOfBoundsException解决思路
学亮编程手记
大数据 flink doris
FlinkCDC用两个并行度会报错。一个并行度就不会报错。不知道是什么原因?同步java.lang.ArrayIndexOutOfBoundsException?解决思路看日志,应该是mysql文本字段中有换行符之类的,应该会有一个url的报错提示,然后curl那个url看具体报错。这个问题可能是由于FlinkCDC的并行度设置不正确导致的。当您尝试使用两个并行度时,可能会遇到数组越界异常(jav
【python】懒人福利,通过Python的JIRA库操作JIRA,自动批量提交关闭bug,提高效率
bulabula2022
# CI持续集成 Python jira
简介:Jira是目前比较流行的基于Java架构的管理系统(Atlassian公司支持),有开源代码,方便做二次开发(可扩展性)。Jira是一款功能非常强大的管理工具,广泛的用来缺陷跟踪、用例管理、需求收集、任务跟踪、工时管理、项目计划管理等工作领域。python有支持操作Jira的第三方包,方便自定义一些自动化操作。需要安装jira库:pipinstalljiraJira认证fromjiraimp
github中多个平台共存
jackyrong
github
在个人电脑上,如何分别链接比如oschina,github等库呢,一般教程之列的,默认
ssh链接一个托管的而已,下面讲解如何放两个文件
1) 设置用户名和邮件地址
$ git config --global user.name "xx"
$ git config --global user.email "
[email protected] "
ip地址与整数的相互转换(javascript)
alxw4616
JavaScript
//IP转成整型
function ip2int(ip){
var num = 0;
ip = ip.split(".");
num = Number(ip[0]) * 256 * 256 * 256 + Number(ip[1]) * 256 * 256 + Number(ip[2]) * 256 + Number(ip[3]);
n
读书笔记-jquey+数据库+css
chengxuyuancsdn
html jquery oracle
1、grouping ,group by rollup, GROUP BY GROUPING SETS区别
2、$("#totalTable tbody>tr td:nth-child(" + i + ")").css({"width":tdWidth, "margin":"0px", &q
javaSE javaEE javaME == API下载
Array_06
java
oracle下载各种API文档:
http://www.oracle.com/technetwork/java/embedded/javame/embed-me/documentation/javame-embedded-apis-2181154.html
JavaSE文档:
http://docs.oracle.com/javase/8/docs/api/
JavaEE文档:
ht
shiro入门学习
cugfy
java Web 框架
声明本文只适合初学者,本人也是刚接触而已,经过一段时间的研究小有收获,特来分享下希望和大家互相交流学习。
首先配置我们的web.xml代码如下,固定格式,记死就成
<filter>
<filter-name>shiroFilter</filter-name>
&nbs
Array添加删除方法
357029540
js
刚才做项目前台删除数组的固定下标值时,删除得不是很完整,所以在网上查了下,发现一个不错的方法,也提供给需要的同学。
//给数组添加删除
Array.prototype.del = function(n){
navigation bar 更改颜色
张亚雄
IO
今天郁闷了一下午,就因为objective-c默认语言是英文,我写的中文全是一些乱七八糟的样子,到不是乱码,但是,前两个自字是粗体,后两个字正常体,这可郁闷死我了,问了问大牛,人家告诉我说更改一下字体就好啦,比如改成黑体,哇塞,茅塞顿开。
翻书看,发现,书上有介绍怎么更改表格中文字字体的,代码如下
 
unicode转换成中文
adminjun
unicode 编码转换
在Java程序中总会出现\u6b22\u8fce\u63d0\u4ea4\u5fae\u535a\u641c\u7d22\u4f7f\u7528\u53cd\u9988\uff0c\u8bf7\u76f4\u63a5这个的字符,这是unicode编码,使用时有时候不会自动转换成中文就需要自己转换了使用下面的方法转换一下即可。
/**
* unicode 转换成 中文
一站式 Java Web 框架 firefly
aijuans
Java Web
Firefly是一个高性能一站式Web框架。 涵盖了web开发的主要技术栈。 包含Template engine、IOC、MVC framework、HTTP Server、Common tools、Log、Json parser等模块。
firefly-2.0_07修复了模版压缩对javascript单行注释的影响,并新增了自定义错误页面功能。
更新日志:
增加自定义系统错误页面功能
设计模式——单例模式
ayaoxinchao
设计模式
定义
Java中单例模式定义:“一个类有且仅有一个实例,并且自行实例化向整个系统提供。”
分析
从定义中可以看出单例的要点有三个:一是某个类只能有一个实例;二是必须自行创建这个实例;三是必须自行向系统提供这个实例。
&nb
Javascript 多浏览器兼容性问题及解决方案
BigBird2012
JavaScript
不论是网站应用还是学习js,大家很注重ie与firefox等浏览器的兼容性问题,毕竟这两中浏览器是占了绝大多数。
一、document.formName.item(”itemName”) 问题
问题说明:IE下,可以使用 document.formName.item(”itemName”) 或 document.formName.elements ["elementName&quo
JUnit-4.11使用报java.lang.NoClassDefFoundError: org/hamcrest/SelfDescribing错误
bijian1013
junit4.11 单元测试
下载了最新的JUnit版本,是4.11,结果尝试使用发现总是报java.lang.NoClassDefFoundError: org/hamcrest/SelfDescribing这样的错误,上网查了一下,一般的解决方案是,换一个低一点的版本就好了。还有人说,是缺少hamcrest的包。去官网看了一下,如下发现:
[Zookeeper学习笔记之二]Zookeeper部署脚本
bit1129
zookeeper
Zookeeper伪分布式安装脚本(此脚本在一台机器上创建Zookeeper三个进程,即创建具有三个节点的Zookeeper集群。这个脚本和zookeeper的tar包放在同一个目录下,脚本中指定的名字是zookeeper的3.4.6版本,需要根据实际情况修改):
#!/bin/bash
#!!!Change the name!!!
#The zookeepe
【Spark八十】Spark RDD API二
bit1129
spark
coGroup
package spark.examples.rddapi
import org.apache.spark.{SparkConf, SparkContext}
import org.apache.spark.SparkContext._
object CoGroupTest_05 {
def main(args: Array[String]) {
v
Linux中编译apache服务器modules文件夹缺少模块(.so)的问题
ronin47
modules
在modules目录中只有httpd.exp,那些so文件呢?
我尝试在fedora core 3中安装apache 2. 当我解压了apache 2.0.54后使用configure工具并且加入了 --enable-so 或者 --enable-modules=so (两个我都试过了)
去make并且make install了。我希望在/apache2/modules/目录里有各种模块,
Java基础-克隆
BrokenDreams
java基础
Java中怎么拷贝一个对象呢?可以通过调用这个对象类型的构造器构造一个新对象,然后将要拷贝对象的属性设置到新对象里面。Java中也有另一种不通过构造器来拷贝对象的方式,这种方式称为
克隆。
Java提供了java.lang.
读《研磨设计模式》-代码笔记-适配器模式-Adapter
bylijinnan
java 设计模式
声明: 本文只为方便我个人查阅和理解,详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/
package design.pattern;
/*
* 适配器模式解决的主要问题是,现有的方法接口与客户要求的方法接口不一致
* 可以这样想,我们要写这样一个类(Adapter):
* 1.这个类要符合客户的要求 ---> 那显然要
HDR图像PS教程集锦&心得
cherishLC
PS
HDR是指高动态范围的图像,主要原理为提高图像的局部对比度。
软件有photomatix和nik hdr efex。
一、教程
叶明在知乎上的回答:
http://www.zhihu.com/question/27418267/answer/37317792
大意是修完后直方图最好是等值直方图,方法是HDR软件调一遍,再结合不透明度和蒙版细调。
二、心得
1、去除阴影部分的
maven-3.3.3 mvn archetype 列表
crabdave
ArcheType
maven-3.3.3 mvn archetype 列表
可以参考最新的:http://repo1.maven.org/maven2/archetype-catalog.xml
[INFO] Scanning for projects...
[INFO]
linux shell 中文件编码查看及转换方法
daizj
shell 中文乱码 vim 文件编码
一、查看文件编码。
在打开文件的时候输入:set fileencoding
即可显示文件编码格式。
二、文件编码转换
1、在Vim中直接进行转换文件编码,比如将一个文件转换成utf-8格式
&
MySQL--binlog日志恢复数据
dcj3sjt126com
binlog
恢复数据的重要命令如下 mysql> flush logs; 默认的日志是mysql-bin.000001,现在刷新了重新开启一个就多了一个mysql-bin.000002
数据库中数据表数据迁移方法
dcj3sjt126com
sql
刚开始想想好像挺麻烦的,后来找到一种方法了,就SQL中的 INSERT 语句,不过内容是现从另外的表中查出来的,其实就是 MySQL中INSERT INTO SELECT的使用
下面看看如何使用
语法:MySQL中INSERT INTO SELECT的使用
1. 语法介绍
有三张表a、b、c,现在需要从表b
Java反转字符串
dyy_gusi
java 反转字符串
前几天看见一篇文章,说使用Java能用几种方式反转一个字符串。首先要明白什么叫反转字符串,就是将一个字符串到过来啦,比如"倒过来念的是小狗"反转过来就是”狗小是的念来过倒“。接下来就把自己能想到的所有方式记录下来了。
1、第一个念头就是直接使用String类的反转方法,对不起,这样是不行的,因为Stri
UI设计中我们为什么需要设计动效
gcq511120594
UI linux
随着国际大品牌苹果和谷歌的引领,最近越来越多的国内公司开始关注动效设计了,越来越多的团队已经意识到动效在产品用户体验中的重要性了,更多的UI设计师们也开始投身动效设计领域。
但是说到底,我们到底为什么需要动效设计?或者说我们到底需要什么样的动效?做动效设计也有段时间了,于是尝试用一些案例,从产品本身出发来说说我所思考的动效设计。
一、加强体验舒适度
嗯,就是让用户更加爽更加爽的用
JBOSS服务部署端口冲突问题
HogwartsRow
java 应用服务器 jboss server EJB3
服务端口冲突问题的解决方法,一般修改如下三个文件中的部分端口就可以了。
1、jboss5/server/default/conf/bindingservice.beans/META-INF/bindings-jboss-beans.xml
2、./server/default/deploy/jbossweb.sar/server.xml
3、.
第三章 Redis/SSDB+Twemproxy安装与使用
jinnianshilongnian
ssdb reids twemproxy
目前对于互联网公司不使用Redis的很少,Redis不仅仅可以作为key-value缓存,而且提供了丰富的数据结果如set、list、map等,可以实现很多复杂的功能;但是Redis本身主要用作内存缓存,不适合做持久化存储,因此目前有如SSDB、ARDB等,还有如京东的JIMDB,它们都支持Redis协议,可以支持Redis客户端直接访问;而这些持久化存储大多数使用了如LevelDB、RocksD
ZooKeeper原理及使用
liyonghui160com
ZooKeeper是Hadoop Ecosystem中非常重要的组件,它的主要功能是为分布式系统提供一致性协调(Coordination)服务,与之对应的Google的类似服务叫Chubby。今天这篇文章分为三个部分来介绍ZooKeeper,第一部分介绍ZooKeeper的基本原理,第二部分介绍ZooKeeper
程序员解决问题的60个策略
pda158
框架 工作 单元测试
根本的指导方针
1. 首先写代码的时候最好不要有缺陷。最好的修复方法就是让 bug 胎死腹中。
良好的单元测试
强制数据库约束
使用输入验证框架
避免未实现的“else”条件
在应用到主程序之前知道如何在孤立的情况下使用
日志
2. print 语句。往往额外输出个一两行将有助于隔离问题。
3. 切换至详细的日志记录。详细的日
Create the Google Play Account
sillycat
Google
Create the Google Play Account
Having a Google account, pay 25$, then you get your google developer account.
References:
http://developer.android.com/distribute/googleplay/start.html
https://p
JSP三大指令
vikingwei
jsp
JSP三大指令
一个jsp页面中,可以有0~N个指令的定义!
1. page --> 最复杂:<%@page language="java" info="xxx"...%>
* pageEncoding和contentType:
> pageEncoding:它