Question

所以，我有一个在我的机器localhost:XXXXX上运行的网络应用程序（其中XXXXX是一个端口号），但在生产中它运行在webappurl.com/portal。问题是，当我为JS文件使用相对路径时，它认为根URL只是/而不是/portal。

我有没有办法检查根路径，比如使用location.pathname，然后将其添加到我的每个JS文件路径的开头？

例如，拿这个

<script type="text/javascript" src="/Scripts/example.js"></script>

并将其更改为此

<script type="text/javascript" src="/portal/Scripts/example.js"></script>

我想远离硬编码根路径，主要是因为这不是最佳实践，还因为我的开发环境中的根路径不同，我不想不断改变路径和/或必须保持单独的文件。

Answer 1

虽然'base'元素似乎可能是答案，但问题是我们正在处理基础将根据部署环境移动的情况。一种解决方案是在发现环境后启动脚本加载。我在制作中使用了类似的方法：

<script>
  (function (){
    var
      // All the JS files we want to load
      script_list = [ 'foo.js', 'bar.js', 'bang.js' ],
      // Our JS directory
      script_base = '/js/', 
      doc_path    = document.location.pathname,
      base_list   = doc_path.split('/'),
      append_script_tag, base_path, i;

    // pop-off the document name from the location to
    // get the directory only        
    base_list.pop();
    base_path = base_list.join('/');

    // a handy script tag appender function
    append_script_tag = function ( script_url ) {
      var script_obj = document.createElement( 'script' );
      script_obj.src     = script_url;
      script_obj.charset = 'utf8';
      script_obj.type    = 'text/javascript';
      document.body.appendChild( script_obj );
    };

    // now loop through the list of js files and write the script tags
    for ( i = 0; i < script_list.length; i++ ) {
      append_script_tag( base_path + script_base + script_list[ i ] );
    }
  }());
</script>

热潮，你已经完成了：）

当然，如果可以摆动它，相对路径总是更好。但有时候，你做不到。例如，有时使用本地文件进行测试，但生产中使用CDN。您可以根据环境加载不同的库，这种方法是确定使用环境的一种方法。

干杯，祝你好运！

Answer 2

查看base标记 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base

它允许您为所有相关文件引用指定基本URL。

表示它会对你有所帮助;）

Answer 3

带有斜杠的Pathes不是相对的而是绝对的。 /只指向应用程序或站点的根目录。您可以使用base标记对其进行修改，有关详细信息，请参阅kmiklas answer。

在你的情况下，仅省略前导斜杠可能就足够了。

如何将URL的根路径添加到我的JS文件的路径中？

3 个答案: