在 wwwroot 中引用静态 JavaScript 文件的问题 - .Net Core 2.2 Signalr

Posted 2023-04-12

【中文标题】在 wwwroot 中引用静态 JavaScript 文件的问题 - .Net Core 2.2 Signalr

【英文标题】：Problems referencing static JavaScript files in wwwroot - .Net Core 2.2 Signalr

【发布时间】：2020-01-19 02:13:00

【问题描述】：

我很难从wwwroot 文件夹中引用signalr 的相关js 文件。

我需要参考的路径是：

wwwroot/lib/@aspnet/signalr/dist/browser/signalr.js wwwroot/js/chat.js

这是我的看法：

@page
<div class="container">
    <div class="row">&nbsp;</div>
    <div class="row">
        <div class="col-6">&nbsp;</div>
        <div class="col-6">
            User..........<input type="text" id="userInput" />
            <br />
            Message...<input type="text" id="messageInput" />
            <input type="button" id="sendButton" value="Send Message" />
        </div>
    </div>
    <div class="row">
        <div class="col-12">
            <hr />
        </div>
    </div>
    <div class="row">
        <div class="col-6">&nbsp;</div>
        <div class="col-6">
            <ul id="messagesList"></ul>
        </div>
    </div>
</div>

<script src="~/wwwroot/lib/@@AspNetCore/signalr/dist/browser/signalr.js"></script>
<script src="~/wwwroot/js/chat.js"></script>

我在浏览器中收到 404：

http://localhost:5005/wwwroot/lib/@AspNetCore/signalr/dist/browser/signalr.js 404（未找到）

http://localhost:5005/wwwroot/js/chat.jsnet::ERR_ABORTED 404（不是 找到）

更新

更改脚本路径后，我在浏览器中遇到以下错误：

http://localhost:5005/lib/@AspNetCore/signalr/dist/browser/signalr.jsnet::ERR_ABORTED 404（未找到）

未捕获的 ReferenceError：未在 chat.js:3 中定义 signalR

chat.js第3行：

var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();

下面有红色的波浪线。

【问题讨论】：

您实际上并未在 URL 中包含 wwwroot 部分。这会动态映射到文档根目录。

啊，我确实想知道为什么不需要它。谢谢:-)

【参考方案1】：

我建议您更改文件夹名称并替换这样的 url

<script src="~/lib/signalr/dist/browser/signalr.js"></script>
<script src="~/js/chat.js"></script>

查看此链接too

注意：确保您的代码位于页面底部

【讨论】：

啊，不，那个代码去哪儿了？当您说更改文件夹名称时，您的意思是进入 Windows 资源管理器并更改文件夹结构，即删除 @Aspnetcore 文件夹？

是的。将您的信号器库代码放入signalr 文件夹。我从不从具有此类特殊字符的文件夹中引用脚本

好的，但是import 代码去哪里了？

谢谢，是的，这正是我一直在关注的教程，但我无法让它工作，或者看看你之前的 import 声明去了哪里。我不明白我错过了什么。

我认为您不需要导入，因为您只是使用 js 而不是 es6 代码。你现在有什么错误？

【参考方案2】：

第一，你应该确保你的应用程序（红隼服务器）支持静态文件（startup.cs中的Configurate方法中的app.UseStaticFiles()），并确保Microsoft.AspNetCore.Hosting.IHostingEnvironment.WebRoot是你磁盘中的一个文件夹（通常它指向$"Dictory.GetCurrentDirectory()/wwwroot/"）。

2st，确保你的signalr.js在WebRoot文件夹中（所以它可以被服务），并注意wwwroot文件夹是你的根路径，例如~/，这意味着你的js文件在@ 987654328@razor 的 script Tag Helper 的正确路径是 <script src="~/lib/signalr/signalr.js"></script>。

【参考方案3】：

<script src="~/wwwroot/lib/@@AspNetCore/signalr/dist/browser/signalr.js"></script>
<script src="~/wwwroot/js/chat.js"></script>

用这个替换

@section Scripts 
    <script src="~/lib/@@AspNetCore/signalr/dist/browser/signalr.js"></script>
    <script src="~/js/chat.js"></script>

【讨论】：

感谢您的回答，我替换了它们，但我仍然得到 404 `localhost:5005/lib/@AspNetCore/signalr/dist/browser/signalr.js net::ERR_ABORTED 404 (Not Found)` 然后是未捕获的 ReferenceError signalR is not defined chat.js:3这行代码：var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();

如果你在视图文件中写入。尝试将脚本包装到部分中。上面的编辑答案

一旦我得到它的工作，我会把脚本贴在_SiteMaster.cshtml的底部