1、进入官网
2、下载
官网下载：http://kindeditor.net/down.php
3、文件夹说明
├── asp asp示例
├── asp.net asp.net示例
├── attached 空文件夹，放置关联文件attached
├── examples HTML示例
├── jsp java示例
├── kindeditor-all-min.js 全部JS（压缩）
├── kindeditor-all.js 全部JS（未压缩）
├── kindeditor-min.js 仅KindEditor JS（压缩）
├── kindeditor.js 仅KindEditor JS（未压缩）
├── lang 支持语言
├── license.txt License
├── php PHP示例
├── plugins KindEditor内部使用的插件
└── themes KindEditor主题
4、基本使用
<textarea name="content" id="content"></textarea><script src="/static/jquery-1.12.4.js"></script>
<script src="/static/plugins/kind-editor/kindeditor-all.js"></script>
<script>$(function () {initKindEditor();});function initKindEditor() {var kind = KindEditor.create('#content', {width: '100%', // 文本框宽度(可以百分比或像素)height: '300px', // 文本框高度(只能像素)minWidth: 200, // 最小宽度（数字）minHeight: 400 // 最小高度（数字）});}
</script>
5、详细参数
http://kindeditor.net/docs/option.html
6、上传文件示例
<!DOCTYPE html> <html> <head lang="en"><meta charset="UTF-8"><title></title> </head> <body><div><h1>文章内容</h1>{{ request.POST.content|safe }} </div><form method="POST"><h1>请输入内容：</h1>{% csrf_token %}<div style="width: 500px; margin: 0 auto;"><textarea name="content" id="content"></textarea></div><input type="submit" value="提交"/> </form><script src="/static/jquery-1.12.4.js"></script> <script src="/static/plugins/kind-editor/kindeditor-all.js"></script> <script>$(function () {initKindEditor();});function initKindEditor() {var a = 'kind';var kind = KindEditor.create('#content', {width: '100%', // 文本框宽度(可以百分比或像素) height: '300px', // 文本框高度(只能像素) minWidth: 200, // 最小宽度（数字） minHeight: 400, // 最小高度（数字） uploadJson: '/kind/upload_img/',extraFileUploadParams: {'csrfmiddlewaretoken': '{{ csrf_token }}'},fileManagerJson: '/kind/file_manager/',allowPreviewEmoticons: true,allowImageUpload: true});} </script> </body> </html>
import os import json import timefrom django.shortcuts import render from django.shortcuts import HttpResponsedef index(request):"""首页:param request::return:"""return render(request, 'index.html')def upload_img(request):"""文件上传:param request::return:"""dic = {'error': 0,'url': '/static/imgs/20130809170025.png','message': '错误了...'}return HttpResponse(json.dumps(dic))def file_manager(request):"""文件管理:param request::return:"""dic = {}root_path = '/Users/wupeiqi/PycharmProjects/editors/static/'static_root_path = '/static/'request_path = request.GET.get('path')if request_path:abs_current_dir_path = os.path.join(root_path, request_path)move_up_dir_path = os.path.dirname(request_path.rstrip('/'))dic['moveup_dir_path'] = move_up_dir_path + '/' if move_up_dir_path else move_up_dir_pathelse:abs_current_dir_path = root_pathdic['moveup_dir_path'] = ''dic['current_dir_path'] = request_pathdic['current_url'] = os.path.join(static_root_path, request_path)file_list = []for item in os.listdir(abs_current_dir_path):abs_item_path = os.path.join(abs_current_dir_path, item)a, exts = os.path.splitext(item)is_dir = os.path.isdir(abs_item_path)if is_dir:temp = {'is_dir': True,'has_file': True,'filesize': 0,'dir_path': '','is_photo': False,'filetype': '','filename': item,'datetime': time.strftime('%Y-%m-%d %H:%M:%S', time.gmtime(os.path.getctime(abs_item_path)))}else:temp = {'is_dir': False,'has_file': False,'filesize': os.stat(abs_item_path).st_size,'dir_path': '','is_photo': True if exts.lower() in ['.jpg', '.png', '.jpeg'] else False,'filetype': exts.lower().strip('.'),'filename': item,'datetime': time.strftime('%Y-%m-%d %H:%M:%S', time.gmtime(os.path.getctime(abs_item_path)))}file_list.append(temp)dic['file_list'] = file_listreturn HttpResponse(json.dumps(dic))
7、XSS过滤特殊标签
处理依赖
pip3 install beautifulsoup4
from bs4 import BeautifulSoupclass XSSFilter(object):__instance = Nonedef __init__(self):# XSS白名单self.valid_tags = {"font": ['color', 'size', 'face', 'style'],'b': [],'div': [],"span": [],"table": ['border', 'cellspacing', 'cellpadding'],'th': ['colspan', 'rowspan'],'td': ['colspan', 'rowspan'],"a": ['href', 'target', 'name'],"img": ['src', 'alt', 'title'],'p': ['align'],"pre": ['class'],"hr": ['class'],'strong': []}@classmethoddef instance(cls):if not cls.__instance:obj = cls()cls.__instance = objreturn cls.__instancedef process(self, content):soup = BeautifulSoup(content, 'lxml')# 遍历所有HTML标签for tag in soup.find_all(recursive=True):# 判断标签名是否在白名单中if tag.name not in self.valid_tags:tag.hidden = Trueif tag.name not in ['html', 'body']:tag.hidden = Truetag.clear()continue# 当前标签的所有属性白名单attr_rules = self.valid_tags[tag.name]keys = list(tag.attrs.keys())for key in keys:if key not in attr_rules:del tag[key]return soup.renderContents()if __name__ == '__main__':html = """<p class="title"><b>The Dormouse's story</b></p><p class="story"><div name='root'>Once upon a time there were three little sisters; and their names were<a href="http://example.com/elsie" class="sister c1" style='color:red;background-color:green;' id="link1"><!-- Elsie --></a><a href="http://example.com/lacie" class="sister" id="link2">Lacie</a> and<a href="http://example.com/tillie" class="sister" id="link3">Tilffffffffffffflie</a>;and they lived at the bottom of a well.<script>alert(123)</script></div></p><p class="story">...</p>"""v = XSSFilter.instance().process(html)print(v)
#!/usr/bin/env python # -*- coding:utf-8 -*- from bs4 import BeautifulSoupclass XSSFilter(object):__instance = Nonedef __init__(self):# XSS白名单self.valid_tags = {"font": ['color', 'size', 'face', 'style'],'b': [],'div': [],"span": [],"table": ['border', 'cellspacing', 'cellpadding'],'th': ['colspan', 'rowspan'],'td': ['colspan', 'rowspan'],"a": ['href', 'target', 'name'],"img": ['src', 'alt', 'title'],'p': ['align'],"pre": ['class'],"hr": ['class'],'strong': []}def __new__(cls, *args, **kwargs):"""单例模式:param cls::param args::param kwargs::return:"""if not cls.__instance:obj = object.__new__(cls, *args, **kwargs)cls.__instance = objreturn cls.__instancedef process(self, content):soup = BeautifulSoup(content, 'lxml')# 遍历所有HTML标签for tag in soup.find_all(recursive=True):# 判断标签名是否在白名单中if tag.name not in self.valid_tags:tag.hidden = Trueif tag.name not in ['html', 'body']:tag.hidden = Truetag.clear()continue# 当前标签的所有属性白名单attr_rules = self.valid_tags[tag.name]keys = list(tag.attrs.keys())for key in keys:if key not in attr_rules:del tag[key]return soup.renderContents()if __name__ == '__main__':html = """<p class="title"><b>The Dormouse's story</b></p><p class="story"><div name='root'>Once upon a time there were three little sisters; and their names were<a href="http://example.com/elsie" class="sister c1" style='color:red;background-color:green;' id="link1"><!-- Elsie --></a><a href="http://example.com/lacie" class="sister" id="link2">Lacie</a> and<a href="http://example.com/tillie" class="sister" id="link3">Tilffffffffffffflie</a>;and they lived at the bottom of a well.<script>alert(123)</script></div></p><p class="story">...</p>"""obj = XSSFilter()v = obj.process(html)print(v)
