ASP.NET core Web应用部署之虚拟目录问题

jinxuliang2 发表于   2016/10/3 16:11:12,阅读次数: 440

本文集中介绍部署ASP.NET core Web应用到生产环境中需要注意的虚拟目录问题

当你开发完一个得意的Web应用,将其部署到真实生产环境中时,你会发现,你可能轻看了这个部署过程。

由于开发环境与运行环境的不同,在开发环境中运行得好好的Web应用,一上线之后就问题多多。

本文集中介绍一下ASP.NET core Web部署过程中需要注意的虚拟目录的问题

通常情况下,我们使用Visual Studio来开发ASP.NET core Web应用,总是假设此Web应用对应着网站的根目录(即“/”),但在实际开发中,你可能会将此Web应用部署到一个虚拟目录中,比如“/blog”,这样一来,以下JS代码就会有问题:

   

var app = angular.module("AuthorApp");

app.component('modifyAuthor', {
templateUrl: "/author/modifyAuthor.component.html",
    controllerAs: "model",
    controller: ['$state', '$stateParams','authorService', modifyAuthorCtl]
});

很明显,由于Web应用部署到“/book”路径之下,所以angular组件模板的真实路径应该是“/book/author/modifyAuthor.component.html”,这样一来,在开发环境中运行得好好的程序,在真实环境中就会引发HTTP 404响应。

对于.cshtml视图文件,如果你使用@Html.ActionLink()等方式生成链接,或者是使用“~”来引用静态资源,如:

  <script src="~/lib/jquery/dist/jquery.js"></script>

则不会存在问题,因为.cshtml要经过Razor引擎的解析,ASP.NET core还会对它进行相应处理,己经考虑到虚拟路径的问题。

麻烦的是手写的JS代码。比如上面例子中的AngularJS代码中的组件模板路径就是一个问题。

这里,我采用了一种不那么漂亮,但却实用的方法,利用了ASP.NET core的环境变量来实现类似于传统应用中的“条件编译”功能:

    <environment names="Staging,Production">
        <script>
           var rootVirtualPath = "/book";
        </script>
    </environment>
    <environment names="Development">
        <script>
           var rootVirtualPath = "";
        </script>
    </environment>

仔细看一下上面的代码,其实很简单,我定义了一个全局的rootVirtualPath变量,它的值依据运行时的环境变量而定。在开发阶段时为空,在部署到生产环境中时则为部署后的真实根路径。以后在写JS代码时,涉及路径的,都改写为以下这种样子:

var app = angular.module("AuthorApp");

app.component('modifyAuthor', {
    templateUrl: rootVirtualPath + "/author/modifyAuthor.component.html",
    controllerAs: "model",
    controller: ['$state', '$stateParams','authorService', modifyAuthorCtl]
});

另外还要注意一下HTML中的链接,其URL最好使用相对路径,比如使用"."和".."来指定,这样可以避免上述问题。


附件清单



评论于: