在本快速入门中,我们将了解一个最小的 ASP.NET Core 应用程序,该应用程序承载 Elsa Dashboard 组件并将其连接到 Elsa Server。

ElsaDashboard + Docker

尽管能够设置您自己的 Elsa Dashboard 项目以自定义某些方面很有用,但在许多情况下,您可能会发现基本仪表板是连接到 Elsa 服务器所需要的。

Elsa 附带了一个名为 ElsaDashboard.Web 的预制项目,您可以将其配置为与现有的 Elsa 服务器通信。此外,您还可以构建和运行一个 Dockerfile。

有关更多信息,请查看 ElsaDashboard + Docker 快速入门。

我们会:

  • 创建 ASP.NET Core 应用程序。
  • 安装 Elsa Dashboard 组件。

项目

创建一个名为 ElsaQuickstarts.Server.Dashboard 的新的空 ASP.NET Core 项目:

dotnet new web -n "ElsaQuickstarts.Server.Dashboard"

CD 到创建的项目文件夹中:

cd ElsaQuickstarts.Server.Dashboard

添加以下包:

dotnet add package Elsa.Designer.Components.Web

Startup

打开 Startup.cs 并将其内容替换为以下内容:

using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.Extensions.DependencyInjection; namespace ElsaQuickstarts.Server.Dashboard
{
public class Startup
{
public void ConfigureServices(IServiceCollection services)
{
services.AddRazorPages();
} public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
app.UseStaticFiles();
app.UseRouting();
app.UseEndpoints(endpoints => { endpoints.MapFallbackToPage("/_Host"); });
}
}
}

_Host.cshtml + _ViewImports.cshtml

请注意,该应用程序将始终提供 _Host.cshtml 页面,我们接下来将创建该页面。

  1. 创建一个名为 Pages 的新文件夹。
  2. 在 Pages 中,创建一个名为cshtml 的新文件。
  3. 在 Pages 中,创建一个名为cshtml 的新文件。

将以下内容添加到 _ViewImports.cshtml:

@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

并将以下内容添加到_Host.cshtml:

@page "/"
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Elsa Workflows</title>
<link rel="icon" type="image/png" sizes="32x32" href="/_content/Elsa.Designer.Components.Web/elsa-workflows-studio/assets/images/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/_content/Elsa.Designer.Components.Web/elsa-workflows-studio/assets/images/favicon-16x16.png">
<link rel="stylesheet" href="/_content/Elsa.Designer.Components.Web/elsa-workflows-studio/assets/fonts/inter/inter.css">
<link rel="stylesheet" href="/_content/Elsa.Designer.Components.Web/elsa-workflows-studio/elsa-workflows-studio.css">
<script src="/_content/Elsa.Designer.Components.Web/monaco-editor/min/vs/loader.js"></script>
<script type="module" src="/_content/Elsa.Designer.Components.Web/elsa-workflows-studio/elsa-workflows-studio.esm.js"></script>
</head>
<body>
<elsa-studio-root server-url="https://your-elsa-server-url" monaco-lib-path="_content/Elsa.Designer.Components.Web/monaco-editor/min">
<elsa-studio-dashboard></elsa-studio-dashboard>
</elsa-studio-root>
</body>
</html>

运行

运行程序并打开 Web 浏览器到主页(如果您不更改 launchSettings.json,通常会自动发生):

在您确保将组件指向正在运行的 Elsa 服务器之前,所有菜单项都不会正常工作。

