.NET Core WebApi 前后端开发分离后的配置和部署

转自博客:https://www.cnblogs.com/Vam8023/p/10670741.html

背景:现在越来越多的企业都采用了在开发上前后端分离,前后端开发上的分离有很多种,那么今天,我来分享一下项目中得的前后端分离。

B/S Saas 项目:(这个项目可以理解成个人中心,当然不止这么点功能)

前端:node.js + vue

后端:.NET Core WebApi

前端安装 node.js 跟创建vue项目这些不是这篇文章的重点,重点在于项目完成后的部署。

.NET Core WebApi创建后,默认就创建了一个wwwroot的文件夹,这个文件夹是用来放置静态文件的,所以,我们可以理解成,这个文件夹将放置我们的build好的前端项目。

OK,到现在来讲,有一个很有意思的发现(也可以是一点意思都没有,因为都是同一个爸生的),这项目的部署跟mvc的部署的很像(这里不涉及底层运行,只是一个发布后简单的像而已)。

由上图就足够清晰了,这样的部署是属于开发上的前后端分离,他们同属于一个站点,绑定同一个域名,所以不涉及跨域,外部不能直接调用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?}");
});

1、首先是设置主页

这里直接使用的是默认的,就是 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,其实个人认为仅仅是为了保险,因为

2、开启静态文件,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 下的文件夹都不可以访问到静态页面的。

3、使用MVC并配置路由,开启了静态文件的访问之后,就交由mvc来处理了,这个是webapi项目,所以配置api的路由就可以了。(除了上面的1、2顺序不可以改变之外,mvc中配置的路由所放置的顺序倒没影响,因为这不是一个mvc项目)

好了,前后端都开发好之后,部署到服务器,仅是上面在Startup的配置即可。.net core 还是非常非常方便的。

正常访问!一点问题都没有,就算是有问题,也是代码的问题了,噢哈哈

这就是我的项目中的前后端在开发上分离的实践,讲得不深,随便拍!

原文地址:https://www.cnblogs.com/cxt618/p/10683445.html

时间: 2024-10-11 16:23:43

.NET Core WebApi 前后端开发分离后的配置和部署的相关文章

.net core实现前后端彻底分离

问题的关键在跨域 1.我们在services里面 添加跨域内容如下: public void ConfigureServices(IServiceCollection services) { //这个AddOcelot方法是Ocelot包给IServiceCollection扩展的方法 services.AddOcelot(configuration).AddConsul(); #region CORS services.AddCors(c => { //↓↓↓↓↓↓↓注意正式环境不要使用这种全

ASP.NET Core模块化前后端分离快速开发框架介绍之4、模块化实现思路

源码 GitHub:https://github.com/iamoldli/NetModular 演示地址 地址:http://129.211.40.240:6220 账户:admin 密码:admin 前端框架演示地址(临时) 地址:http://progqx5cu.bkt.clouddn.com/skins/index.html#/ 账户:admin 密码:admin 目录 1.开篇 2.快速创建一个业务模块 3.数据访问模块介绍 4.模块化实现思路 获取官方源码 为了方便查看源码,我们先获

从一张图开始,谈一谈.NET Core和前后端技术的演进之路

从一张图开始,谈一谈.NET Core和前后端技术的演进之路 邹溪源,李文强,来自长沙.NET技术社区 一张图 2019年3月10日,在长沙.NET 技术社区组织的技术沙龙<.NET Core和前后端分离那些事儿>上,我们曾经试图通过一系列抽丝剥茧的过程来引导大家在这条基于.NET Core的前后端分离有关的技术路线上持续发散,由于各种原因未能成功,因此,技术社区执行主席,李文强同学整理了一张图,并由溪源以专刊的形式来描述他所认为的技术演进之路.  这张图涉及到的知识点,涵盖了目前前后端技术近

vue发布中的前后端分离和前后端不分离

前后端分离 思路:前端和后台完全分离.前端提供静态的css和js,在运行时将css和js给后端,后端进行数据的请求(ajax) 前后端分离就是前端和后台在不同的服务器上.基本是前端一个nginx加css和js 后端nginx加index.html 当用户访问的时候,访问后端nginx的网址,执行后端的index.html,在运行到资源时,访问前端的nginx返回的css,js等 前后端不分离 思路:前端和后台不分离.前端是源代码build后的代码 后端进行数据的请求(ajax) 前后端不分离就是

前后端分离与前后端不分离

前后端不分离 在前后端不分离的应用模式中,前端页面看到的效果都是由后端控制,由后端渲染页面或重定向,也就是后端需要控制前端的展示,前端与后端的耦合度很高. 这种应用模式比较适合纯网页应用,但是当后端对接App时,App可能并不需要后端返回一个HTML网页,而仅仅是数据本身,所以后端原本返回网页的接口不再适用于前端App应用,为了对接App后端还需再开发一套接口. 请求的数据交互如下图: 前后端分离 在前后端分离的应用模式中,后端仅返回前端所需的数据,不再渲染HTML页面,不再控制前端的效果.至于

ABP开发框架前后端开发系列---(11)菜单的动态管理

在前面随笔<ABP开发框架前后端开发系列---(9)ABP框架的权限控制管理>中介绍了基于ABP框架服务构建的Winform客户端,客户端通过Web API调用的方式进行获取数据,从而实现了对组织机构.角色.用户.权限等管理,其中没有涉及菜单部分,本篇随笔介绍在ABP框架中实现菜单的管理,菜单是作为Winform或者Web动态构建界面的一个重要元素,同时也是作为角色权限控制的部分资源. 1.菜单的列表展示和管理 一般情况下,菜单的树形列表的显示可以分为多个节点,节点可以收缩也可以展开,当然节点

ABP开发框架前后端开发系列---(12)配置模块的管理

一般来说,一个系统或多或少都会涉及到一些系统参数或者用户信息的配置,而ABP框架也提供了一套配置信息的管理模块,ABP框架的配置信息,必须提前定义好配置的各项内容,然后才能在系统中初始化或者通过接口查询来使用,本篇随笔引入了另外一种配置信息的定义,实现更加简化的处理,本篇随笔着重介绍两者之间的差异和不同的地方. 1.ABP框架的配置管理 如下面是邮件配置信息,配置信息一般先继承自SettingProvider,初始化定义后,才能被系统所使用. EmailSettingProvider:继承自Se

前后端分离与前后端不分离的区别

前后端不分离 在前后端不分离的应用模式中,前端页面看到的效果都是由后端控制,由后端渲染页面或重定向,也就是后端需要控制前端的展示,前端与后端的耦合度很高. 这种应用模式比较适合纯网页应用,但是当后端对接App时,App可能并不需要后端返回一个HTML网页,而仅仅是数据本身,所以后端原本返回网页的接口不再适用于前端App应用,为了对接App后端还需再开发一套接口. 请求的数据交互如下图: 前后端分离 在前后端分离的应用模式中,后端仅返回前端所需的数据,不再渲染HTML页面,不再控制前端的效果.至于

【转载】java前后端 动静分离,JavaWeb项目为什么我们要放弃jsp?

原文:http://blog.csdn.net/piantoutongyang/article/details/50878214 今天看到两篇文章,讲解 为什么web开发启用jsp,确实挺有道理,整理如下: 使用jsp的痛点: 1.jsp上动态资源和静态资源全部耦合在一起,服务器压力大,因为服务器会收到各种静态资源的http请求,动态代码的等等,除非你使用nginx. 万一你的java代码出现了bug,你的页面是显示不出来的,直接蹦到了5xx页面,用户体验极差. (现在javaWeb项目业界的标