翔哥，学4-13节的时候，shop信息总是提交不进后台。我都用的POST上传数据，为什么会报 GET not supported错误呢？
来源：4-13 前后端联调验证整体模块功能
慕丝0902119
2018-08-25
写回答
2回答
-
同学好，同学可以对比下视频，感觉是js这块写的有点问题，可以对比下我的正确的代码，里面参杂了edit的逻辑，同学主要对比下提交的部分
shopoperation.js
/** * */ $(function() { // 从URL里获取shopId参数的值 var shopId = getQueryString('shopId'); // 由于店铺注册和编辑使用的是同一个页面， // 该标识符用来标明本次是添加还是编辑操作 var isEdit = shopId ? true : false; // 用于店铺注册时候的店铺类别以及区域列表的初始化的URL var initUrl = '/o2o/shopadmin/getshopinitinfo'; // 注册店铺的URL var registerShopUrl = '/o2o/shopadmin/registershop'; // 编辑店铺前需要获取店铺信息，这里为获取当前店铺信息的URL var shopInfoUrl = "/o2o/shopadmin/getshopbyid?shopId=" + shopId; // 编辑店铺信息的URL var editShopUrl = '/o2o/shopadmin/modifyshop'; // 判断是编辑操作还是注册操作 if (!isEdit) { getShopInitInfo(); } else { getShopInfo(shopId); } // 通过店铺Id获取店铺信息 function getShopInfo(shopId) { $.getJSON(shopInfoUrl, function(data) { if (data.success) { // 若访问成功，则依据后台传递过来的店铺信息为表单元素赋值 var shop = data.shop; $('#shop-name').val(shop.shopName); $('#shop-addr').val(shop.shopAddr); $('#shop-phone').val(shop.phone); $('#shop-desc').val(shop.shopDesc); // 给店铺类别选定原先的店铺类别值 var shopCategory = '<option data-id="' + shop.shopCategory.shopCategoryId + '" selected>' + shop.shopCategory.shopCategoryName + '</option>'; var tempAreaHtml = ''; // 初始化区域列表 data.areaList.map(function(item, index) { tempAreaHtml += '<option data-id="' + item.areaId + '">' + item.areaName + '</option>'; }); $('#shop-category').html(shopCategory); // 不允许选择店铺类别 $('#shop-category').attr('disabled', 'disabled'); $('#area').html(tempAreaHtml); // 给店铺选定原先的所属的区域 $("#area option[data-id='" + shop.area.areaId + "']").attr( "selected", "selected"); } }); } // 取得所有二级店铺类别以及区域信息，并分别赋值进类别列表以及区域列表 function getShopInitInfo() { $.getJSON(initUrl, function(data) { if (data.success) { var tempHtml = ''; var tempAreaHtml = ''; data.shopCategoryList.map(function(item, index) { tempHtml += '<option data-id="' + item.shopCategoryId + '">' + item.shopCategoryName + '</option>'; }); data.areaList.map(function(item, index) { tempAreaHtml += '<option data-id="' + item.areaId + '">' + item.areaName + '</option>'; }); $('#shop-category').html(tempHtml); $('#area').html(tempAreaHtml); } }); } // 提交按钮的事件响应，分别对店铺注册和编辑操作做不同响应 $('#submit').click(function() { // 创建shop对象 var shop = {}; if (isEdit) { // 若属于编辑，则给shopId赋值 shop.shopId = shopId; } // 获取表单里的数据并填充进对应的店铺属性中 shop.shopName = $('#shop-name').val(); shop.shopAddr = $('#shop-addr').val(); shop.phone = $('#shop-phone').val(); shop.shopDesc = $('#shop-desc').val(); // 选择选定好的店铺类别 shop.shopCategory = { shopCategoryId : $('#shop-category').find('option').not(function() { return !this.selected; }).data('id') }; // 选择选定好的区域信息 shop.area = { areaId : $('#area').find('option').not(function() { return !this.selected; }).data('id') }; // 获取上传的图片文件流 var shopImg = $('#shop-img')[0].files[0]; // 生成表单对象，用于接收参数并传递给后台 var formData = new FormData(); // 添加图片流进表单对象里 formData.append('shopImg', shopImg); // 将shop json对象转成字符流保存至表单对象key为shopStr的的键值对里 formData.append('shopStr', JSON.stringify(shop)); // 获取表单里输入的验证码 var verifyCodeActual = $('#j_captcha').val(); if (!verifyCodeActual) { $.toast('请输入验证码！'); return; } formData.append('verifyCodeActual', verifyCodeActual); // 将数据提交至后台处理相关操作 $.ajax({ url : (isEdit ? editShopUrl : registerShopUrl), type : 'POST', data : formData, contentType : false, processData : false, cache : false, success : function(data) { if (data.success) { $.toast('提交成功！'); if (!isEdit) { // 若为注册操作，成功后返回店铺列表页 window.location.href = "/o2o/shopadmin/shoplist"; } } else { $.toast('提交失败！' + data.errMsg); } // 点击验证码图片的时候，注册码会改变 $('#captcha_img').click(); } }); }); })还有后端的对应controller
package com.imooc.o2o.web.shopadmin; import java.io.IOException; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import javax.servlet.http.HttpServletRequest; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.RequestMethod; import org.springframework.web.bind.annotation.ResponseBody; import org.springframework.web.multipart.MultipartHttpServletRequest; import org.springframework.web.multipart.commons.CommonsMultipartFile; import org.springframework.web.multipart.commons.CommonsMultipartResolver; import com.fasterxml.jackson.databind.ObjectMapper; import com.imooc.o2o.dto.ImageHolder; import com.imooc.o2o.dto.ShopExecution; import com.imooc.o2o.entity.Area; import com.imooc.o2o.entity.PersonInfo; import com.imooc.o2o.entity.Shop; import com.imooc.o2o.entity.ShopCategory; import com.imooc.o2o.enums.ShopStateEnum; import com.imooc.o2o.exceptions.ShopOperationException; import com.imooc.o2o.service.AreaService; import com.imooc.o2o.service.ShopCategoryService; import com.imooc.o2o.service.ShopService; import com.imooc.o2o.util.CodeUtil; import com.imooc.o2o.util.HttpServletRequestUtil; @Controller @RequestMapping("/shopadmin") public class ShopManagementController { @Autowired private ShopService shopService; @Autowired private ShopCategoryService shopCategoryService; @Autowired private AreaService areaService; @RequestMapping(value = "/getshopmanagementinfo", method = RequestMethod.GET) @ResponseBody private Map<String, Object> getShopManagementInfo(HttpServletRequest request) { Map<String, Object> modelMap = new HashMap<String, Object>(); long shopId = HttpServletRequestUtil.getLong(request, "shopId"); if (shopId <= 0) { Object currentShopObj = request.getSession().getAttribute("currentShop"); if (currentShopObj == null) { modelMap.put("redirect", true); modelMap.put("url", "/o2o/shopadmin/shoplist"); } else { Shop currentShop = (Shop) currentShopObj; modelMap.put("redirect", false); modelMap.put("shopId", currentShop.getShopId()); } } else { Shop currentShop = new Shop(); currentShop.setShopId(shopId); request.getSession().setAttribute("currentShop", currentShop); modelMap.put("redirect", false); } return modelMap; } @RequestMapping(value = "/getshoplist", method = RequestMethod.GET) @ResponseBody private Map<String, Object> getShopList(HttpServletRequest request) { Map<String, Object> modelMap = new HashMap<String, Object>(); PersonInfo user = (PersonInfo) request.getSession().getAttribute("user"); try { Shop shopCondition = new Shop(); shopCondition.setOwner(user); ShopExecution se = shopService.getShopList(shopCondition, 0, 100); modelMap.put("shopList", se.getShopList()); // 列出店铺成功之后，将店铺放入session中作为权限验证依据，即该帐号只能操作它自己的店铺 request.getSession().setAttribute("shopList", se.getShopList()); modelMap.put("user", user); modelMap.put("success", true); } catch (Exception e) { modelMap.put("success", false); modelMap.put("errMsg", e.getMessage()); } return modelMap; } @RequestMapping(value = "/getshopbyid", method = RequestMethod.GET) @ResponseBody private Map<String, Object> getShopById(HttpServletRequest request) { Map<String, Object> modelMap = new HashMap<String, Object>(); Long shopId = HttpServletRequestUtil.getLong(request, "shopId"); if (shopId > -1) { try { Shop shop = shopService.getByShopId(shopId); List<Area> areaList = areaService.getAreaList(); modelMap.put("shop", shop); modelMap.put("areaList", areaList); modelMap.put("success", true); } catch (Exception e) { modelMap.put("success", false); modelMap.put("errMsg", e.toString()); } } else { modelMap.put("success", false); modelMap.put("errMsg", "empty shopId"); } return modelMap; } @RequestMapping(value = "/getshopinitinfo", method = RequestMethod.GET) @ResponseBody private Map<String, Object> getShopInitInfo() { Map<String, Object> modelMap = new HashMap<String, Object>(); List<ShopCategory> shopCategoryList = new ArrayList<ShopCategory>(); List<Area> areaList = new ArrayList<Area>(); try { shopCategoryList = shopCategoryService.getShopCategoryList(new ShopCategory()); areaList = areaService.getAreaList(); modelMap.put("shopCategoryList", shopCategoryList); modelMap.put("areaList", areaList); modelMap.put("success", true); } catch (Exception e) { modelMap.put("success", false); modelMap.put("errMsg", e.getMessage()); } return modelMap; } @RequestMapping(value = "/registershop", method = RequestMethod.POST) @ResponseBody private Map<String, Object> registerShop(HttpServletRequest request) { Map<String, Object> modelMap = new HashMap<String, Object>(); if (!CodeUtil.checkVerifyCode(request)) { modelMap.put("success", false); modelMap.put("errMsg", "输入了错误的验证码"); return modelMap; } // 1.接收并转化相应的参数，包括店铺信息以及图片信息 String shopStr = HttpServletRequestUtil.getString(request, "shopStr"); ObjectMapper mapper = new ObjectMapper(); Shop shop = null; try { shop = mapper.readValue(shopStr, Shop.class); } catch (Exception e) { modelMap.put("success", false); modelMap.put("errMsg", e.getMessage()); return modelMap; } CommonsMultipartFile shopImg = null; CommonsMultipartResolver commonsMultipartResolver = new CommonsMultipartResolver( request.getSession().getServletContext()); if (commonsMultipartResolver.isMultipart(request)) { MultipartHttpServletRequest multipartHttpServletRequest = (MultipartHttpServletRequest) request; shopImg = (CommonsMultipartFile) multipartHttpServletRequest.getFile("shopImg"); } else { modelMap.put("success", false); modelMap.put("errMsg", "上传图片不能为空"); return modelMap; } // 2.注册店铺 if (shop != null && shopImg != null) { PersonInfo owner = (PersonInfo) request.getSession().getAttribute("user"); shop.setOwner(owner); ShopExecution se; try { ImageHolder imageHolder = new ImageHolder(shopImg.getOriginalFilename(), shopImg.getInputStream()); se = shopService.addShop(shop, imageHolder); if (se.getState() == ShopStateEnum.CHECK.getState()) { modelMap.put("success", true); // 该用户可以操作的店铺列表 @SuppressWarnings("unchecked") List<Shop> shopList = (List<Shop>) request.getSession().getAttribute("shopList"); if (shopList == null || shopList.size() == 0) { shopList = new ArrayList<Shop>(); } shopList.add(se.getShop()); request.getSession().setAttribute("shopList", shopList); } else { modelMap.put("success", false); modelMap.put("errMsg", se.getStateInfo()); } } catch (ShopOperationException e) { modelMap.put("success", false); modelMap.put("errMsg", e.getMessage()); } catch (IOException e) { modelMap.put("success", false); modelMap.put("errMsg", e.getMessage()); } return modelMap; } else { modelMap.put("success", false); modelMap.put("errMsg", "请输入店铺信息"); return modelMap; } } @RequestMapping(value = "/modifyshop", method = RequestMethod.POST) @ResponseBody private Map<String, Object> modifyShop(HttpServletRequest request) { Map<String, Object> modelMap = new HashMap<String, Object>(); if (!CodeUtil.checkVerifyCode(request)) { modelMap.put("success", false); modelMap.put("errMsg", "输入了错误的验证码"); return modelMap; } // 1.接收并转化相应的参数，包括店铺信息以及图片信息 String shopStr = HttpServletRequestUtil.getString(request, "shopStr"); ObjectMapper mapper = new ObjectMapper(); Shop shop = null; try { shop = mapper.readValue(shopStr, Shop.class); } catch (Exception e) { modelMap.put("success", false); modelMap.put("errMsg", e.getMessage()); return modelMap; } CommonsMultipartFile shopImg = null; CommonsMultipartResolver commonsMultipartResolver = new CommonsMultipartResolver( request.getSession().getServletContext()); if (commonsMultipartResolver.isMultipart(request)) { MultipartHttpServletRequest multipartHttpServletRequest = (MultipartHttpServletRequest) request; shopImg = (CommonsMultipartFile) multipartHttpServletRequest.getFile("shopImg"); } // 2.修改店铺信息 if (shop != null && shop.getShopId() != null) { ShopExecution se; try { if (shopImg == null) { se = shopService.modifyShop(shop, null); } else { ImageHolder imageHolder = new ImageHolder(shopImg.getOriginalFilename(), shopImg.getInputStream()); se = shopService.modifyShop(shop, imageHolder); } if (se.getState() == ShopStateEnum.SUCCESS.getState()) { modelMap.put("success", true); } else { modelMap.put("success", false); modelMap.put("errMsg", se.getStateInfo()); } } catch (ShopOperationException e) { modelMap.put("success", false); modelMap.put("errMsg", e.getMessage()); } catch (IOException e) { modelMap.put("success", false); modelMap.put("errMsg", e.getMessage()); } return modelMap; } else { modelMap.put("success", false); modelMap.put("errMsg", "请输入店铺Id"); return modelMap; } } }042018-09-18 -
翔仔
2018-08-26
修改好之后，记得清除页面缓存。而且同学需要留意报错的地方，有可能在点击提交按钮的时候就错了？逐步排查一下
00
相似问题