`
conkeyn
  • 浏览: 1528919 次
  • 性别: Icon_minigender_1
  • 来自: 厦门
社区版块
存档分类
最新评论

Spring boot 环境下配置CKEditor添加google map

 
阅读更多

本文档基于已经搭建好基础ckeditor的环境上。如:http://www.cnblogs.com/daxin/p/3553865.html

使用leaflet的ckeditor的google map插件;

 

1、下载、解压插件

下载地址:

http://ckeditor.com/addon/leaflet

下面是leaflet依赖的插件

http://ckeditor.com/addon/widgetselection

http://ckeditor.com/addon/widget

http://ckeditor.com/addon/lineutils

将以上包下载,解压到ckeditor/plugins目录下。

 

2、配置ckeditor/config.js

 

config.extraPlugins+="widgetselection,lineutils,widget,leaflet,";
config.leaflet_maps_google_api_key = 'AIzaSyA9ySM6msnGm0qQB1L1cLTMBdKEUKPySmQ';

 这个google map key建议自己再申请一个哦,代码中的是原开发者的,可能不能用了。

 查看一下效果:

3、在java环境中可能会遇到以下错误:

in a frame because it set 'x-frame-options' to 'deny'.

 4、那么别着急,添加一下java配置代码和xml配置即可。

4.1、使用spring xml文件配置

<http>    
    <headers>
        <frame-options policy="SAMEORIGIN"/><!-- 相同域名下允许加载 -->
    </headers>
</http>

 

4.2、使用spring boot代码配置

@Override
    protected void configure(HttpSecurity http) throws Exception { 
        //直接关闭frameOptions功能
        http.headers().frameOptions().disable();
    }

 5、验证一下。

 

  • 大小: 16.2 KB
分享到:
评论

相关推荐

    CKEditor 添加Video插件(MP4,MP3)并且兼容HTML5 Video插件

    CKEditor 添加Video插件(MP4)并且兼容HTML5 Video插件 1:把video文件复制到ckeditor/... b:配置 CKEditor的(config.js) 文件,加入下面的代码,意思是引入插件 添加后面这句号加载。 config.extraPlugins = 'video';

    springmc ckeditor ckfinder三者整合

    1. 引入依赖:在Spring MVC项目中,添加CKEditor和CKFinder的库,通常是通过Maven或Gradle引入对应的jar包或NPM模块。 2. 配置CKEditor:在HTML页面中引入CKEditor,并设置其配置项,如工具栏、语言等。同时,配置...

    Asp.Net mvc3中ckeditor4.4.0与ckfinder配置上传图片.zip

    本项目是关于如何在ASP.NET MVC3环境中配置CKEditor 4.4.0版本与CKFinder进行图片上传的详细步骤。 首先,`Global.asax`文件是ASP.NET应用程序的全局应用事件处理程序,它定义了应用程序启动、结束、请求开始等关键...

    ckeditor配置(详细)

    2. **创建文本区域**:在需要使用编辑器的地方插入一个`&lt;textarea&gt;`或ASP.NET环境下的`&lt;TextBox&gt;`控件,并为其添加`class="ckeditor"`属性,以便CKEditor能够识别并转换它。 ```html ...

    CKEditor添加HTML5 Video插件的方法

    CKEditor4.2只能增加flash播放格式,没有视频插件。这个插件允许插入和编辑新的HTML5&lt;video&gt;元素。该对话框允许指定的海报图像,尺寸(他们是根据预览自动调整)和两个源文件,这样既使用了WebM格式(Chrome...

    ckeditor_4.x自定义按钮控件详细配置

    在 mydialog.js 文件中,我们可以使用 CKEDITOR.dialog.add() 方法来添加自定义窗口的配置信息,例如: ``` CKEDITOR.dialog.add('mydialog', function(editor) { return { title: '标题', minWidth: 400, ...

    ckeditor4添加上传视频插件

    "ckeditor4添加上传视频插件"这个主题,是关于如何在CKEditor 4中集成视频上传功能的教程。下面我们将详细探讨这一过程。 首先,视频上传功能的实现通常涉及前后端两个部分。前端部分是CKEditor 4编辑器的用户界面...

    Spring Boot项目10之发帖模块项目源码

    在本项目中,我们主要探讨的是如何在Spring Boot框架下构建一个完整的发帖模块,这在许多Web应用程序中是核心功能之一,特别是对于论坛、博客等互动性平台。Spring Boot以其简洁的配置、快速的开发体验和强大的依赖...

    ckeditor配置上传视频

    最近项目开发需要用到CKEditor在线编辑器,但发现他本身没有自带,所以需要自己手动配置插件。但网上很多配置都有问题,自己摸索了好久终于搞定。需要注意的细节有:flvPlayer文件夹的内容直接放在ckeditor文件夹...

    springboot集成富文本编辑器

    在IT行业中,Spring Boot是一个非常流行的Java开发框架,它简化了Spring应用的初始搭建以及开发过程,提供了自动配置、起步依赖等特性。本项目聚焦于将富文本编辑器集成到Spring Boot应用中,以增强用户界面的内容...

    CKEditor3.5.2+CKfinder

    CKEditor和CKFinder是两个非常重要的Web内容编辑和管理工具,尤其在网页开发和内容管理系统中广泛应用。CKEditor3.5.2是一个成熟的富文本编辑器,而CKFinder则是一个文件管理和上传组件,它们通常一起使用,以提供一...

    CKEDITOR 编辑器本地上传图片(好)

    `addAdvice.jsp`可能用于处理用户提交的包含CKEDITOR编辑器内容的表单,比如添加建议或评论。它可能会接收编辑器内的HTML内容,保存到数据库,或者进一步处理图片URL,确保它们能在服务器上正确访问。 6. **安全与...

    在CI框架中配置ckeditor流程

    - 解压缩下载的文件,将CKEditor的`ckeditor`文件夹移动到你的网站根目录下。例如:`D:\Program Files\EasyPHP-DevServer-13.1VC9\data\localweb\qnshop_portals\ckeditor`。 - 对于CKFinder,将其`CKFinder`...

    ckeditor的详细配置

    ### ckeditor的详细配置 ckeditor是一款非常流行的富文本编辑器,它是FCKeditor的后续版本,广泛应用于网页开发中,支持多种浏览器环境。本文将详细阐述如何进行ckeditor的基本配置及高级定制,帮助开发者更好地...

    ckeditor4.2.2自定义配置

    **ckeditor4.2.2自定义配置** CKEditor是一款强大的富文本编辑器,广泛应用于网页内容编辑、CMS系统以及各种在线文档处理。CKEditor 4.2.2是该系列的一个较早版本,但仍然包含丰富的功能和高度的可定制性。在实际...

    ckeditor及配置方法

    **ckeditor及配置方法** CKEditor是一款强大的富文本编辑器,广泛应用于网站内容管理、论坛、博客等场景,为用户提供了一种便捷的在线文本编辑体验。它支持多种语言,包括中文,且具有高度可定制性,可以满足不同...

    Ajax-michaelcgood-ckeditor-spring-boot.zip

    Ajax-michaelcgood-ckeditor-spring-boot.zip,演示如何将ckeditor与spring boot结合使用的教程。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页...

    .NET环境下ckeditor与ckfinder配置(附ckfinder1.x注册机)

    .NET环境下ckeditor与ckfinder配置(附ckfinder1.x注册机)

    CKEditor 添加Video插件(MP4)并且兼容HTML5 Video插件,完美运行

    通过安装和配置插件,我们可以扩展CKEditor的功能,比如添加视频插入能力。 1. **添加Video插件**:CKEditor允许开发者通过插件来扩展其功能。为了在CKEditor中添加Video插件,首先你需要从CKEditor的官方插件库或...

    springMVC的action配置+ckeditor

    在这个主题中,我们将聚焦于如何在SpringMVC中配置Action,并结合CKEditor来实现图片的粘贴和上传功能。 CKEditor是一款广泛使用的富文本编辑器,它可以提供丰富的文本格式化选项,以及图片和多媒体内容的插入能力...

Global site tag (gtag.js) - Google Analytics