百度地址支持https协议，使用方法
<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=您的秘钥&s=1"></script>
通常情况下还是用HTTP协议时，引用方法如下：
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=Ua9wlu6LbqmNKVbMEGtkgSxvljqZC5fc"></script>
前几天项目中使用的bootstrapTable出错，检查后才发现随着项目运行数据越来越多，一次性将所有数据返回到前台进行分页出现问题，rest请求数据有限制，超过这个限制值的数据将会抛弃，导致返回到前台的数据不完整，系统出错。
为解决这个问题尝试研究了下bootstrapTable插件的server端分页功能，更深入的了解这个插件的使用。
<table id="agencyTable" class="table table-hover"></table>
$('#agencyTable').bootstrapTable({
method: 'post',
contentType: "application/x-www-form-urlencoded",//必须要有！！！！
url: "../rest/Uploadinfo/queryAgencyPage",//要请求数据的文件路径
height: 500,
toolbar: '#toolbar',//指定工具栏
striped: true, //是否显示行间隔色
dataField: "rows",
pageNumber: 1, //初始化加载第一页，默认第一页
pagination:true,//是否分页
queryParamsType:'limit',//查询参数组织方式
queryParams:queryParams,//请求服务器时所传的参数
sidePagination:'server',//指定服务器端分页
pageSize:5,//单页记录数
pageList:[5,10,20,30],//分页步进值
showRefresh:true,//刷新按钮
showColumns:true,
clickToSelect: true,//是否启用点击选中行
toolbarAlign:'right',//工具栏对齐方式
buttonsAlign:'right',//按钮对齐方式
toolbar:'#toolbar',//指定工作栏
columns:[
{
title:'全选',
field:'state',
checkbox:true,
width:25,
align:'center',
valign:'middle'
},
{
title:'id',
field:'id',
align:'center',
visible:false
},
{
title:'投诉信息',
field:'dataTime',
sortable:true,
formatter: function(value,row,index){
var param = "content.jsp?id=" + row.id;
var title = "";
var address = row.address;
if(address==""){
address="未知位置"
}
var telehone = row.telephone;
if (telehone == "")
telehone = "匿名用户";
var user = row.name;
return '<div style="line-height: 26px;"><i class="glyphicon glyphicon-user" style="color:#5bc0de;"></i> '
+ user
+'<br /><i class="glyphicon glyphicon-earphone" style="color:#5bc0de;"></i> '
+ telehone
+'<br /><i class="glyphicon glyphicon-home" style="color:#5bc0de;"></i> '
+ address
+ '</div>';
}
},
{
title:'投诉图片',
field:'picturepath1',
sortable:true,
formatter:function(value, row, index) {
var param = "content.jsp?id=" + row.id;
if (value != "")
return '<div><a ><img src='
+ value
+ ' width="200px" height="133px" style="padding:0px;" alt=""></a></div>';
else
return "无图片";
}
},
{
title:'投诉内容',
field:'content',
align:'left',
valign:'top',
formatter:function(value, row, index) {
if (value == "") {
value = "举报人未说明具体情况"
} else {
if (value.length > 60) {
value = value.substring(0, 60) + "...";
}
}
var dataTime = row.dataTime;
return '<div style="height:60px;"><a href="#"'
+' style="line-height: 1.4em;"><h4 class="media-heading">'
+ value
+ '</a></div>'
+ '<div style="line-height: 26px;"><i class="glyphicon glyphicon-time" style="color:#5bc0de;"></i> '
+ dataTime+'</div>';
}
},
{
title:'处理人',
field:'process',
align:'center',
valign:'middle',
formatter:function(value,row,index){
return row.dealName.userName
}
}
],
locale:'zh-CN',//中文支持,
responseHandler:function(res){
//在ajax获取到数据，渲染表格之前，修改数据源
console.dir(res);
return {
total : result.total, //总页数,前面的key必须为"total"
rows : result.rows //行数据，前面的key要与之前设置的dataField的值一致.
};
}
})
//请求服务数据时所传参数
function queryParams(params){
console.log(params);
return{
//每页多少条数据
pageSize: params.limit,
//请求第几页
pageNumber:params.offset/params.limit+1, //当前页面,默认是上面设置的1(pageNumber)
searchText:$('#search_name').val()
}
}
//查询按钮事件
$('#search_btn').click(function(){
$('#agencyTable').bootstrapTable('refresh', {url: '../rest/Uploadinfo/queryAgencyCount'});
})
responseHandler：在ajax获取到数据，渲染表格之前，修改数据源。如果跟后端约定好，返回的数据格式第一层包含“rows”(行数据)和“total”(总数)。responseHandler可以不用写。dataField:bootstrap table 可以前端分页也可以后端分页，这里我们使用的是后端分页，后端分页时需返回含有total：总记录数,这个键值好像是固定的。rows： 记录集合 键值可以修改 dataField 自己定义成自己想要的就好formatter：对定义的每一列进行格式化。{
...
formatter:'infoFormatter'
}
function infoFormatter(value,row,index){
...
}
注意后面直接写格式化函数，如上面这种写法，写成函数名，引用别处定义的函数不起作用。
@RequestMapping(value = "/queryAgencyPage", method = RequestMethod.POST)
@ResponseBody
public JSONObject pageOne(Integer pageSize, Integer pageNumber, String searchText, HttpServletRequest request,
HttpServletResponse response) throws JsonMappingException, IOException {
//搜索框功能
//当查询条件中包含中文时，get请求默认会使用ISO-8859-1编码请求参数，在服务端需要对其解码
if (null != searchText) {
try {
searchText = new String(searchText.getBytes("ISO-8859-1"), "UTF-8");
} catch (Exception e) {
e.printStackTrace();
}
}
//根据查询条件，获取符合查询条件的数据总量
int total;
List<Uploadinfo> list;
ObjectMapper mapper = new ObjectMapper();
mapper.setSerializationInclusion(Include.NON_NULL);
JSONArray itemJSONList = new JSONArray();
if(searchText != null){
total = itemServiceImpl.searchInfos(searchText).size();
}else {
List<Uploadinfo> totleList = itemServiceImpl.queryAll();
total = totleList.size();
}
list = itemServiceImpl.queryByPage(pageSize, pageNumber, searchText);
itemJSONList = JSONArray.fromObject(list, Common.getJsonConfig());
//自己封装的数据返回类型，bootstrap-table要求服务器返回的json数据必须包含：totle，rows两个节点
JSONObject obj = new JSONObject();
obj.accumulate("total", total);
obj.accumulate("rows", mapper.writeValueAsString(itemJSONList));
return obj;
}
public List<Uploadinfo> queryByPage(int pageSize, int pageNow ,String searchText) {
// TODO Auto-generated method stub
String hql;
Query query;
if(searchText == null || searchText == ""){
hql = "from Uploadinfo order by dataTime desc";
query = itemDaoImpl.getQuery(hql);
}else {
hql = "from Uploadinfo where content like :value or telephone like :value or datetime like :value order by dataTime desc";
query = itemDaoImpl.getQuery(hql);
query.setParameter("value", '%'+searchText+'%');
}
query.setFirstResult((pageNow - 1) * pageSize);
query.setMaxResults(pageSize);
List<Uploadinfo> infolist = query.list();
return infolist;
}
最近项目需求，需要在SpringMVC中使用Java监听器，并且需要注入service层，@Resource 没有任何效果，一直报空，后来找到问题所在，spring容器的初始化也是由Listener（ContextLoaderListener）完成的，在调用自定义的listener前要确保，spring已经初始化完毕，所以需要需在web.xml中先配置初始化spring容器的Listener（ContextLoaderListener），然后在配置自己的Listener。
public class ConfigListener implements ServletContextListener {
@Override public void contextInitialized(ServletContextEvent sce) {
ConfigService configService = WebApplicationContextUtils.getWebApplicationContext(sce.getServletContext()).getBean(ConfigService.class);
configService.initConfig();
}
@Override public void contextDestroyed(ServletContextEvent sce) {
}
如上，ConfigService是要在listener中使用的bean。
参考资料：
在自定义Listener中使用Spring容器管理的bean
如何在自定义Listener（监听器）中使用Spring容器管理的bean
为防止sql注入攻击，使用hql语句进行查询时，不建议在hql语句中拼接字符串，而是使用占位符的方法来注入参数，如下代码所示：
占位符进行模糊查询
@Override
public List<Uploadinfo> searchInfos(String value) {
// TODO Auto-generated method stub
String hql = "from Uploadinfo where content like :value or telephone like :value";
Query query = itemDaoImpl.getQuery(hql);
query.setParameter("value", '%'+value+'%');
List<Uploadinfo> infolist = query.list();
return infolist;
}
所谓知识的积累真的都是逼出来的，这不，项目紧急需要，竟然让我发现找到解决腾讯视屏.qlv格式转.mp4视屏格式的方法。利用腾讯视频的缓存文件来合成.mp4文件，这以后是不是可以用这个方法来下载一些不允许下载的视频了？？？
首先找到缓存文件的路径
根据路径打开缓存文件
即可看到缓存的视频列表，打开文件夹，即视频的缓存文件
拷贝所有的.tdl、.tdi、.tii文件到E盘目录下
打开命令提示符窗口,进入E盘根目录下，运行
copy/b *.tdl 2.mp4命令，即可在E盘根目录下看见生成的2.MP4视频。
babel: 转码器, 可以将ES6转为ES5
babel配置文件
{
#设定转码规则
"presets": [
"es2015",
"react",
"stage-2"
],
"plugins": []
}
官方提供以下的规则集，根据需要安装
# ES2015转码规则
$ npm install --save-dev babel-preset-es2015
# react转码规则
$ npm install --save-dev babel-preset-react
# ES7不同阶段语法提案的转码规则（共有4个阶段），选装一个
$ npm install --save-dev babel-preset-stage-0
$ npm install --save-dev babel-preset-stage-1
$ npm install --save-dev babel-preset-stage-2
$ npm install --save-dev babel-preset-stage-3
官方的说法是：This package allows transpiling JavaScript files using Babel and webpack.即用babel+webpack来转译Javascript。
babel-register模块改写require命令，为它加上一个钩子。此后，每当使用require加载.js、.jsx、.es和.es6后缀名的文件，就会先用Babel进行转码。
Babel默认只转换新的JavaScript句法（syntax），而不转换新的API，比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象，以及一些定义在全局对象上的方法（比如Object.assign）都不会转码。
举例来说，ES6在Array对象上新增了Array.from方法。Babel就不会转码这个方法。如果想让这个方法运行，必须使用babel-polyfill，为当前环境提供一个垫片。
参考文献：
babel入门教程
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<script type="text/javascript">
var arcgis_js_api_home = "<%=arcgis_js_api_home%>";
var basePath = "<%=basePath%>";
</script>
html5出来后，前端播放视频瞬间变得方便容易多了，一个<video>标签就可以搞定,只要给src属性正确的文件路径即可。
<video src="images/xxx.mov" width="300px" heigth="300px" controls="controls" autoplay></video>
但是当视频在服务器中时，就需要从后台向前台传输视频流才可以播放。
JAVA
@RequestMapping(value ="/getFileSrc" ,method = RequestMethod.GET)
@ResponseBody
public void getFileSrc(HttpServletRequest request ,HttpServletResponse response,@RequestParam(value="path") String path) throws IOException{
File file = new File(path);
FileInputStream input = new FileInputStream(file);
int i = input.available();
byte[] bytes = new byte[i];
input.read(bytes);
response.setContentType("application/video");
OutputStream output = response.getOutputStream();
output.write(bytes);
output.flush();
output.close();
input.close();
}
JS
var path1= "http://localhost:8080/HBDK/rest/resource/getFileSrc?path="+path;
<!--弹出框中播放-->
back.view.popup.open({
title: "视屏播放",
content:'<video src='+path1+' width="300px" heigth="300px" controls="controls" autoplay></video>',
location: point // Set the location of the popup to the clicked location
});
最近项目中遇到一个奇怪的问题，input text框实现的搜索功能，在输入查询条件后，一点击enter键页面就被刷新了，到一个一个组织页面刷新的好方法，在input标签中加入onkeydown="if(event.keyCode==13){return false;}"即可，进一步也可以将enter键改为搜索的提交，将return false代码换成搜索提交即可
<input id="searchName" type="text" class="form-control" placeholder="输入信息" onkeydown="if(event.keyCode==13){return false;}">
近日项目需求，开始着手学习基于arcgis地图的开发，一些地图上的基本操作则是第一步。
地图上绘制点时碰见一个一个小bug，不知道怎样解除click的监听，导致每点击一个地图就会出现一个圆点，网上资料不好找，不过最终解决了，Mark一下跟大家分享。(^▽^)
back.drawPoint = function(){
var events = back.view.on("click",function(event){
console.log(event.mapPoint);
var lat = event.mapPoint.latitude;
var lon = event.mapPoint.longitude;
var point = new Point({
longitude: lon,
latitude: lat
});
// Create a symbol for drawing the point
var markerSymbol = new SimpleMarkerSymbol({
color: [255, 0, 0],
outline: { // autocasts as new SimpleLineSymbol()
color: [0, 0, 0],
width: 1
}
});
var pointGraphic = new Graphic({
geometry: point,
symbol: markerSymbol
});
back.view.graphics.addMany([pointGraphic]);
events.remove();
})
}
用的arcgis 4.4版本，back.view即mapview对象。