LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui

LoT.UI开源地址如下:https://github.com/dunitian/LoTCodeBase/tree/master/LoTUI

先看在LoT.UI里面的应用效果图:

完整Demo:(https://github.com/dunitian/LoTCodeBase/tree/master/NetCode/3.常用技能/03.Ueditor)

核心代码演示:

1.HTML部分:

2.Script部分(提交的时候最好清一下草稿箱)

net程序员注意点:(根目录的配置)(所有的都改下,这边就举例2处,下面是我的配置文件,仅供参考)

/* 前后端通信相关的配置,注释只允许使用多行方式 */
{/* 上传图片配置项 */"imageActionName": "uploadimage", /* 执行上传图片的action名称 */"imageFieldName": "upfile", /* 提交的图片表单名称 */"imageMaxSize": 2048000, /* 上传大小限制,单位B */"imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 上传图片格式显示 */"imageCompressEnable": true, /* 是否压缩图片,默认是true */"imageCompressBorder": 1600, /* 图片压缩最长边限制 */"imageInsertAlign": "none", /* 插入的图片浮动方式 */"imageUrlPrefix": "", /* 图片访问路径前缀 */"imagePathFormat": "/UEUpload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 *//* {filename} 会替换成原文件名,配置这项需要注意中文乱码问题 *//* {rand:6} 会替换成随机数,后面的数字是随机数的位数 *//* {time} 会替换成时间戳 *//* {yyyy} 会替换成四位年份 *//* {yy} 会替换成两位年份 *//* {mm} 会替换成两位月份 *//* {dd} 会替换成两位日期 *//* {hh} 会替换成两位小时 *//* {ii} 会替换成两位分钟 *//* {ss} 会替换成两位秒 *//* 非法字符 \ : * ? " < > | *//* 具请体看线上文档: fex.baidu.com/ueditor/#use-format_upload_filename *//* 涂鸦图片上传配置项 */"scrawlActionName": "uploadscrawl", /* 执行上传涂鸦的action名称 */"scrawlFieldName": "upfile", /* 提交的图片表单名称 */"scrawlPathFormat": "/UEUpload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */"scrawlMaxSize": 2048000, /* 上传大小限制,单位B */"scrawlUrlPrefix": "", /* 图片访问路径前缀 */"scrawlInsertAlign": "none",/* 截图工具上传 */"snapscreenActionName": "uploadimage", /* 执行上传截图的action名称 */"snapscreenPathFormat": "/UEUpload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */"snapscreenUrlPrefix": "", /* 图片访问路径前缀 */"snapscreenInsertAlign": "none", /* 插入的图片浮动方式 *//* 抓取远程图片配置 */"catcherLocalDomain": ["127.0.0.1", "localhost", "img.baidu.com"],"catcherActionName": "catchimage", /* 执行抓取远程图片的action名称 */"catcherFieldName": "source", /* 提交的图片列表表单名称 */"catcherPathFormat": "/UEUpload/image/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */"catcherUrlPrefix": "", /* 图片访问路径前缀 */"catcherMaxSize": 2048000, /* 上传大小限制,单位B */"catcherAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 抓取图片格式显示 *//* 上传视频配置 */"videoActionName": "uploadvideo", /* 执行上传视频的action名称 */"videoFieldName": "upfile", /* 提交的视频表单名称 */"videoPathFormat": "/UEUpload/video/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */"videoUrlPrefix": "", /* 视频访问路径前缀 */"videoMaxSize": 102400000, /* 上传大小限制,单位B,默认100MB */"videoAllowFiles": [".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid"], /* 上传视频格式显示 *//* 上传文件配置 */"fileActionName": "uploadfile", /* controller里,执行上传视频的action名称 */"fileFieldName": "upfile", /* 提交的文件表单名称 */"filePathFormat": "/UEUpload/file/{yyyy}{mm}{dd}/{time}{rand:6}", /* 上传保存路径,可以自定义保存路径和文件名格式 */"fileUrlPrefix": "", /* 文件访问路径前缀 */"fileMaxSize": 51200000, /* 上传大小限制,单位B,默认50MB */"fileAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp",".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"], /* 上传文件格式显示 *//* 列出指定目录下的图片 */"imageManagerActionName": "listimage", /* 执行图片管理的action名称 */"imageManagerListPath": "upload/image", /* 指定要列出图片的目录 */"imageManagerListSize": 20, /* 每次列出文件数量 */"imageManagerUrlPrefix": "", /* 图片访问路径前缀 */"imageManagerInsertAlign": "none", /* 插入的图片浮动方式 */"imageManagerAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"], /* 列出的文件类型 *//* 列出指定目录下的文件 */"fileManagerActionName": "listfile", /* 执行文件管理的action名称 */"fileManagerListPath": "upload/file", /* 指定要列出文件的目录 */"fileManagerUrlPrefix": "", /* 文件访问路径前缀 */"fileManagerListSize": 20, /* 每次列出文件数量 */"fileManagerAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp",".flv", ".swf", ".mkv", ".avi", ".rm", ".rmvb", ".mpeg", ".mpg",".ogg", ".ogv", ".mov", ".wmv", ".mp4", ".webm", ".mp3", ".wav", ".mid",".rar", ".zip", ".tar", ".gz", ".7z", ".bz2", ".cab", ".iso",".doc", ".docx", ".xls", ".xlsx", ".ppt", ".pptx", ".pdf", ".txt", ".md", ".xml"] /* 列出的文件类型 */
}

  

文件后缀:if (string.IsNullOrEmpty(extension)) { extension = ".jpg"; } //针对有些网站图片是:xxx.jpg?xxx/xxx/xxx 或者 xxx.aspx?id=123  后缀就为空了。你通过UE保存的图片也就没有后缀了,如果你IIS设置了则图片正常显示,没有设置就蛋疼了,所以还是加个默认格式吧

网络参考方法:(IIS显示没有后缀的图

显然,默认情况下IIS不支持对这种无任何后缀文件的解析,因为它无法识别这是普通的HTML文件,还是图片文件,抑或是其他类型的文件。从IIS 7.0版本开始,就已经支持相当多种的后缀名了,其机制是在“MIME类型”这个模块中完成的。如下图,这是IIS 8.0的界面,也同样适用于IIS 7.0/7.5/8.0/8.5,但不适用于IIS 6.0(IIS 6.0也可以设置MIME类型,只是界面不同)。

进入“MIME类型”模块后,我们点击右侧的“添加”,然后填好文件扩展名和类型值。对于无后缀的图片文件,扩展名只需填写“点”符号即可,类型值根据图片文件实际的扩展名填写。如果是jpeg格式的,那么就填写image/jpeg,同样的道理,也可以填写image/gif或image/png等。

这样,就完成了新MIME类型的设置。其实,设置MIME类型无需服务器管理员来操作,IIS 7.0以上的版本已经把这个功能放权给了站长。细心的人会发现,设置完成后,在站点根目录下多了一个web.config文件。稍微观察下就会发现,config文件里的XML代码就对应着我们刚才的设置。如果您还需要设置其他MIME类型的话,只需接着第一个mimeMap标记后继续编写即可。需要注意的是,自定义的设置不能和IIS默认已经提供的其他文件后缀名重复。

<?xml version="1.0" encoding="UTF-8"?>
<configuration><system.webServer><staticContent><mimeMap fileExtension="." mimeType="image/jpeg" /></staticContent></system.webServer>
</configuration>

开源组件:https://github.com/fex-team/ueditor

转载于:https://www.cnblogs.com/dunitian/p/5551701.html

07.LoT.UI 前后台通用框架分解系列之——强大的文本编辑器相关推荐

  1. 08.LoT.UI 前后台通用框架分解系列之——多样的Tag选择器

    LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...

  2. 03.LoT.UI 前后台通用框架分解系列之——多样的表格

    LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...

  3. 01.LoT.UI 前后台通用框架分解系列之——小图片背景全屏显示(可自动切换背景)...

    LOT.UI分解系列汇总:http://www.cnblogs.com/dunitian/p/4822808.html#lotui LoT.UI开源地址如下:https://github.com/du ...

  4. android 富文本框架_五种JavaScript富文本编辑器,总有一款适合你

    全文共2099字,预计学习时长4分钟 也许,你时常会遇到要开发基于Web的文本编辑器的情况.有时候,只需实现一个简约且轻量级的应用程序,不必有其他任何不必要的功能.而有时候,你的首要任务是保护用户的商 ...

  5. 江湖CMS框架改成百度UEditor富文本编辑器

    下载UEedit到/public/ueditor下.ueditor1_4_3_3-utf8-php版 添加文章模版/h1sg/web/system/admin/view/article/article ...

  6. 视频教程-游戏UI界面框架设计系列视频课程-Unity3D

    游戏UI界面框架设计系列视频课程 二十多年的软件开发与教学经验IT技术布道者,资深软件工程师.具备深厚编程语言经验,在国内上市企业做项目经理.研发经理,熟悉企业大型软件运作管理过程.软件架构设计理论. ...

  7. Android通用框架设计与完整电商APP开发系列文章

    作者|傅猿猿 责编|Javen205 有福利 有福利 有福利 鸣谢 感谢@傅猿猿 邀请写此系列文章 Android通用框架设计与完整电商APP开发 课程介绍 [[导学视频](http://szv1.m ...

  8. SLAM的通用框架:GSLAM

    SLAM的通用框架:GSLAM GSLAM: A General SLAM Framework and Benchmark 论文链接: http://openaccess.thecvf.com/con ...

  9. 拿transformer做E2E全景分割,这个通用框架霸榜挑战赛,南大、港大联合提出

    视学算法报道 机器之心编辑部 本文中,来自南大.港大.英伟达等机构的研究者提出了一个使用 transformer 进行端到端全景分割的通用框架,不仅为语义分割与实例分割提供了统一的 mask 预测工作 ...

最新文章

  1. ue4 4.24启动无响应_UE4项目问题集合
  2. python删除类方法_python中向类中动态添加新特性及删除属性方法
  3. 查看LINUX进程内存占用情况 top pmap ps
  4. CentOS 7安装Redis服务
  5. 用JS实现人脑和计算机交互,这个厉害了
  6. 让互联网更快的协议,QUIC在腾讯的实践及性能优化
  7. Maven学习-优化和重构POM
  8. Python自学笔记-lambda函数(来自廖雪峰的官网Python3)
  9. 【ArcGIS操作】1 基础编辑篇
  10. 电信光猫获取超级管理员账号
  11. (hightopo)学习笔记(1)
  12. PTES_Technical_Guidelines(渗透测试执行标准)
  13. Http的会话跟踪和跨站攻击(xss)
  14. GoogleChrome最新的代理设置流程
  15. Android 解决XXX Layout leaked 使用Navigation 踩坑 XML内存泄漏
  16. 股权转让项目:厦门古龙温泉山庄开发有限公司60%股权转让
  17. 程序员高效率工作工具归纳(上)
  18. python的numpy教程_ROS与Python入门教程-使用numpy
  19. 关于linux中cron.daily、weekly、monthly执行时间的问题?
  20. 3Dmap generator绘制三维地形

热门文章

  1. Android 应用进行性能分析/APP/系统性能分析
  2. DW中CSS属性详解
  3. 我的个人博客搭建记录
  4. OpenSSL中对称加密算法DES常用函数使用举例
  5. python如何控制程序的运行顺序_Python流程控制-1 顺序执行
  6. 双显卡单独分辨率_CPU、GPU双重碾压!AMD RX 6000系列显卡正式发布 16G显存吊锤RTX 30...
  7. android软件安全权威指南 pdf_AV-TEST 发布 2019 最佳 Android 安全软件榜单
  8. python selenium unittest_python+selenium+unittest——ui自动化的轻量级选择
  9. Docker初学2:Docker的安装
  10. Java学习总结:37(比较器)