基于.NET Core 3.1 网站开发和部署的方法(9)

注意此时数据验证通过,使用js提交表单的话,编辑器并没有替换原来的内容,需要手动替换
$("#NewsContent").html(content);
不然提交到控制器中是没有值的。

var onSubmit=function(){ var content=CKEDITOR.instances.NewsContent.getData(); if(content==""){ alert("新闻内容不能为空"); } else{ $("#NewsContent").html(content); $("#mainForm").submit(); } }

清空编辑器的内容
CKEDITOR.instances.NewsContent.setData("");

In rare cases it may happen that the server or application configuration
will reject submitted HTML content if it is not encoded first (e.g. ASP.NET ValidateRequest).
In such case check the config.htmlEncodeOutput option.

config.htmlEncodeOutput = true;

上传图片设置
需要外部插件:file browser,popup,filetools
配置config.js文件

config.filebrowserBrowseUrl = ‘/browser/browse.php'; config.filebrowserUploadUrl = ‘/uploader/upload.php';

控制器中的参数使用 (IFormFile upload) 使用的是upload的参数名。
如何给一个响应,放弃不用这个,使用filebrowserBrowseUrl这个功能,里面也有上传

具体方法是:

构建一个图片上传和浏览的页面

完成图片上传功能

图片选装功能

响应的js代码如下:

<script> // Helper function to get parameters from the query string. function getUrlParam( paramName ) { var reParam = new RegExp( '(?:[\?&]|&)' + paramName + '=([^&]+)', 'i' ); var match = window.location.search.match( reParam ); return ( match && match.length > 1 ) ? match[1] : null; } var upload=function(){ var file=$(".btnUpload>input")[0].files[0]; if(file==null){ alert("请选择上传图片"); } else{ var formData=new FormData(); formData.append("upload",file); // 实例化一个AJAX对象 var xhr = new XMLHttpRequest(); xhr.onload = function() { $(".border3").first().before('<div><span><h3><span>new</span></h3><img src="/images/news/'+xhr.responseText+'"></span><div>'+xhr.responseText+'</div></div>'); } xhr.open("post",'@Url.Action("UploadImage","News")',true); // 发送表单数据 xhr.send(formData); } } var selectedImg=null; var select=function(img){ if(selectedImg!=null){ selectedImg.parents(".border3").removeClass("selected"); } selectedImg=$(img); selectedImg.parents(".border3").addClass("selected"); } var choose=function(){ if(selectedImg!=null){ var funcNum = getUrlParam( 'CKEditorFuncNum' ); var fileUrl = selectedImg.attr("src"); window.opener.CKEDITOR.tools.callFunction( funcNum, fileUrl ); window.close(); } else{ alert("请选装图片"); } } </script>

基于.NET Core 3.1 网站开发和部署的方法

5.其他功能省略代码

六、使用依赖注入改进项目

1.抽取接口

通过vs来抽取接口,效率高。

2.重新组织项目结构

新增IDAL、IBLL、DBUtility
UI–>IBLL–>IDAL–>Models
BLL–>IBLL、IDAL
IDAL–>Models
DAL–>IDAL、DBUtility

基于.NET Core 3.1 网站开发和部署的方法

3.注册依赖服务

public void ConfigureServices(IServiceCollection services) { //其他代码省略了 ... services.AddDbContext<DBUtility.HotelWebDbContext>( options => options.UseMySql( Configuration.GetConnectionString("HotelWeb"), x => x.ServerVersion("5.5.64-mariadb") ) ); services.AddTransient<INewsManager, NewsManager>(); services.AddTransient<IDishManager, DishManager>(); services.AddTransient<IDishBookManager, DishBookManager>(); services.AddTransient<ISuggestionManager, SuggestionManager>(); services.AddTransient<IRecruitmentManager, RecruitmentManager>(); services.AddTransient<ISysAdminManager, SysAdminManager>(); services.AddTransient<INewsService,NewsService>(); services.AddTransient<IDishService,DishService>(); services.AddTransient<IDishBookService,DishBookService>(); services.AddTransient<ISuggestionService,SuggestionService>(); services.AddTransient<IRecruitmentService,RecruitmentService>(); services.AddTransient<ISysAdminService,SysAdminService>(); }

4.修改代码使用依赖注入

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wxgdfp.html