我们来看看使用ASP.NET Core可以快速创建一个基本网站。如果您是ASP.NET Core新手或想要复习,请继续阅读以获取更多信息!
最近,我想做概念的非常快的证明,关于使用 setInterval 与 setTimeout 读取后 setTimeout 是可借鉴,如果你是非常迅速调用同一个功能。我想我会记录我从文件 - >新项目到POC运行的旅程,以便下次我不必重新查找各个部分。
文件 - >新项目如果您创建一个全新的ASP.NET Core 2.1项目,选择空项目,然后运行生成的代码,您将看到:
这是由Startup.cs文件中的一行生成的 :
app.Run(async (context) =>
{
await context.Response.WriteAsync("Hello World!");
});
这里的目标是使空白应用程序尽可能快地为HTML页面提供一些附加的JavaScript。在这里,我有三个步骤。
第1步:创建HTML文件应用程序只能从wwwroot文件夹中提供静态文件(HTML被视为静态文件)。此文件夹的内部结构无关紧要,但这是您的文件必须到达的位置:
该文件的内容如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<p>test</p>
</body>
</html>
这实际上不会做任何事情,因为,默认情况下,ASP.NET Core不提供静态文件,也不知道命名“索引”的巨大意义。
第2步:配置ASP.NETStartup.cs是所有魔法发生的地方; 这就是开箱即用的样子:
public Startup
{
// This method gets called by the runtime. Use this method to add services to the container.
// For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
public void ConfigureServices(IServiceCollection services)
{
}
// This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
app.Run(async (context) =>
{
await context.Response.WriteAsync("Hello World!");
});
}
}
`context.Response.WriteAsync`去了,我们告诉ASP.NET Core提供静态文件,调用`UseDefaultFiles`意味着它将搜索Index或Default文件。值得指出的是这些事项的顺序:
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
}
app.UseDefaultFiles();
app.UseStaticFiles();
}
现在它加载Index.html文件。所以,从技术上讲,它只有两个步骤 - 尽管我们还没有引用任何JavaScript。
第3步:添加JavaScript ......让我们做一些时髦的东西更改HTML以为段落提供ID和绝对位置。另外,引用文件site.js:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="site.js"></script>
</head>
<body>
<p id="testElement" style="position:absolute">test</p>
</body>
</html>
显然,如果不添加site.js,就不会发生任何事情(它也需要在wwwroot中):
该新文件的JavaScript代码位于:
var divxPos = 0;
window.onload = function () {
runCode();
};
function runCode() {
var test = document.getElementById("testElement");
test.style.left = divxPos++ + 'px';
setTimeout(() => runCode(), 50);
};
如果你运行它,你会发现文本自行运动!