I'm just about to embark on a new role in my company. We've got some legacy web apps (asp and aspx) and we want to start developing new Blazor modules for these apps, without completely re-writing them. One idea I had was hosting the Blazor wasm inside an iFrame. I then wondered how the blazor module could communicate with the old legacy apps and found an article on a suggested route to do this using the javascript postMessage api
Add client side Blazor to existing ASP.NET MVC5 app
So I've got a trivial Blazor wasm app with a button on it. The click event just calls a javascript function
private async Task OnClick()
{
Console.WriteLine("Write to the console in C#! 'OnClick' button selected.");
await JS.InvokeVoidAsync("interopFunctions.callParent");
}
And I've a .js file in wwwroot that has the following
var interopFunctions = {};
interopFunctions.callParent = () => {
debugger;
window.postMessage('test', "*");
};
This all works when running it locally as a Blazor app, but when I try and drop it in an iFrame in a separate asp.net mvc core project, although the blazor shows up ok, I get an error when I press the test button
<iframe width="560" height="315" src="https://localhost:7295/" frameborder="0" allowfullscreen</iframe>
crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
Unhandled exception rendering component: Could not find 'interopFunctions.callParent' ('interopFunctions' was undefined).
I'm certainly no Blazor expert and am just starting out with the framework, but wonder if this is a sensible thing to be doing, why it might not work and if it can never work what sort of alternatives are there for Blazor in old legacy apps.
thanks
[Update]
This all seems to work fine in a static web page, just not from an asp.net mvc core app.
Very strange. Checked again this morning and the asp.net mvc code is now working. I was a bit confused by the static page working (see update comment) so came back to it today find things working. I must have done something wrong. Going to try closing the question now.
Related
I'm working on a Blazor WASM app and I want to add an Administration. The administration will use a completely different set of css and js files so I want to create a new client application for it.
What I'm trying to achieve is to have my app on address https://myapp.com and the admin part on http://myapp.com/admin.
I'm following the example provided in this response https://github.com/dotnet/aspnetcore/issues/21872 but it doesn't work so far. The main application loads, but when I try to navigate to the administration I'm getting 404.
Has anyone did it with .net5?
The problem I was facing was caused because I forgot to add a dependency of the second client project into the server project.
We have our existing pages in ASPX and site is hosted on IIS7 server.
We are looking for revamping/design the pages in VUEJS 2.0.
We are able to get VueJS code integrated with existing ASPX pages by getting build.js generated (production) and referring the same on ASPX page and page will be having the Target element. This all is client side rendering.
Now, we want the same in SSR. That mean to be complete HTML code rendered on the page before being served to the client (browser).
This clearly indicates we need to setup NodeServer, which can be called up by ASP.NET to get the VUEJS code rendered and added on ASPX page before it's being served to the Client (Browser). Please correct me If I am wrong. Here we are looking for a dynamic webages (Not the static one with prerendering or static generation)
We have started looking up for NUXT.JS as one of the options. But this is recommended to be used for the apps hosted for NodeServer.
ref:https://github.com/MarkPieszak/aspnetcore-Vue-starter/issues/67
1: https://github.com/MarkPieszak/aspnetcore-Vue-starter/issues/67
Other big challenge going with Nuxt is, they are likely launching Nuxt2.js version, which may or may not have breaking changes. https://medium.com/nuxt/nuxt-2-is-coming-oh-yeah-212c1a9e1a67
Next option is to looking for following:
https://github.com/MarkPieszak/aspnetcore-Vue-starter
https://github.com/vuejs/vue-hackernews-2.0
http://mgyongyosi.com/2016/Vuejs-server-side-rendering-with-aspnet-core/
Above links mentions using ASP.net core API Microsoft.AspNetCore.SpaServices.Webpack.
I believe you must have faced this situation and reached to an optimal solution. I am looking for suggestions from veterans have achieved the same, what path to be followed?
IF this can be achieved at all? and what are the challenges I should look forward?
Thanks
I'm creating an asp.net web application.
In the web application I have a web service.
I added [System.Web.Script.Services.ScriptService]
To the web service file and added a script manager to the aspx page.
When I call the web service in javascript I get an error "Microsoft JScript runtime error: 'getText' is undefined"
This same code works in another project, but it's a website project and not a web application. Maybe there is a difference between the two in this respect?
Thank you!
-Elad
What are you trying to do with getText ? Is this a valid ASP.NET AJAX command?
Assuming it is...
Not much info to go on here, but make sure you have added a reference to the .asmx file of your service on the <ScriptManager>control in your page.
You can do this in markup, or in code like this (usually during the Page Load event):
sm.Services.Add(New ServiceReference("~/YourWebService.asmx"))
Where sm is the id of your ScriptManager.
Also, if the JavaScript file you're using to call your web service is external, load it by registering it with the ScriptManager like this rather than adding a reference to it in your markup:
sm.Scripts.Add(New ScriptReference("YourJavaScriptFile.js"))
This ensures it won't run until the ScriptManager is ready.
Also, add this line to the very end of your JavaScript file:
if (typeof (Sys) !== 'undefined') {Sys.Application.notifyScriptLoaded(); }
This notifys the ScriptManager that your JavaScript file has loaded.
I switched from a web application project to a web site project and everything started working. I don't really know why this is, but it just worked.
I ran an ASP.NET page that i have under development on my local IIS. It uses some dragPanelExtenders as well as some other AJAX Control Toolkit AJAX client side stuff, and in order to show the page to somebody, I wanted to put it up as a plain HTML file, hosted on a live web server (running APACHE). (This is the only public web server I have access to, and I want them to be able to drag some panels and experience the page as it would be when "live")
So, I viewed the page running on my local IIS, then saved the source as a HTML file.
Then copied this HTML file to the web server ( as well as necessary CSS, JS and image files).
When I view this HTML file through the web server, I get this error :
ASP.NET Ajax client-side framework failed to load.
By debugging, I see that the following lines were in my saved HTML :
<script src="/Insata10/WebResource.axd?d=VAXZudqFsChpNfB" type="text/javascript">
<script src="/Insata10/ScriptResource.axd?d=Dwbyv-OIp-kJQdqf_UMh7wUzi2" type="text/javascript">
<script type="text/javascript">
if (typeof(Sys) === 'undefined') throw new Error('ASP.NET Ajax client-side framework failed to load.');
So, at runtime, the referenced resources "ScriptResource.axd" and "WebResource.axd" were not found.
Is there any way to get whatever is needed from those AXD's to my HTML file, without actually executing anything on IIS?
Not easily. The Ajax Control Toolkit relies on server-side .NET Code, which runs in the context of IIS.
You can us a different web server, such as the Cassini web server that comes with Visual Studio (or write your own), but I expect that you're looking for a simpler solution, and none exist for what you're asking.
The bottom line is, the server-side code needs to run, and for that you need a server. You can't just open the file and have it work.
The best you could do would be to find similar javascript to get the desired funcitonality.
edit
I'm always forgetting about Mono, so if your Apache server is set up and configured correctly, you CAN run .NET code from an Apache server. http://www.mono-project.com/ASP.NET
Still not simple, though, so my answer of "not easily" does not change.
I have a .NET app running inside a Peoplesoft web portal IFrame.
What I need to do is get the URL of the portal (parent) that called my .NET app.
So far I've tried to get the URL inside my c# code using Request.Url.AbsoluteUri but this is not working.
I'm assuming I will have to do this in JavaScript, or is it possible to get the browser's URL inside my c# code?
Thanks in advance.
Request.UrlReferrer.AbsoluteUri on the Start Page of the ASP.NET app did the trick.
All is good now.