如何获取当前正在执行的javascript代码的文件路径

Question

我正在尝试做类似 C

#include "filename.c"

或 PHP

include(dirname(__FILE__)."filename.php")

之类的事情，但用的是 javascript。我知道如果我可以获得加载 js 文件的 URL（例如标签的 src 属性中给出的 URL），我就可以做到这一点。有什么办法让 JavaScript 知道这一点吗？

或者，有没有什么好方法可以从同一个域动态加载javascript（不需要具体知道域）？例如，假设我们有两个相同的服务器（QA 和生产），但它们显然具有不同的 URL 域。有没有办法做类似

include("myLib.js");

的事情，其中 myLib.js 将从加载它的文件的域加载？

抱歉，如果措辞有点令人困惑。

Answer 1

在脚本内：

var scripts = document.getElementsByTagName("script"),
    src = scripts[scripts.length-1].src;

这是有效的，因为浏览器按顺序加载并执行脚本，因此在执行脚本时，包含该脚本的文档肯定会将您的脚本元素作为页面上的最后一个元素。当然，此代码对于脚本来说必须是“全局”的，因此请将

src

保存在以后可以使用的地方。通过将全局变量包装在以下位置来避免泄漏：

(function() { ... })();

Answer 2

除 Internet Explorer（任何版本）之外的所有浏览器都有

document.currentScript

，它始终有效（无论文件如何包含（异步、小书签等））。

如果你想知道你现在所在的 JS 文件的完整 URL：

var script = document.currentScript;
var fullUrl = script.src;

塔达。

Answer 3

我刚刚做了这个小把戏：

window.getRunningScript = () => {
    return () => {      
        return new Error().stack.match(/([^ \n])*([a-z]*:\/\/\/?)*?[a-z0-9\/\\]*\.js/ig)[0]
    }
}

console.log('%c Currently running script:', 'color: blue', getRunningScript()())

✅ 适用于：Chrome、Firefox、Edge、Opera

尽情享受！

Answer 4

如果您的文档中有内联脚本，则此处接受的答案不起作用。为了避免这种情况，您可以使用以下方法仅定位具有

<script>

属性的

[src]

标签。

/**
 * Current Script Path
 *
 * Get the dir path to the currently executing script file
 * which is always the last one in the scripts array with
 * an [src] attr
 */
var currentScriptPath = function () {

    var scripts = document.querySelectorAll( 'script[src]' );
    var currentScript = scripts[ scripts.length - 1 ].src;
    var currentScriptChunks = currentScript.split( '/' );
    var currentScriptFile = currentScriptChunks[ currentScriptChunks.length - 1 ];

    return currentScript.replace( currentScriptFile, '' );
}

这有效地捕获了最后一个外部 .js 文件，解决了我使用内联 JS 模板遇到的一些问题。

Answer 5

根据此处找到的答案，我得出以下结论：

getCurrentScript.js

var getCurrentScript = function() {
  if (document.currentScript) {
    return document.currentScript.src;
  } else {
    var scripts = document.getElementsByTagName('script');
    return scripts[scripts.length - 1].src;
  }
}

// module.exports = getCurrentScript;
console.log({log: getCurrentScript()})

getCurrentScriptPath.js

var getCurrentScript = require('./getCurrentScript');

var getCurrentScriptPath = function () {
  var script = getCurrentScript();
  var path = script.substring(0, script.lastIndexOf('/'));
  return path;
};

module.exports = getCurrentScriptPath;

顺便说一句：我正在使用 CommonJS 模块格式并与 webpack 捆绑。

Answer 6

我最近发现了一种更简洁的方法，可以随时执行，而不是在脚本加载时被迫同步执行。

使用 stackinfo 获取当前位置的堆栈跟踪，并从堆栈顶部获取

info.file

名称。

info = stackinfo()
console.log('This is the url of the script '+info[0].file)

Answer 7

我编写了一个简单的函数，它允许使用 try/catch 方法获取当前 javascript 文件的绝对位置。

// Get script file location
// doesn't work for older browsers

var getScriptLocation = function() {
    var fileName    = "fileName";
    var stack       = "stack";
    var stackTrace  = "stacktrace";
    var loc     = null;

    var matcher = function(stack, matchedLoc) { return loc = matchedLoc; };

    try { 

        // Invalid code
        0();

    }  catch (ex) {

        if(fileName in ex) { // Firefox
            loc = ex[fileName];
        } else if(stackTrace in ex) { // Opera
            ex[stackTrace].replace(/called from line \d+, column \d+ in (.*):/gm, matcher);
        } else if(stack in ex) { // WebKit, Blink and IE10
            ex[stack].replace(/at.*?\(?(\S+):\d+:\d+\)?$/g, matcher);
        }

        return loc;
    }

};

您可以在这里看到它。

Answer 8

完善此处找到的答案：

小技巧

getCurrentScript 和 getCurrentScriptPath

我想出了以下内容：

//Thanks to https://stackoverflow.com/a/27369985/5175935
var getCurrentScript = function() {

  if (document.currentScript && (document.currentScript.src !== ''))
    return document.currentScript.src;
  var scripts = document.getElementsByTagName('script'),
    str = scripts[scripts.length - 1].src;
  if (str !== '')
    return str ;
  //Thanks to https://stackoverflow.com/a/42594856/5175935
  return new Error().stack.match(/(https?:[^:]*)/)[0];

};

//Thanks to https://stackoverflow.com/a/27369985/5175935
var getCurrentScriptPath = function() {
  var script = getCurrentScript(),
    path = script.substring(0, script.lastIndexOf('/'));
  return path;
};

console.log({path: getCurrentScriptPath()})

Answer 9

无论它是脚本、html 文件（例如框架）、css 文件、图像还是其他，如果您不指定服务器/域，则 html 文档的路径将是默认路径，因此您可以做，例如，

<script type=text/javascript src='/dir/jsfile.js'></script>

或

<script type=text/javascript src='../../scripts/jsfile.js'></script>

如果您不提供服务器/域，则路径将相对于页面路径或主文档路径的脚本

Answer 10

我可能误解了你的问题，但只要生产和开发服务器使用相同的路径结构，你似乎就应该能够使用相对路径。