angular4在ie9中base标签失效导致的脚本加载失败问题

Question

最近做ie兼容性的我，简直想一头撞死在ie上，出了ie11。。其他低版本各种奇葩表现。。。
上问题。。。
angular4默认的base标签设置如下

<base href="/">

这个标签在ie10及以上可以正常跑，但是ie9就不兼容这种了缩略写法了
必须使用完整url

<base href="http://localhost:4200">

但问题是，php大佬们提出需求，表示要能识别当下url，根据不同的url请求不同的后台api
于是就想到

<script>
    var tmp_url = window.location.protocol + '//' + window.location.host;
</script>
<base href={{tmp_url}}>

然而没有卵用
于是又想到一个方法，在编译好的文件中，找到index.html，把script的src前面加一个'/'
angular默认生成

<script type="text/javascript" src="inline.c7f0faa7740287b873f9.bundle.js"></script>
<script type="text/javascript" src="polyfills.6633af18a0ac2535befd.bundle.js"></script>
<script type="text/javascript" src="scripts.641666128af08053b8e0.bundle.js"></script>
<script type="text/javascript" src="vendor.70831f1e46b98484056b.bundle.js"></script>
<script type="text/javascript" src="main.bc0a0a4ddbf25c6acb37.bundle.js"></script>

更改后的

<script type="text/javascript" src="/inline.c7f0faa7740287b873f9.bundle.js"></script>
<script type="text/javascript" src="/polyfills.6633af18a0ac2535befd.bundle.js"></script>
<script type="text/javascript" src="/scripts.641666128af08053b8e0.bundle.js"></script>
<script type="text/javascript" src="/vendor.70831f1e46b98484056b.bundle.js"></script>
<script type="text/javascript" src="/main.bc0a0a4ddbf25c6acb37.bundle.js"></script>

这样虽然可以解决问题，但是极其不优雅，很不方便，万一编译完忘记改index了，那ie9就爆炸了

所以想问问各位大佬，解决这个问题。。有没有什么好的办法

另外还出现了一个问题是

什么鬼啊这是！一脸懵逼，根目录加载页面直接重定向成了这个样子。。。。

求各位大触指导

Answer 1

使用hash路由解决