I have some local html files which have relative paths for style sheets and javascript:
<link href="/css/rendering.css" rel="stylesheet">
<script type="text/javascript" src="/script/task.js"></script>
With a <base>
href set, the css works, but the script does not, if I set a full path on the script it works (and it's the correct path if I was using <base>
).
The css and javascript are hosted on a web server, the html files are held on a local drive.
<base href="http://example.com/myservice/public" >
Resources behind /public (the css and javascript) do not require any Authentication.
I don't generate the html files, but I'm looking for the easiest option to make them work locally so the inclusion of the <base>
seemed like the logical solution instead of having to edit the src
.
Any ideas why this would not work?
UPDATE: By setting a full path, the css and javascript loaded fine.
By setting a <base>
with href
css worked, javascript didn't.
Further digging into the console shows that the javascript is being blocked: "Access to XMLHttpRequest at '' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource"
So the issue comes into play when the <base>
is set, but not when full paths are used. Now that is odd.
Just as @Peter B said, adding a /
to the href
of <base>
and removing the starting /
of <link>
and <script>
should be the best practice.
<link href="css/rendering.css" rel="stylesheet">
<script type="text/javascript" src="script/task.js"></script>
<base href="http://example.com/myservice/public/" >
If it is still not working after that, you need to check your Access-Control-Allow-Origin settings of your server.
Additionally, you've mentioned the easiest option. Then you should simply try launching Edge with command line --allow-file-access-from-files
. Remember to close all Microsoft Edge instances first from task manager.