在 JavaScript 中执行基于“根”的路径引用的任何智能方式，就像我们在 ASP.NET 中使用 ~/ 的方式一样？
【问题讨论】：
标签： javascript asp.net web-applications relative-path
ASP.NET MVC 应用程序解决方案
这在 VS 中使用 IIS 和 IIS Express 时有效。
在所有脚本加载之前放置这个 sn-p，以便让根 url 变量“approot”。
在脚本中为您服务：
<script>
var approot = "@Url.Content("~")";
</script>
--> other scripts go here or somewhere later in the page.
然后在您的脚本或页面脚本中使用它。 示例：
var sound_root_path = approot + "sound/";
var img_root_path = approot + "img/";
approot 变量可以是：
"/YourWebsiteName/"
或者只是：
"/"
【讨论】：
以下函数将计算当前运行的应用程序的根。当从应用程序树的某个深处调用时，我使用它来定位资源的绝对位置。
function AppRoot() {
//
// Returns the root of the currently running ASP application.
// in the form: "http://localhost/TRMS40/"
//
// origin: "http://localhost"
// pathname: "/TRMS40/Test/Test%20EMA.aspx"
//
// usage:
// window.open( AppRoot() + "CertPlan_Editor.aspx?ID=" + ID);
//
var z = window.location.pathname.split('/');
return window.location.origin + "/" + z[1] + "/";
}
【讨论】：
如果你想在 HTML 中使用它仍然可以使用~，看这个
href = @Url.Content("~/controllername/actionName")
查看我的 MVC 应用程序中的复选框单击事件
@Html.CheckBoxFor(m=>Model.IsChecked,
new {@onclick=@Url.Content("~/controller/action("+ @Model.Id + ", 1)"),
@title="Select To Renew" })
【讨论】：
另一个更简单、更通用的选择是采用以下方法：
<script src="/assets/js/bootstrap.min.js"><script>
并像这样使用 Page.ResolveClientUrl：
<script src='<%=ResolveClientUrl("~/assets/js/bootstrap.min.js")%>'></script>
那么无论在哪个子目录下，url 都将始终正确呈现。
【讨论】：
对于 ASP.net MVC Razor 页面，在 <Head> 标记中创建一个基本标记，如下所示
<base href="http://@Request.Url.Authority@Request.ApplicationPath" />
在所有相关的 javascript URL 中，请确保以不带斜杠 (/) 开头，否则它将从根目录引用。
例如。创建您的所有网址，例如
"riskInfo": { url: "Content/images/RiskInfo.png", id: "RI" },
或
$http.POST("Account/GetModelList", this, request, this.bindModelList);
【讨论】：
在 .NET 基本页面的 PreRender 中，添加以下内容：
protected override void
OnPreRender(EventArgs e) {
base.OnPreRender(e);
if (Page.Header != null)
{
//USED TO RESOLVE URL IN JAVASCRIPT
string baseUrl = String.Format("var baseUrl='{0}';\n",
HttpContext.Current.Request.ApplicationPath);
Page.Header.Controls.Add(new LiteralControl(String.Format(Consts.JS_TAG,
baseUrl)));
}
}
然后在你的全局 JavaScript 函数中，添加以下内容：
function resolveUrl(url) {
if (url.indexOf("~/") == 0) {
url = baseUrl + url.substring(2);
}
return url; }
现在你可以像这样使用它了：
document.getElementById('someimage').src = resolveUrl('~/images/protest.jpg');
对于某些项目来说可能有点多，但对于成熟的应用程序来说效果很好。
【讨论】：
可以改进 Kamarey 的答案以支持动态基本路径：
<head>
<base href="http://<%= Request.Url.Authority + Request.ApplicationPath%>/" />
</head>
无论部署配置如何，这都将确保正确的根路径。
公平地说，这并没有回答最初的问题，但它消除了从 javascript 获取根路径的大多数需求。只需在任何地方使用相对 URL，而不用斜杠作为前缀。
如果您仍需要从 javascript 访问它，添加一个 id 属性并按照 MiffTheFox 的建议使用 document.getElementFromId() - 但在基本标签上。
【讨论】：
<base href="http://@((Request.Url.Authority + Request.ApplicationPath).TrimEnd('/'))/" /> ApplicationPath 有时以“/”结尾，有时不是，所以我添加了 TrimEnd('/') 调用。
您也可以使用 asp.net 功能VirtualPathUtility：
<script>
var basePath = '<%=VirtualPathUtility.ToAbsolutePath("~/")%>';
</script>
注意：我没有将路径编码为JSON-string（转义引号、控制字符等）。我认为这没什么大不了的（例如，URL 中不允许未转义的引号），但人们永远不知道...
【讨论】：
使用base标签：
<head>
<base href="http://www.example.com/myapp/" />
</head>
...
从现在开始，此页面上使用的任何链接，无论是在 javascript 还是 html 中，都将相对于基本标记，即“http://www.example.com/myapp/”。
【讨论】：
让您的页面生成一个类似以下内容的标签：
<link rel="home" id="ApplicationRoot" href="http://www.example.com/appRoot/" />
然后，在 JavaScript 中有一个函数来提取值，例如：
function getHome(){
return document.getElementById("ApplicationRoot").href;
}
【讨论】：
我通常在 js 文件的顶部创建一个变量，并为其分配根路径。然后我在引用文件时使用该变量。
var rootPath = "/";
image.src = rootPath + "images/something.png";
【讨论】：
~/ 是应用程序根而不是字面根，它解释 ~/ 表示 <YourAppVirtualDir>/
要在 JavaScript 中做一个字面根，它只是 /，即“/root.html”。无法在 JavaScript 中获得类似的应用程序级路径。
您可以在 ASPX 文件中破解它并将其输出到标签中，但我会考虑这样做的安全隐患。
【讨论】：
can 把它带到客户端，但我个人不会:)