背景:如今愈来愈多的企业都采用了在开发上先后端分离,先后端开发上的分离有不少种,那么今天,我来分享一下项目中得的先后端分离。html
B/S Saas 项目:(这个项目能够理解成我的中心,固然不止这么点功能)前端
前端:node.js + vuevue
后端:.net core webapinode
前端安装 node.js 跟建立vue项目这些不是这篇文章的重点,重点在于项目完成后的部署。web
.net core webapi建立后,默认就建立了一个wwwroot的文件夹,这个文件夹是用来放置静态文件的,因此,咱们能够理解成,这个文件夹将放置咱们的build好的前端项目。后端
OK,到如今来说,有一个颇有意思的发现(也能够是一点意思都没有,由于都是同一个爸生的),这项目的部署跟mvc的部署的很像(这里不涉及底层运行,只是一个发布后简单的像而已)。api
由上图就足够清晰了,这样的部署是属于开发上的先后端分离,他们同属于一个站点,绑定同一个域名,因此不涉及跨域,外部不能直接调用webapi(安全上仍是有保证D)。跨域
那么这样的部署却很简单,仅仅是在 Startup 里面的 Configure 设置 一下便可安全
//设置主页 app.UseDefaultFiles(); //这个是.net core webapi 访问wwwroot文件夹的配置,开启静态文件
app.UseStaticFiles(); app.UseMvc(routes => { routes.MapRoute( name: "default", template: "api/{controller=Login}/{action=Get}/{id?}"); });
一、首先是设置主页服务器
这里直接使用的是默认的,就是 UseDefaultFiles 会重定向到 default.htm、default.html、index.htm、index.html。固然你也能够指定设置的首页(指定的页面是能够自定义的!)
//设置主页
DefaultFilesOptions defaultFilesOptions = new DefaultFilesOptions(); defaultFilesOptions.DefaultFileNames.Clear(); defaultFilesOptions.DefaultFileNames.Add("index.html"); app.UseDefaultFiles(defaultFilesOptions);
这样就设定了重定向到 index.html,那为何前面用了 Clear,其实我的认为仅仅是为了保险,由于
二、开启静态文件,UseDefaultFiles 仅仅是一个重定向URL而不是真的提供一个文件,真正提供静态文件的仍是 UseStaticFiles。这就是为何要优先设置 UseDefaultFiles 再到 UseStaticFiles的缘由。固然,提供静态文件也提供了多个重载,能够提供一个相对路径,还有静态文件目录的选择。
//这个是.net core webapi 访问wwwroot文件夹的配置,开启静态文件
StaticFileOptions staticFileOptions = new StaticFileOptions(); staticFileOptions.FileProvider = new Microsoft.Extensions.FileProviders.PhysicalFileProvider(@"D:\testsite\wwwroot\");//指定目录你站点api的要访问的wwwroot目录
app.UseStaticFiles(staticFileOptions);
上面这种写法也一样能够,固然指定的目录也一样能够放到配置文件里面去,可是这种作法通常都放在相似FTP的项目上。由于若是是指定的目录脱离了 webapi 项目 wwwroot ,甚至是 wwwroot 下的文件夹都不能够访问到静态页面的。
三、使用MVC并配置路由,开启了静态文件的访问以后,就交由mvc来处理了,这个是webapi项目,因此配置api的路由就能够了。(除了上面的一、2顺序不能够改变以外,mvc中配置的路由所放置的顺序倒没影响,由于这不是一个mvc项目)
好了,先后端都开发好以后,部署到服务器,仅是上面在Startup的配置便可。.net core 仍是很是很是方便的。
正常访问!一点问题都没有,就算是有问题,也是代码的问题了,噢哈哈
这就是个人项目中的先后端在开发上分离的实践,讲得不深,随便拍!