Join GitHub today
GitHub is home to over 40 million developers working together to host and review code, manage projects, and build software together.Sign up
IE11 support for server-side Blazor #9436
Creating a default "Razor Component" Project and trying to access it from IE 11 doesn't seem to work.
Steps to reproduce the behavior:
Expected behavior / Error
IE11 Console shows the following error during the load of the page
I tried to do random stuff that got me nowhere.
I added <script src="https://cdnjs.cloudflare.com/ajax/libs/bluebird/3.3.5/bluebird.min.js"></script>
then I got "fetch is undefined"
and now I get-
I already tried that one. While it works for simple setups like the counter page, my stress test page (which I made for #6385) just never changes from "loading..." to final values: https://github.com/springy76/RazorComponentsProblems/blob/problem/ConnectionDiesWhenUsingAsyncOperations/WebApp/Components/Pages/Index.razor (and so does the real real world app which we're migrating to Razor components).
Hello! The https://github.com/Daddoon/Blazor.Polyfill solution doesn't work around here (IE11).
The console doesn't show any error, if you want to replicate this, just create a new Server Side Blazor with the latest SDK (Preview 4) and run it.... the reactivity won't work. At least that's how I reproduce it.
OK, I've investigated, and got it to work. But it involved making some changes inside
@Daddoon I've found an issue with your Polyfill and the latest 3.0.0 Release, that makes Blazor fail when using URLs with parameters.
I attach the demo project as requested by @mkArtakMSFT
It's basically a default Blazor ServerSide template with the Counter component modified so it takes 1 parameter.
This works fine in Chrome & Edge, but in IE11 the URLs that use a parameter don't work, showing this router error, like the URL doesn't exist.
If you browse the app first using a URL without parameters like https://localhost:44340/fetchdata, and then you click in the counter component link it seems to work because the connection is established. The problem appears when you browser directly the counter component, seems that blazor fails to establish a connection to the server.
Well, in my opinion it's surely a "bad" idea of my side.
I have done a fix on IE11 that take account what is the base start when a Blazor is not hosted on a simple base root.
However i have missed this type of scenario you are talking about, as i must reference the base path about the page path and not the app subpath.
In the meantime, before i take any action do it properly IF possible, if you take the original source code, you can revert to the previous implementation assuming launching Blazor from a simple base path. So this line:
document.baseURI = window.location.protocol + "//" + window.location.hostname + port + path;
Must be replaced with:
document.baseURI = window.location.protocol + "//" + window.location.hostname + port + "/";
Then it should work with the sample when calling your page with parameters.
I don't know if it is possible to get the real base path of the application URI from IE11 and Websocket if the given starting page is not the base application path. I have to do some test!
EDIT: Concerning your question, BlazorPolyfill is sufficient for running Blazor on IE11. I don't have made test about other old browsers like the one shipped with old Android versions.
TL;DR BlazorPolyfill should be sufficient
Concerning the tests, starting with the last stable Visual Studio 2019 release (16.3.29318.209):
Flat test, without Blazor.polyfill.js:
With Blazor.polyfill.js test:
Without Blazor.polyfill.js but forcing window.Blazor.start():
In actual release IE11 need:
Maybe some other polyfills are required, i mean, i have tested individually a long time ago, but it was with the asmjs support, so there is maybe less requirement today.
But the 4 mentionned here seem still mandatory.
BlazorPolyfill does include theses requirements.
I could use some help here. I created a Blazor serverside project (using the code as generated).
In _Host.cshtml I added:
However, the [@OnClick="IncrementCount"] still does not work. What am I missing? I downloaded the blazor.polyfill.js from https://github.com/Daddoon/Blazor.Polyfill/releases/tag/3.0.0
My _Host.cshtml has this now:
How can I get rid of the 'sendBeacon' error?
Please note that this polyfill is not something supported officially by Microsoft.
TL;DR I don't know yet how to avoid this error with Blazor.Polyfill
As stated on my repo:
For Blazor in Server-side mode
And that's all. The polyfill should handle the Blazor.start() by itself.
For that sendBeacon error, i think this is something that my polyfill don't manage, and i have never tried to see on what this is related, and if i can do something on this error.
However, in the current state, the Blazor server-side app on IE11 work even with this error.
EDIT: Opened an issue here: Daddoon/Blazor.Polyfill#12
Thanks. If I can ignore the error, that is fine for now.
I think one aspect MS fails to adequately recognize is that a LOT of government agencies and large companies are still standardized on IE 11. The cost to retrain and make Edge or another browser the standard is quite large, and not a high priority as long as line-of-business apps work on IE 11.
That means that internal development teams and consultants/contractors that want to start pushing our Blazor serverside apps, cannot do so if IE 11 is not fully supported on Blazor Serverside. The end result for MS is a delayed or no adoption of Blazor for wasm, and potentially the MS stack gets replaced by other wasm stacks that do support IE 11.
I and most users of IE 11 understand the browser is end-of-lifed and no longer supported for new functionality, like a wasm engine. But adoption of a modern browser is slowed by the cost for governments and large companies.
I think MS was on it but mainly more focused about releasing the RTM of .NET Core 3.0 (Including Blazor server-side). And as polyfills can workaround the missing features, i think this is fine that they don't have priotized this.
I'm taking a look on this right now as i have some time right now. I will release an update shortly if this work correctly on the sample.
I don't know where sendBeacon is used, but i think this may be used to sync some browser states when reconnecting for the current session but this is just an assumption.
See the release here: https://github.com/Daddoon/Blazor.Polyfill/releases/tag/3.0.1
I don't see the error anymore since the polyfill included.
Even with @Daddoon's polyfill (a great help, many thanks), we've had a problem with s/s Blazor with IE11 when the root component is hosted on a page which isn't at the root path
What happens is that SignalR tries to connect to
I gave up trying to work out why this was (TBH, I'm not 100% why it works on the modern browsers) and just added the following rewrite rule to Startup (before
You might fancy a more sophisticated re-write rule, as this one could be a bit enthusiastic.
This might be useful to someone, if you get to a point where you're seeing 404 errors from the Blazor SignalR connection.
Thanks ! Le mer. 20 nov. 2019 à 23:51, Will Dean <email@example.com> a écrit :…
@Daddoon <https://github.com/Daddoon> - I'm not sure it's fixable in your polyfill, but if I can build a simple repro then I'll open an issue on your repro for you to look at. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#9436?email_source=notifications&email_token=AFS5ALW6G43UNFOZXT762QTQUW5NNA5CNFSM4HGOFMDKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEEV2UJQ#issuecomment-556509734>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AFS5ALTPKXRNS23EDU5AJHLQUW5NNANCNFSM4HGOFMDA> .
I released a new version of the polyfill:
So to install, as stated in the updated doc:
...considering you have copied the file in a wwwroot/js folder.