当文件位于 wwwroot 之外时,静态文件不会 found/served 到 SPA
Static files are not found/served to a SPA when files are outside the wwwroot
我创建了一个 asp.net 具有多个区域的核心 1.0 网站项目。
在应用程序区域的 HomeController 中,我有这个操作:
public IActionResult Index()
{
string content = System.IO.File.ReadAllText("./Areas/Application/App/Index.html");
return base.Content(content, new MediaTypeHeaderValue("text/html"));
}
当返回 html 文件时,我的浏览器出现许多 404 错误,原因是未找到 javascript 库文件。
index.html 及其所有 .js 文件是 asp.net 核心网站区域中的 SPA。
此 SPA 已构建并部署到 websiteproject/areas/application/App 文件夹。
当我构建并部署 SPA 到 wwwroot 文件夹时,所有静态文件 都找到了。
我想这意味着静态文件路径总是相对于 wwwroot 以使 SPA 工作。
问题 1:有什么方法可以通过以下方式将 wwwroot 文件夹配置为 wwwroot/app WebHostBuilder class 路径:
.UseWebRoot("./wwwroot/app")
只是和显式对于应用领域?
这意味着网站的 wwwroot 应该继续工作?
我能做到的最好的事情是一个包含 2 个子文件夹的 wwwroot 文件夹:
- 网站
- 应用程序
我想为默认 'area' 和显式应用程序区域配置 2 wwwroot 的路径网站和应用程序。
问题 2:我该怎么做?
更新 1
根据 Pawel 的评论,我更改了:
app.UseStaticFiles();
到:
app.UseStaticFiles();
app.UseStaticFiles(new StaticFileOptions()
{
FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "Areas","Application", "App")),
RequestPath = new PathString("/Application")
});
但对于 .js 文件,我仍然收到相同的 404 错误,就好像它们在 wwwroot 目录中不可用一样???
404
在单页应用请求的开发者控制台工具中:
http://localhost:52159/vendor/reflect-metadata/Reflect.js (404)
200
在浏览器中手动输入url栏:
http://localhost:52159/Application/vendor/reflect-metadata/Reflect.js
这是否意味着在 asp.net 核心中提供的静态文件可以正常工作,但还有其他一些无法正常工作的内容?我想我不应该在 SPA 中更改一些愚蠢的东西...
我添加了我的文件结构的屏幕截图,你们可以更好地理解我的问题或者找到我的用户错误...:[=18=]
现在我找到了必须应用更改的解决方案。
system.config.ts
System.config({
map: {
'@angular': 'Application/vendor/@angular',
'rxjs': 'Application/vendor/rxjs',
'main': 'Application/main.js',
'app': 'Application/app',
},
packages: cliSystemConfigPackages
});
这样所有 angular 2/rxjs 文件都从目录路径提供:
"Area/Application/App" 当输入 url "/Application" 时。
我还必须在主桶和根桶 'app' 前添加 'Application'。
index.html
<body>
<app-root>Loading...</app-root>
{{#each scripts.polyfills}}
<script src="Application/{{.}}"></script>
{{/each}}
<script>
System.import('Application/system-config.js').then(function () {
System.import('Application/main.js');
}).catch(console.error.bind(console));
</script>
</body>
</html>
这些是 index.html 文件中的更改。
现在我的 Asp.net 核心区域 'Application' 有自己的 "wwwroot" 与 public 网站的 wwwroot 分开。
我创建了一个 asp.net 具有多个区域的核心 1.0 网站项目。
在应用程序区域的 HomeController 中,我有这个操作:
public IActionResult Index()
{
string content = System.IO.File.ReadAllText("./Areas/Application/App/Index.html");
return base.Content(content, new MediaTypeHeaderValue("text/html"));
}
当返回 html 文件时,我的浏览器出现许多 404 错误,原因是未找到 javascript 库文件。
index.html 及其所有 .js 文件是 asp.net 核心网站区域中的 SPA。
此 SPA 已构建并部署到 websiteproject/areas/application/App 文件夹。
当我构建并部署 SPA 到 wwwroot 文件夹时,所有静态文件 都找到了。
我想这意味着静态文件路径总是相对于 wwwroot 以使 SPA 工作。
问题 1:有什么方法可以通过以下方式将 wwwroot 文件夹配置为 wwwroot/app WebHostBuilder class 路径:
.UseWebRoot("./wwwroot/app")
只是和显式对于应用领域?
这意味着网站的 wwwroot 应该继续工作?
我能做到的最好的事情是一个包含 2 个子文件夹的 wwwroot 文件夹:
- 网站
- 应用程序
我想为默认 'area' 和显式应用程序区域配置 2 wwwroot 的路径网站和应用程序。
问题 2:我该怎么做?
更新 1
根据 Pawel 的评论,我更改了:
app.UseStaticFiles();
到:
app.UseStaticFiles();
app.UseStaticFiles(new StaticFileOptions()
{
FileProvider = new PhysicalFileProvider(Path.Combine(Directory.GetCurrentDirectory(), "Areas","Application", "App")),
RequestPath = new PathString("/Application")
});
但对于 .js 文件,我仍然收到相同的 404 错误,就好像它们在 wwwroot 目录中不可用一样???
404 在单页应用请求的开发者控制台工具中:
http://localhost:52159/vendor/reflect-metadata/Reflect.js (404)
200 在浏览器中手动输入url栏:
http://localhost:52159/Application/vendor/reflect-metadata/Reflect.js
这是否意味着在 asp.net 核心中提供的静态文件可以正常工作,但还有其他一些无法正常工作的内容?我想我不应该在 SPA 中更改一些愚蠢的东西...
我添加了我的文件结构的屏幕截图,你们可以更好地理解我的问题或者找到我的用户错误...:[=18=]
现在我找到了必须应用更改的解决方案。
system.config.ts
System.config({
map: {
'@angular': 'Application/vendor/@angular',
'rxjs': 'Application/vendor/rxjs',
'main': 'Application/main.js',
'app': 'Application/app',
},
packages: cliSystemConfigPackages
});
这样所有 angular 2/rxjs 文件都从目录路径提供:
"Area/Application/App" 当输入 url "/Application" 时。
我还必须在主桶和根桶 'app' 前添加 'Application'。
index.html
<body>
<app-root>Loading...</app-root>
{{#each scripts.polyfills}}
<script src="Application/{{.}}"></script>
{{/each}}
<script>
System.import('Application/system-config.js').then(function () {
System.import('Application/main.js');
}).catch(console.error.bind(console));
</script>
</body>
</html>
这些是 index.html 文件中的更改。
现在我的 Asp.net 核心区域 'Application' 有自己的 "wwwroot" 与 public 网站的 wwwroot 分开。