前言我们经常选择这个框架是因为django自带的admin后台功能，也是因为它特别的自动生成鉴于这个事实项目采用了django，后台需要能够直接上传富文本内容直接进行网页展示，可定制性强，后来翻了几个知名的富文本编辑器我觉得tinymce还是满足简单条件的可以集成到djangoadmin中，但是tinymce免费版没有提供本地上传图片的服务，所以只能想办法集成图片上传到tinymce中。下面的记录解释了这个过程。创建一个满足条件的django项目项目环境：python2.7.13django1.11.6windows10在这个环境下创建一个初始的django项目，在models.py中添加一个测试用的模型，用于关联富文本显示为TextField字段，代码如下：models.py#-*-coding:utf-8-*-fromdjango.dbimportmodels#Createyourmodelshere.classTestTinymce(models.Model):title=models.CharField("Title",max_length=20,default="")content=models.TextField("Text",default="")classMeta:db_table="test_tinymce"verbose_name="test"verbose_name_plural="test"def__unicode__(self):返回self.title后，使用命令建表，让项目运行，并添加djangoadmin登录用户名和密码等，让项目进入后台界面，在注册admin.py，这样我们添加的表格就可以在django中显示了在admin中使用，进入如下界面：此时在添加测试数据的页面，TextField字段显示为普通的文本字段：Tinymcehandlestinymce官方下载地址为https://www.tinymce.com/downl...下载下载地址在本地解压TinyMCECommunity，取出tinymce目录，复制到你的django项目中的静态文件目录下。当前文件目录如下：IntegratedjangoadminandtinymceIntegratetinymceanddjangoadmin重要的是需要在django后台加载初始化tinymce的初始化函数，根据指定生成相应的富文本框参数。我们通过admin.py加载js到对应的模型处理界面：admin.py#-*-coding:utf-8-*-fromdjango.contribimportadminimportmodels#Registeryourmodelshere.classTestTinymce_Admin(admin.ModelAdmin):classMedia:js=['/static/tinymce/js/jquery.min.js',#必须先加载jquery，手动添加File'/static/tinymce/js/tinymce/tinymce.min.js',#tinymce自带文件'/static/tinymce/js/tinymce/plugins/jquery.form.js',#手动添加文件'/static/tinymce/js/tinymce/textarea.js',#手动添加文件，用户初始化参数]admin.site.register(models.TestTinymce,TestTinymce_Admin)其中jquery.min.js是一个普通的jquery文件，版本合适，tinymce.min.js是tinymce自带的文件，jquery.form.js是手动添加的，是一个表单插件，支持ajax表单提交和ajax文件上传，textarea.js是我自定义的js，我写了富文本参数对应的初始化，包括指定图片上传的指定处理路径textarea.jstinymce.init({selector:"textarea",//选择绑定到这个页面的标签themes:"modern",menubar:false,convert_urls:false,height:450,plugins:['advlistautolinklistslinkimagecharmapprintpreviewhranchorpagebreak','searchreplacewordcountvisualblocksvisualcharscodefullscreen','insertdatetimemedianonbreakingsavetablecontextmenudirectionality','emoticonstemplatepastetextcolorcolorpickertextpatternreuploadimagetools',"linktouploadbar"||粗体斜体|styleselectfontselectfontsizeselect|bullistnumlistoutdentindent|alignleftaligncenteralignrightalignjustify|printpreviewmedia|.css','//www.tinymce.com/css/codepen.min.css'],imageupload_url:'/upload_img/',//指定图片上传处理目录语言：'zh_CN'});注意：为了显示为中文，标示中文zh_CN，需要下载语言包zh_CN.js放在对应的langs文件夹下此时djangoadmin中的文本框已经被富文本框代替了，我们只需要上传集成相应的图片即可：将上传图片功能集成到tinymce中，在plugins文件夹中添加图片上传插件imageupload,这时候在我们在textarea.js中的toolbar参数中添加imageupload,同时下载jquery.form.js放在我们在admin.py中加载的路径中:此时我们可以看到富文本框指定位置出现图片上传按钮，点击按钮上传本地文件：弹出按钮出现后，我们在imageupload_url:'/upload_img/'uploaded路径后面进行视图处理文件。根据django的映射规则，我们在urls.py中添加路径：url(r'^upload_img/$',views.upload_img),#背景富文本框上传图片在views.py中添加函数upload_img进行处理并接收上传：#-*-coding:utf-8-*-fromdjango.shortcutsimportrenderfromdjango.views.decorators.csrfimportcsrf_exemptimportjsonimporttimefromPILimportImagefromdjango.confimportsettingsfromdjango.httpimportHttpResponse#创建你的视图here.static_base='http://127.0.0.1:8000'static_url=settings_URL+#上传文件显示路径前缀#上传图片POST@csrf_exemptdefupload_img(request):file=request.FILES['file']data={'错误'：真，'路径'：''，}如果文件：timenow=int（time.time（）*1000）timenow=str（timenow）尝试：img=Image.open(file)img.save(settings.MEDIA_ROOT+"content/"+timenow+unicode(str(file)))除了异常，e:printereturnHttpResponse(json.dumps(data),content_type="application/json")imgUrl=static_url+'content/'+timenow+str(file)data['error']=Falsedata['path']=imgUrl返回HttpResponse(json.dumps(data),content_type="application/json")创建一个用于接收上传文件的文件夹，根据settings.py中的配置和指定的上传文件目录：为防止回显时识别媒体路径，在urlpatterns中添加如下内容：fromdjango.conf.urlsimporturlfromdjango.contribimportadminfromappimportviewsfromdjango.confimportsettingsfromdjango.conf.urls.staticimportstaticurlpatterns=[url(r'^upload_img/$',views.upload_img),#backgroundrichtextboxUploadimageurl(r'^admin/',admin.site.urls),]+static(settings.MEDIA_URL,document_root=settings.MEDIA_ROOT)目前已经实现所有功能，可以看到回显后上传图片成功：顺便在settings.py中配置上传文件和静态文件目录：#Internationalization#https://docs.djangoproject.com/en/1.10/topics/i18n/LANGUAGE_CODE='zh-hans'TIME_ZONE='Asia/Shanghai'USE_I18N=TrueUSE_L10N=TrueUSE_TZ=False#静态文件（CSS、JavaScript、图片）#https://docs.djangoproject.com/en/1.8/howto/static-files/STATIC_URL='/static/'#运行pythonmanage.py时collectstatic#STATIC_ROOT文件夹用于收集所有STATICFILES_DIRS中所有文件夹中的文件，以及static中的文件ineachapp都copy过来#把这些文件放在一起用apache等部署的时候比较方便项目中的static文件，不能包含STATIC_ROOT#如果不想用STATICFILES_DIRS可以不用，也可以放在app.static中。STATICFILES_DIRS=(os.path.join(BASE_DIR,"common_static"),)#这是默认设置。Django默认会在STATICFILES_DIRS中的文件夹和每个应用下的静态文件夹中查找文件。#注意这里有顺序。找到了就不会继续找了。STATICFILES_FINDERS=("django.contrib.staticfiles.finders.FileSystemFinder","django.contrib.staticfiles.finders.AppDirectoriesFinder")ADMIN_MEDIA_PREFIX=STATIC_URL+'admin/'MEDIA_URL='/media/'MEDIA_ROOT=BASE_DIR+'/media/上传/'附上GITHUB上传的源码：https://github.com/Z-July/dja...
