如何使用 javascript 获取 MVC 应用程序的基本 URL

Posted 2023-02-22

【中文标题】如何使用 javascript 获取 MVC 应用程序的基本 URL

【英文标题】：How to get base URL of an MVC application using javascript

【发布时间】：2013-05-17 10:05:37

【问题描述】：

如何使用 javascript 获取基本 URL？

例如，当我从 Visual Studio 浏览我的网站时，如果我的 URL 是 http://localhost:20201/home/index，我希望得到 http://localhost:20201

如果我在 IIS 上托管我的网站，并且我的虚拟目录名称是 MyApp 并且 URL 是 http://localhost/MyApp/home/index，我希望得到 http://localhost/MyApp

我尝试使用location.protocol + location.hostname（和location.host），当我通过visual studio浏览我的网站时它们工作正常，但是当我将它托管在IIS上时，我得到http://localhost，/MyApp 是被截断了。

【问题讨论】：

你要的是Javascript，对吧？这和 ASP.NET，是 MVC 框架还是 IIS 有什么关系？

因为我的网站是使用 asp.net mvc 构建的，并且它托管在具有虚拟目录名称的 IIS 上

【参考方案1】：

您应该避免在 JavaScript 中进行此类检测，而是从 .NET 代码中传递值。你总是会遇到像 http://server/MyApp/MyApp/action 这样的 URL 的问题，你不知道哪个是控制器的名称，哪个是应用程序的路径。

在您的 Layout.cshtml 文件（或您需要的任何地方）中添加以下代码：

<script type="text/javascript">
    window.applicationBaseUrl = @Html.Raw(HttpUtility.JavaScriptStringEncode(Url.Content("~/"), true));
    alert(window.applicationBaseUrl + "asd.html");

    // if you need to include host and port in the url, use this:
    window.applicationBaseUrl = @Html.Raw(HttpUtility.JavaScriptStringEncode(
        new Uri(
                   new Uri(this.Context.Request.Url.GetLeftPart(UriPartial.Authority)),
                   Url.Content("~/")
               ).ToString(), true));
    alert(window.applicationBaseUrl + "asd.html");
</script>

需要new Uri() 部分，以便始终正确组合 URL（无需手动检查每个部分是否以 / 符号开头或结尾）。

【讨论】：

如果需要绝对路径（包括主机和端口，请看我更新的答案）

在托管的 IIS 应用程序上试过这个，它显示 http://localhost 没有 /MyApp。我不想硬编码“/MyApp”部分

对我有用 :) .NET 代码中 Url.Content("~/asd.html") 的输出是什么？ Url.Content() 是解析/MyApp 部分的内置方法。

此解决方案基于它在 Razor 视图中运行的假设 回复：@Html.Raw() 函数。如果将此代码放在 Razor 视图之外，它将不再起作用。

【参考方案2】：

如果您使用的是.NET Core，您可以在全局范围内设置一个JavaScript变量的url（例如在Layout.cshtml文件中，该文件位于Views/Shared文件夹中）：

 <script type="text/javascript">
    var url = '@string.Format("0://12", Context.Request.Scheme, Context.Request.Host.Value , Url.Content("~/"))';
</script>

从带有插值的 C# 6 版本开始：

<script type="text/javascript">
    var url = '@($"Context.Request.Scheme://Context.Request.Host.ValueUrl.Content("~/")")';
</script>

【参考方案3】：

var url = window.location.href.split('/');
var baseUrl = url[0] + '//' + url[2];

【讨论】：

其实这个好一点：***.com/a/11775016/1431728.

【参考方案4】：

试试下面的代码。

function getBaseURL() 
    var url = location.href;  // entire url including querystring - also: window.location.href;
    var baseURL = url.substring(0, url.indexOf('/', 14));


    if (baseURL.indexOf('http://localhost') != -1) 
        // Base Url for localhost
        var url = location.href;  // window.location.href;
        var pathname = location.pathname;  // window.location.pathname;
        var index1 = url.indexOf(pathname);
        var index2 = url.indexOf("/", index1 + 1);
        var baseLocalUrl = url.substr(0, index2);

        return baseLocalUrl + "/";
    
    else 
        // Root Url for domain name
        return baseURL + "/";
    





document.write(getBaseURL());

谢谢，

湿婆

【讨论】：

这是否只固定在本地主机上？如果已部署，人们将通过 IP 地址访问应用程序

【参考方案5】：

我认为这是不可能的，因为 JavaScript（客户端）对您的部署（MyApp）一无所知，并将其视为路径信息的一部分（就像 /home/index 一样）。作为一种解决方法，您可以尝试根据域或端口来解释路径信息（location.pathname）。

但是您可以在包含路径（路径由服务器生成并放入变量中）的全局范围（或​​任何适合您的范围）中设置 JavaScript 变量。

这在您的 html-Head 中可能看起来像这样：

<script type="text/javascript">
    var global_baseurl = '<insert server side code that gets the path depending on your server side programming language>';
</script>

【参考方案6】：

我认为一个干净的解决方案会像

将基本 URL 放在 _layout Html 中

<div id="BaseUrl" data-baseurl="@Context.Request.Url.GetLeftPart(UriPartial.Authority)@Url.Content("~/")"></div>    

Context.Request.Url.GetLeftPart(UriPartial.Authority) 会给你在

本地http://localhost:20201 从 IIS 会给你http://localhost

Url.Content("~/") 在本地将为空，但在 IIS 中将为您提供应用名称，在您的情况下为 MyApp

然后从Js：

var baseUrl = $("#BaseUrl").data("baseurl");

比你可以使用它喜欢：

$.getJSON(baseUrl + "/Home/GetSomething", function (data) 
      //Do something with the data
);

https://msdn.microsoft.com/en-us/library/system.uri.getleftpart(v=vs.110).aspx http://api.jquery.com/data/

【参考方案7】：

您可以在页面的 head 标记中设置基本 url。所有链接/hrefs 都将使用它来调用relatieve hrefs。

@ var baseHref = new System.UriBuilder(Request.Url.AbsoluteUri)  Path = Url.Content("~/") ; 
<base href="@baseHref" />

解释：

Url.Content("~/") 返回相对路径（本例中是服务器上的 MyApp） new System.UriBuilder(Request.Url.AbsoluteUri) 创建一个包含端口和协议信息的 UriBuilder

【参考方案8】：

var base_url = "@Request.Url.GetLeftPart(UriPartial.Authority)@Url.Content("~/")"

在布局文件中定义它并附加base_url。这对我有用。