elsa-core:4.ASP.NET Core Server with Elsa Dashboard的更多相关文章

  1. .NET Core:在ASP.NET Core WebApi中使用Cookie

    一.Cookie的作用 Cookie通常用来存储有关用户信息的一条数据,可以用来标识登录用户,Cookie存储在客户端的浏览器上.在大多数浏览器中,每个Cookie都存储为一个小文件.Cookie表示 ...

  2. NET Core:部署项目到Ubuntu Server

    NET Core:部署项目到Ubuntu Server 概述 基于上一篇成功安装Ubuntu Server 16.10的基础上,接下来继续我们ASP.NET Core项目的部署之旅! 只是对于这些年整 ...

  3. 探索ASP.Net Core 3.0系列四:在ASP.NET Core 3.0的应用中启动时运行异步任务

    前言:在本文中,我将介绍ASP.NET Core 3.0 WebHost的微小更改如何使使用IHostedService在应用程序启动时更轻松地运行异步任务. 翻译 :Andrew Lock   ht ...

  4. List多个字段标识过滤 IIS发布.net core mvc web站点 ASP.NET Core 实战:构建带有版本控制的 API 接口 ASP.NET Core 实战:使用 ASP.NET Core Web API 和 Vue.js 搭建前后端分离项目 Using AutoFac

    List多个字段标识过滤 class Program{  public static void Main(string[] args) { List<T> list = new List& ...

  5. ASP.NET Core-Docs:在 ASP.NET Core 中启用跨域请求(CORS)

    ylbtech-ASP.NET Core-Docs:在 ASP.NET Core 中启用跨域请求(CORS) 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部 1. ...

  6. 探索ASP.Net Core 3.0系列二:聊聊ASP.Net Core 3.0 中的Startup.cs

    原文:探索ASP.Net Core 3.0系列二:聊聊ASP.Net Core 3.0 中的Startup.cs 前言:.NET Core 3.0 SDK包含比以前版本更多的现成模板. 在本文中,我将 ...

  7. 任务21 :了解ASP.NET Core 依赖注入,看这篇就够了

    DI在.NET Core里面被提到了一个非常重要的位置, 这篇文章主要再给大家普及一下关于依赖注入的概念,身边有工作六七年的同事还个东西搞不清楚.另外再介绍一下.NET  Core的DI实现以及对实例 ...

  8. ASP.NET Core Identity 配置 - ASP.NET Core 基础教程 - 简单教程,简单编程

    原文:ASP.NET Core Identity 配置 - ASP.NET Core 基础教程 - 简单教程,简单编程 ASP.NET Core Identity 配置 上一章节我们简单介绍了下 Id ...

  9. ASP.NET Core Identity 框架 - ASP.NET Core 基础教程 - 简单教程,简单编程

    原文:ASP.NET Core Identity 框架 - ASP.NET Core 基础教程 - 简单教程,简单编程 ASP.NET Core Identity 框架 前面我们使用了 N 多个章节, ...

随机推荐

  1. 【Azure 应用服务】App Service 通过配置web.config来添加请求返回的响应头(Response Header)

    问题描述 在Azure App Service上部署了站点,想要在网站的响应头中加一个字段(Cache-Control),并设置为固定值(Cache-Control:no-store) 效果类似于本地 ...

  2. WCF简单Demo

    WCF,光看书的原理,稍微有点枯燥,通过自己动手,会更容易理解契约声明,面向服务,分布式等概念. 1.创建WCF服务. 2.WcfService1.CS中声明新的契约. namespace WcfSe ...

  3. 教你如何使用FusionInsight SqoopShell

    摘要:Sqoop-shell是一个Loader的shell工具,其所有功能都是通过执行脚本"sqoop2-shell"来实现的. 本文分享自华为云社区<FusionInsig ...

  4. PCE | 华中农大郭亮团队蛋白质组学揭示油菜内源氧化还原修饰介导盐胁迫响应

    蛋白质翻译后修饰(PTM)在控制植物生长发育以及逆境适应方面发挥着重要的作用.发生在半胱氨酸巯基的亚磺酰化修饰(R-SOH)是一种可逆的氧化修饰类型,可以通过与其他修饰形态形成二硫键的形式来保护蛋白不 ...

  5. CTF中的序列化与反序列化

    记一些CTF出现的序列化与反序列化的知识点和题目. 序列化和反序列化的概念 序列化就是将对象转换成字符串.字符串包括 属性名 属性值 属性类型和该对象对应的类名. 反序列化则相反将字符串重新恢复成对象 ...

  6. 腾讯云TDSQL PostgreSQL版 -最佳实践 |优化 SQL 语句

    查看是否为分布键查询 postgres=# explain select * from tbase_1 where f1=1; QUERY PLAN ------------------------- ...

  7. Java_classpath

    Java_classpath 什么是classpath? classpath是JVM用到的一个环境变量,它用来指示JVM如何搜索class. 因为Java是编译型语言,源码文件是.java,而编译后的 ...

  8. 算法竞赛中的常用JAVA API :HashMap 和 TreeMap(转载)

    算法竞赛中的常用JAVA API :HashMap 和 TreeMap 摘要 本文主要介绍Map接口下的HashMap和TreeMap. HashMap HashMap是基于哈希表的 Map 接口的实 ...

  9. 关于Feign、Jackson、RabbitMQ、Jrebel插件的开发中遇到的问题

    在工作实际开发中需要开发一个消息模块对外提供统一的接口feign调用提供消息加载到MQ队列的服务,采用泛型的形式. 刚开始搭建好之后,正好需要做一个全局的日志添加到zuul网关中,通过网关feign ...

  10. JavaScript学习05(操作DOM)

    操作DOM DOM(文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model). HTML DOM 模型被结构化为对象树: 通过这个对象模型,Java ...