1. 程式人生 > >SSM+UEditor(百度編輯器)

SSM+UEditor(百度編輯器)

1.本文是自己無聊搭建專案,請支援原文作者。

http://download.csdn.net/download/wk2197727/10229169

框架:ssm+druid

前臺:layui+UEditor

功能:圖片本地上傳,(還有上傳其他七牛等雲伺服器的,如需幫助收費,哈哈。此demo只做簡單的本地圖片儲存)



注意點:

第一個點: 

enctype="multipart/form-data"  from表單 post提交,是獲取不到內容的,必須在springmvc裡配置multipartResolver,否則form表單提交內容獲取不到內容,儲存不了資料。

第二點:

第二個點:

注意配置一下ueditor 下的config.json

imageUrlPrefix        為工程名字。

imagePathFormat   你本地上傳路徑。

工程結構如下:


web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" 
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" id="wlw" version="3.0">
  <display-name>project</display-name>
  <context-param>
		<param-name>webAppRootKey</param-name>     
        <param-value>project.webapp.root</param-value>     
	</context-param>
  <context-param>
    <param-name>contextConfigLocation</param-name>
    <param-value> classpath:spring*.xml</param-value>
  </context-param>
  
	<context-param>     
        <param-name>log4jConfigLocation</param-name>     
        <param-value>/WEB-INF/classes/log4j.properties</param-value>     
    </context-param> 
  <listener>
    <listener-class>org.springframework.web.util.Log4jConfigListener</listener-class>
  </listener> 
   
  <listener>
    <listener-class>
		org.springframework.web.context.ContextLoaderListener
	</listener-class>
  </listener>
  <welcome-file-list>
    <welcome-file>index</welcome-file>
  </welcome-file-list>
 
   <!-- druid  監視工具
    <filter>
      <filter-name>druidWebStatFilter</filter-name>
      <filter-class>com.alibaba.druid.support.http.WebStatFilter</filter-class>
      <init-param>
        <param-name>exclusions</param-name>
        <param-value>/css/*,/context/*,/plug-in/*,*.js,*.css,*/druid*,/attached/*,*.jsp</param-value>
      </init-param>
      <init-param>
        <param-name>principalSessionName</param-name>
        <param-value>sessionInfo</param-value>
      </init-param>
      <init-param>
        <param-name>profileEnable</param-name>
        <param-value>true</param-value>
      </init-param>
    </filter>
     -->
  
  <!-- 過濾器解決中文亂碼問題、強制編碼 UTF-8 -->
  <filter>
  <filter-name>encodingFilter</filter-name>
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
    <init-param>
      <param-name>encoding</param-name>
      <param-value>UTF-8</param-value>
    </init-param>
    <init-param>
      <param-name>forceEncoding</param-name>
      <param-value>true</param-value>
    </init-param>
  </filter>
  <filter-mapping>
    <filter-name>encodingFilter</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>
  
      <!-- 配置 springMVC 基本配置 -->
  <servlet>
    <servlet-name>dispatcher</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <init-param>
      <param-name>contextConfigLocation</param-name>
     <param-value>classpath:spring-mybatis.xml</param-value>
    </init-param>
    <load-on-startup>0</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>dispatcher</servlet-name>
    <url-pattern>/</url-pattern>
  </servlet-mapping>
  
 
  <!-- 二維碼 -->
    <servlet>
      <servlet-name>RandCodeImage</servlet-name>
      <servlet-class>com.main.commont.randomimage.RandCodeImageServlet</servlet-class>
    </servlet>
    <servlet-mapping>
      <servlet-name>RandCodeImage</servlet-name>
      <url-pattern>/randCodeImage</url-pattern>
    </servlet-mapping>
   
  <servlet>
    <servlet-name>kaptcha</servlet-name>
    <servlet-class>
			com.google.code.kaptcha.servlet.KaptchaServlet
		</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>kaptcha</servlet-name>
    <url-pattern>/images/kaptcha.jpg</url-pattern>
  </servlet-mapping>



<!-- 報錯介面 -->  
<error-page>
     <error-code>404</error-code>
     <location>/WEB-INF/pages/404.jsp</location>
 </error-page>
 
 <error-page>
     <exception-type>java.lang.Exception</exception-type>
     <location>/WEB-INF/views/exception.jsp</location>
 </error-page>
    
  <session-config>
    <session-timeout>60</session-timeout>
  </session-config>
 
</web-app>


我的spring-mvc.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context"
	xmlns:lang="http://www.springframework.org/schema/lang" xmlns:aop="http://www.springframework.org/schema/aop"
	xmlns:mvc="http://www.springframework.org/schema/mvc" xmlns:p="http://www.springframework.org/schema/p"
	xmlns:tx="http://www.springframework.org/schema/tx" xmlns:util="http://www.springframework.org/schema/util"
	xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
	http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.0.xsd
	http://www.springframework.org/schema/context 	http://www.springframework.org/schema/context/spring-context.xsd
	http://www.springframework.org/schema/lang http://www.springframework.org/schema/lang/spring-lang-3.0.xsd
	http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd
	http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.0.xsd">

	<bean id="annotationPropertyConfigurer"
		class="org.springframework.beans.factory.config.PropertyPlaceholderConfigurer">
		<property name="locations">
			<list>
				<value>classpath:*.properties</value>
			</list>
		</property>
		<!-- 設定編碼格式 -->
		<property name="fileEncoding" value="UTF-8"></property>
	</bean>

	<!-- 使用註解注入properties中的值 (將屬性檔案裡的資訊交給spring來管理) <bean id="projectInfo" class="org.springframework.beans.factory.config.PropertiesFactoryBean"> 
		<property name="locations"> <list> <value>classpath:*.properties</value> 
		</list> </property> <property name="fileEncoding" value="UTF-8"></property> 
		</bean> -->

	<bean
		class="org.springframework.web.servlet.mvc.method.annotation.RequestMappingHandlerAdapter">
		<property name="messageConverters">
			<list>
				<bean
					class="org.springframework.http.converter.StringHttpMessageConverter">
					<property name="supportedMediaTypes">
						<list>
							<bean class="org.springframework.http.MediaType">
								<constructor-arg index="0" value="text" />
								<constructor-arg index="1" value="json" />
								<constructor-arg index="2" value="UTF-8" />
							</bean>
						</list>
					</property>
				</bean>
				<bean id="mappingJacksonHttpMessageConverter"
					class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">
					<property name="supportedMediaTypes">
						<list>
							<value>text/html;charset=UTF-8</value>
							<value>application/json;charset=UTF-8</value>
						</list>
					</property>
				</bean>

			</list>
		</property>
	</bean>

	<!-- 預設的註解對映的支援 -->
	<mvc:annotation-driven />
	
<!--     <context:annotation-config />
 -->
	<!-- 自動掃描的包名 <context:component-scan base-package="com.bjsl.main.*" /> -->
	<context:component-scan base-package="com.main">
		 <context:include-filter type="annotation" expression="org.springframework.stereotype.Controller"/> 
		<context:include-filter type="annotation" expression="org.springframework.web.bind.annotation.ControllerAdvice"/> 
	</context:component-scan>


	<!-- 檢視解釋類 -->
	<bean
		class="org.springframework.web.servlet.view.InternalResourceViewResolver">
		<property name="prefix" value="/WEB-INF/views/" />
		<property name="suffix" value=".jsp" /><!--可為空,方便實現自已的依據副檔名來選擇檢視解釋類的邏輯 -->
		<property name="viewClass"
			value="org.springframework.web.servlet.view.JstlView" />
	</bean>

	<!-- 全域性異常處理 -->
	<bean
		class="org.springframework.web.servlet.handler.SimpleMappingExceptionResolver">
		<property name="exceptionMappings">
			<props>
				<prop key="java.sql.SQLException">outException</prop>
                <prop key="java.io.IOException">outException</prop>
			</props>
		</property>
	</bean>
	<!-- 對靜態資原始檔的訪問,使用預設的Servlet來響應靜態檔案 -->
	<mvc:resources mapping="/imgs/**" location="/imgs/" />
	<mvc:resources mapping="/fonts/**" location="/fonts/" />
	<mvc:resources mapping="/js/**" location="/js/" />
	<mvc:resources mapping="/css/**" location="/css/" />
	<mvc:resources mapping="/plugins/**" location="/plugins/" />
	<mvc:resources mapping="/upload/**" location="/upload/" />
	<mvc:resources mapping="/pages/**" location="/pages/" />
	<mvc:resources mapping="/viewInfo/**" location="/viewInfo/" />
	<mvc:resources mapping="/static/**" location="/static/" />
	<!-- 檔案上傳 -->
 	<bean id="multipartResolver"    class="org.springframework.web.multipart.commons.CommonsMultipartResolver" >
 	    <property name="defaultEncoding" value="utf-8"></property>
	    <property name="maxUploadSize" value="10485760000"></property>
	    <property name="maxInMemorySize" value="40960"></property>
 	</bean>

</beans>
spring-mybatis.xml
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:context="http://www.springframework.org/schema/context"
    xmlns:tx="http://www.springframework.org/schema/tx" xmlns:aop="http://www.springframework.org/schema/aop"
    xmlns:cache="http://www.springframework.org/schema/cache"
    xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans.xsd
        http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.0.xsd
        http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.0.xsd
        http://www.springframework.org/schema/cache http://www.springframework.org/schema/cache/spring-cache-3.2.xsd			
        http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.0.xsd">

    <!-- 自動掃描指定目錄,將控制器載入到bean -->
    <context:component-scan base-package="com.main.*" />
    
    	<!-- 引入屬性檔案 -->
	<context:property-placeholder location="classpath:dbconfig.properties" ignore-unresolvable="true" />

    <!-- 配置 druid 資料來源 -->
    <bean id="dataSource" class="com.alibaba.druid.pool.DruidDataSource" init-method="init" destroy-method="close">
        <!-- 基本屬性 url、user、password、driverClass -->
        <property name="username" value="${jdbc.username.jeecg}" />
        <property name="password" value="${jdbc.password.jeecg}" />
        <property name="driverClassName" value="com.mysql.jdbc.Driver" />
        <property name="url" value="${jdbc.url.jeecg}" />
    </bean>
    
     <!-- 配置 sessionFactory -->
    <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
        <property name="dataSource" ref="dataSource" />
        <property name="mapperLocations">
            <list>
                <value>classpath:mappers/*Mapper.xml</value>
            </list>
        </property>
    </bean>
    
    <!-- 配置 sqlSessionTemplate 持久化模板 -->
    <bean id="sqlSessionTemplate" class="org.mybatis.spring.SqlSessionTemplate">
        <constructor-arg ref="sqlSessionFactory" />
    </bean>

    
     <!-- 配置掃描Dao介面包,動態實現Dao介面,注入到spring容器中 -->
    <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
        <!-- 注入sqlSessionFactory -->
        <property name="sqlSessionFactoryBeanName" value="sqlSessionFactory"/>
        <!-- 給出需要掃描Dao介面包 -->
        <property name="basePackage" value="com.main.dao"/>
    </bean>
    
     <!-- 配置事物管理器 -->
    <bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
        <property name="dataSource" ref="dataSource" />
    </bean>

    <!-- 開始宣告式事務(事物註解) -->
    <tx:annotation-driven transaction-manager="transactionManager" />
    
    <!-- 使用ehcache快取 -->
	<bean id="ehCacheManagerFactory"
		class="org.springframework.cache.ehcache.EhCacheManagerFactoryBean">
		<property name="configLocation" value="classpath:ehcache.xml" />
		<property name="shared" value="true"></property>
	</bean>
    
    <!-- 支援快取註解 -->
	<cache:annotation-driven cache-manager="cacheManager" />
	<!-- 預設是cacheManager -->
	<bean id="cacheManager" class="org.springframework.cache.ehcache.EhCacheCacheManager">
		<property name="cacheManager" ref="ehCacheManagerFactory" />
	</bean>
    
</beans>
dbconfig.properties

資料庫連線

#MySQL
jdbc.driver=com.mysql.jdbc.Driver
hibernate.dialect=org.hibernate.dialect.MySQLDialect
validationQuery.sqlserver=SELECT 1
jdbc.url.jeecg=jdbc:mysql://localhost:3306/project?useUnicode=true&characterEncoding=UTF-8
jdbc.username.jeecg=root
jdbc.password.jeecg=root
jdbc.dbType=mysql


介面:
<form action="${ctx }/newsInfoController/save" enctype="multipart/form-data"  method="post" >
						 <input name="id" type="hidden" name="xxx" value="${entity.id}"  />
						<textarea id="myEditor" name="content" >${entity.content}</textarea>  
						<script type="text/javascript">
						   var editor =new UE.ui.Editor();
						   editor.render("myEditor");
 					    </script>
						<input  class="layui-btn layui-btn-primary" name="提交" type="submit" value="提交12">
						</form>
NewsInfoController 類
package com.main.controller;

import java.util.Date;

import javax.annotation.Resource;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.servlet.ModelAndView;

import com.main.entity.News;
import com.main.service.NewsService;

@Controller
@RequestMapping("newsInfoController")
public class NewsInfoController {

	
	@Resource
	private NewsService newsService;
	/**
     * 百度富文字編輯器:圖片上傳
     * @param request
     * @param response
	 * @throws ServletException 
     */
    @RequestMapping("/save")
    @ResponseBody  
    public ModelAndView  imgUploadByUeditor(News entity,HttpServletRequest request){
        System.out.println(entity.getContent()+"=========================");
//        //拿到編輯器的內容
        String content = request.getParameter("content");
        entity.setDatetime(new Date());
        newsService.updateNewsInfo(entity);
        
            //將內容設定進屬性
         request.setAttribute("content",content);
        return new ModelAndView("/news/newscontent");  
    }
}編輯i
編輯\static\ueditor\jsp\config.json

如需要原始碼,請私聊。因為本人介面設計到一些隱私不方便上傳全部原始碼。但是核心內容是可以提供的,以及實現是可以提供的

UEditor