"hidden" name="imgSrcs" id="imgSrcs" >
"weui-cell">
"weui-uploader__bd">
"weui-uploader__hd">
"weui-uploader__title"
>图片上传
"weui-uploader__file" style="background-image:url(${base} /resources/shop/images/add.jpg)" id="add-img" >
"" class=
"weui-uploader__file deleteFile" id=
"add-img1" hidden>
"" class=
"weui-uploader__file deleteFile" id=
"add-img2" hidden>
"" class=
"weui-uploader__file deleteFile" id=
"add-img3" hidden>
"" class=
"weui-uploader__file deleteFile" id=
"add-img4" hidden>
"" class=
"weui-uploader__file deleteFile" id=
"add-img5" hidden>
function getPath(){
return '${base} ';
}
$(document).ready(function(){
//调用微信接口功能
$.ajax({
url: '${base} /wx/share.jhtml',
type: "POST",
data: {url : window.location.href},
dataType: "json",
cache: false,
success: function(data) {
//alert(data.member.nickName);
wx.config({
beta: true,// 必须这么写,否则在微信插件有些jsapi会有问题
debug:false,
// 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: data.wxAppId,
// 必填,公众号的唯一标识
timestamp: data.timestamp,
// 必填,生成签名的时间戳
nonceStr: data.nonce_str,
// 必填,生成签名的随机串
signature: data.signature,
// 必填,签名,见附录1
jsApiList: ["uploadImage","chooseImage"] // 必填,需要使用的JS接口列表,
});
wx.error(function(res){
});
wx.ready(function(){
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
});
}
});
});
var j = 1;
var imageIds = "";
var imgSrcs = "";
//添加图片
$("#add-img").click(function(){
var $this = $(this);
wx.chooseImage({
count: 5, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
var localIds = res.localIds; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
for(var i=0;i
var localId = localIds[i];
//alert(localId);
var imgId = "#add-img"+j;
j = j+1;
//alert(imgId);
$(imgId).attr("src",localId);
$(imgId).show();
wx.uploadImage({
localId: localId, // 需要上传的图片的本地ID,由chooseImage接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
var serverId = res.serverId; // 返回图片的服务器端ID
$.ajax({
url:"${base} /onlineService/uploadImg.jhtml",
cache : false,
type:"GET",
data: {
'serverId' : serverId,
'uploadStatus' : 'repair'
},
error: function(request) {$.alert("网络连接异常");},
success: function(data) {
var imgSrc = data.imgSrc;
imgSrcs = imgSrcs + imgSrc + ",";
$("#imgSrcs").val(imgSrcs);
//alert($("#imgSrcs").val());
}
});
}
});
}
}
});
});
//移除图片
$(".deleteFile").click(function(){
var $this = $(this);
var id = "#"+$this.attr("id");
$.confirm("确认移除图片吗?", function() {
$this.attr("src","");
$(id).hide();
}, function() {
});
});
//后台
/**
* 上传路径
*/
private final static String UPLOAD_REPAIR_IMG_URL = "upload/image/repair/" ;
/**
* 上传路径
*/
private final static String UPLOAD_MESSAGE_IMG_URL = "upload/image/message/" ;
/**
* 上传路径
*/
private final static String UPLOAD_APPRAISE_IMG_URL = "upload/image/appraise/" ;
/**
* 上传图片
* @author wxs
* @version 1.0
* @time 2017年10月17日 下午1:01:06
*/
@RequestMapping (value = "/uploadImg" , method = {RequestMethod.GET ,RequestMethod.POST })
public @ResponseBody
Map uploadImg(String uploadStatus,HttpServletRequest request,RedirectAttributes redirectAttributes,String serverId) {
Map data = new HashMap<>();
//TODO
// String openId = (String) request.getSession().getAttribute("openId");
String openId = "wxs-hsd" ;
WxUser wxUser = wxUserService .findByOpId(openId);
//获取token
// Admin admin = adminService.getCurrent();
// Crop co =cropService.findByAdmin(admin.getId());
Crop co=cropService .findByAdmin(9l);
StringBuffer str = new StringBuffer();
str.append("https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=" );
str.append(co.getCropId());
str.append("&corpsecret=" );
co.setSecret(co.getSecret());
str.append(co.getSecret());
String token=null ;
try {
JSONObject jsontoken = JsonUtils.toJSONObject (HttpUtil.getInvoke (str.toString()));
int errcode=jsontoken.getInt("errcode" );
if (errcode!=0){
addFlashMessage(redirectAttributes, Message.error ("cropid或secret不正确" ));
return data;
}
token = jsontoken.getString("access_token" );
}catch (JSONException e){
addFlashMessage(redirectAttributes, Message.error ("cropid或secret不正确" ));
return data;
}
//获取临时素材
JSONObject json1=new JSONObject();
json1.put("media_id" , serverId);
String getImg = "https://qyapi.weixin.qq.com/cgi-bin/media/get?access_token=" + token + "&media_id=" + serverId;
//JSONObject getImgJson = JsonUtils.toJSONObject(HttpUtil.getInvoke(getImg));
String imgSrc = "" ;
try {
URL u = new URL(getImg);
HttpURLConnection conn = (HttpURLConnection) u.openConnection();
conn.setRequestMethod("GET" );
conn.connect();
BufferedInputStream bis = new BufferedInputStream(conn.getInputStream());
// 生成不同文件名称
String path = request.getSession().getServletContext().getRealPath("/" );
String baseUploadPath = "" ;
String newFileName = UUID.randomUUID ().toString() + ".jpg" ;
if ("repair" .equals(uploadStatus)){
baseUploadPath = path + UPLOAD_REPAIR_IMG_URL ;
imgSrc = "/" + UPLOAD_REPAIR_IMG_URL + newFileName;
}
if ("appraise" .equals(uploadStatus)){
baseUploadPath = path + UPLOAD_APPRAISE_IMG_URL ;
imgSrc = "/" + UPLOAD_APPRAISE_IMG_URL + newFileName;
}
if ("message" .equals(uploadStatus)){
baseUploadPath = path + UPLOAD_MESSAGE_IMG_URL ;
imgSrc = "/" + UPLOAD_MESSAGE_IMG_URL + newFileName;
}
// String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
data.put("imgSrc" , imgSrc);
BufferedOutputStream bos = new BufferedOutputStream(new FileOutputStream(baseUploadPath + newFileName));
byte [] buf = new byte [1024];
int length = bis.read(buf);
while (length != -1) {
bos.write(buf, 0, length);
length = bis.read(buf);
}
bos.close();
bis.close();
} catch (MalformedURLException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
return data;
}
"hidden" name="imgSrcs" id="imgSrcs" >
"weui-cell" >
"weui-uploader__bd" >
"weui-uploader__hd" >
"weui-uploader__title" > 图片上传
"weui-uploader__files" id="uploaderFiles" >
"weui-uploader__file" style="background-image:url( ${base} /resources/shop/images/add.jpg)" id= "add-img" >
"" class="weui-uploader__file deleteFile" id="add-img1" hidden>
"" class="weui-uploader__file deleteFile" id="add-img2" hidden>
"" class="weui-uploader__file deleteFile" id="add-img3" hidden>
"" class="weui-uploader__file deleteFile" id="add-img4" hidden>
"" class="weui-uploader__file deleteFile" id="add-img5" hidden>
function getPath(){
return ' ${base} ';
}
$(document).ready(function(){
//调用微信接口功能
$.ajax({
url: ' ${base} /wx/share.jhtml',
type: "POST",
data: {url : window.location.href},
dataType: "json",
cache: false,
success: function(data) {
//alert(data.member.nickName);
wx.config({
beta: true,// 必须这么写,否则在微信插件有些jsapi会有问题
debug:false,
// 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: data.wxAppId,
// 必填,公众号的唯一标识
timestamp: data.timestamp,
// 必填,生成签名的时间戳
nonceStr: data.nonce_str,
// 必填,生成签名的随机串
signature: data.signature,
// 必填,签名,见附录1
jsApiList: ["uploadImage","chooseImage"] // 必填,需要使用的JS接口列表,
});
wx.error(function(res){
});
wx.ready(function(){
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
});
}
});
});
var j = 1;
var imageIds = "";
var imgSrcs = "";
//添加图片
$("#add-img").click(function(){
var $this = $(this);
wx.chooseImage({
count: 5, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
var localIds = res.localIds; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
for(var i=0;i
var localId = localIds[i];
//alert(localId);
var imgId = "#add-img"+j;
j = j+1;
//alert(imgId);
$(imgId).attr("src",localId);
$(imgId).show();
wx.uploadImage({
localId: localId, // 需要上传的图片的本地ID,由chooseImage接口获得
isShowProgressTips: 1, // 默认为1,显示进度提示
success: function (res) {
var serverId = res.serverId; // 返回图片的服务器端ID
$.ajax({
url:" ${base} /onlineService/uploadImg.jhtml",
cache : false,
type:"GET",
data: {
'serverId' : serverId,
'uploadStatus' : 'repair'
},
error: function(request) {$.alert("网络连接异常");},
success: function(data) {
var imgSrc = data.imgSrc;
imgSrcs = imgSrcs + imgSrc + ",";
$("#imgSrcs").val(imgSrcs);
//alert($("#imgSrcs").val());
}
});
}
});
}
}
});
});
//移除图片
$(".deleteFile").click(function(){
var $this = $(this);
var id = "#"+$this.attr("id");
$.confirm("确认移除图片吗?", function() {
$this.attr("src","");
$(id).hide();
}, function() {
});
});
//后台
/**
* 上传路径
*/
private final static String UPLOAD_REPAIR_IMG_URL = "upload/image/repair/" ;
/**
* 上传路径
*/
private final static String UPLOAD_MESSAGE_IMG_URL = "upload/image/message/" ;
/**
* 上传路径
*/
private final static String UPLOAD_APPRAISE_IMG_URL = "upload/image/appraise/" ;
/**
* 上传图片
* @author wxs
* @version 1.0
* @time 2017年10月17日 下午1:01:06
*/
@RequestMapping (value = "/uploadImg" , method = {RequestMethod. GET ,RequestMethod. POST })
public @ResponseBody
Map uploadImg(String uploadStatus,HttpServletRequest request,RedirectAttributes redirectAttributes,String serverId) {
Map data = new HashMap<>();
// TODO
// String openId = (String) request.getSession().getAttribute("openId");
String openId = "wxs-hsd" ;
WxUser wxUser = wxUserService .findByOpId(openId);
//获取token
// Admin admin = adminService.getCurrent();
// Crop co =cropService.findByAdmin(admin.getId());
Crop co= cropService .findByAdmin(9l);
StringBuffer str = new StringBuffer();
str.append( "https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=" );
str.append(co.getCropId());
str.append( "&corpsecret=" );
co.setSecret(co.getSecret());
str.append(co.getSecret());
String token= null ;
try {
JSONObject jsontoken = JsonUtils. toJSONObject (HttpUtil. getInvoke (str.toString()));
int errcode=jsontoken.getInt("errcode" );
if (errcode!=0){
addFlashMessage(redirectAttributes, Message. error ( "cropid或secret不正确" ));
return data;
}
token = jsontoken.getString( "access_token" );
} catch (JSONException e){
addFlashMessage(redirectAttributes, Message. error ( "cropid或secret不正确" ));
return data;
}
//获取临时素材
JSONObject json1= new JSONObject();
json1.put( "media_id" , serverId);
String getImg = "https://qyapi.weixin.qq.com/cgi-bin/media/get?access_token=" + token + "&media_id=" + serverId;
//JSONObject getImgJson = JsonUtils.toJSONObject(HttpUtil.getInvoke(getImg));
String imgSrc = "" ;
try {
URL u = new URL(getImg);
HttpURLConnection conn = (HttpURLConnection) u.openConnection();
conn.setRequestMethod( "GET" );
conn.connect();
BufferedInputStream bis = new BufferedInputStream(conn.getInputStream());
// 生成不同文件名称
String path = request.getSession().getServletContext().getRealPath( "/" );
String baseUploadPath = "" ;
String newFileName = UUID. randomUUID ().toString() + ".jpg" ;
if ( "repair" .equals(uploadStatus)){
baseUploadPath = path + UPLOAD_REPAIR_IMG_URL ;
imgSrc = "/" + UPLOAD_REPAIR_IMG_URL + newFileName;
}
if ( "appraise" .equals(uploadStatus)){
baseUploadPath = path + UPLOAD_APPRAISE_IMG_URL ;
imgSrc = "/" + UPLOAD_APPRAISE_IMG_URL + newFileName;
}
if ( "message" .equals(uploadStatus)){
baseUploadPath = path + UPLOAD_MESSAGE_IMG_URL ;
imgSrc = "/" + UPLOAD_MESSAGE_IMG_URL + newFileName;
}
// String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
data.put( "imgSrc" , imgSrc);
BufferedOutputStream bos = new BufferedOutputStream(new FileOutputStream(baseUploadPath + newFileName));
byte [] buf = new byte [1024];
int length = bis.read(buf);
while (length != -1) {
bos.write(buf, 0, length);
length = bis.read(buf);
}
bos.close();
bis.close();
} catch (MalformedURLException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}
return data;
}