Cant access images, css and js of MVC via Nginx on AKS - model-view-controller

I made an .NET MVC which is deployed on AKS in a certain namespace just classic service and deployment yamls to deploy it. When I forward to it (port 80) for example, I can access it without any problems; I can see all of the webpages and its contents, including js, css, images and so on.
I added an Nginx Ingress controller to the same namespace using the following Microsoft documentation: https://learn.microsoft.com/en-us/azure/aks/ingress-basic?tabs=azure-powershell. When I try this out with the example aks-hello-world example, it redirects to the aks-hello-world without any issues.
When I change the routing inside the ingress-yaml and redirect it to the MVC, which resides in the same namespace, it loads the home page (when I go to the source code, I can see that it loaded the page successfully because the HTML is there) but it doesn't load in css, js or images. How can I make sure that the js, css and images are loaded in correctly?

Related

Serving a prototype page in Wakanda 2.4+

Currently using Wakanda 1.1.3 with a mostly Angular4 on client side, yet, a few prototype pages persist from
our initial project. Provided we make the necessary file structure, module, login and syntax changes for v2,
will Wakanda v2.4+ serve our older prototype pages?
If so, is there anything special or unique that we need to do to get a prototype page to load?
You can save the WAF files (JS & CSS) generated by the v1.1.3 runtime for each prototype page.
Open your prototype page in a browser.
Open the browser console.
Save both waf~css and waf~js files.
Hard link these files in your prototype page.
This should be enough to run on Wakanda v.2.6.0

How to launch and serve subpage from my webapplication?

I am using Spring to create a web application in which a user can upload a zipped folder containing an index.html file along with all it's resources(pretty much like an Adobe captivate generated webpage). The user should be able to request the uploaded web pages in the form of inner web pages.
I can only go as far as unzipping the folder itself, but I have no idea how to launch the index.html present inside the zipped folder.
How do I achieve this?
Quite honestly Spring has no restrictions or advantages over
displaying your subpages inside another page. However you can use Spring MVC to dynamically serve the web pages from the uploaded folder.
More over you have to play the tricks from browser side. Going with iFrame seems to be the best option from client side, though there are many other options. Please check this thread.
You can write some smart APIs in SpringController which accepts the folder path or folder name as parameter, picks the necessary pages from the requested folder and serves the user.
Another approach could be to use a headless browser for the server side rendering and give the output as screenshots to client. This can render the pages server side. Please check this thread for more details.
I hope this helps you!

Creating a Firefox extension that modifies a page that exists on a local web server

I'm trying to create a Firefox extension that will allow me to modify a page on my company's local web server. I don't have access to modify the source code of the page itself. So in the same spirit of extensions like the Reddit Enhancement Suite I'd like to write some code that will inject a CSS file and some javascript to enhance the page on page load for myself and my co-workers.
I've successfully made a Firefox extension that loads in files on regular sites like say google.com and such. But once I change the domain to match the page on my company's local web server (for example: 10.0.0.12:82), it stops working. Specifically I am attempting to inject a .css file into the page. I am using resource:// to do it and it works flawlessly on other sites. The CSS is not being injected at all. So it's not a matter of permissions or anything. It seems like the javascript isn't firing.
Is it not possible to do this on a local web server? Perhaps there are extra measures I need to take first since it's not a normal website?
Here is the relevant code from the files in my extension. I set up a path in my manifest file and then in the javascript file that loads I append a css file located at \chrome\skin\resources into the <head> tag of the loaded page.
chrome.manifest file
resource cemod chrome/skin/resources/
console.js file
$("head").append('<link media="all" href="resource://cemod/page.css" type="text/css" rel="stylesheet"></link>')
Just to reiterate, this code works fine when the extension is written to activate on other pages like reddit.com. But it stops working once I change it to the IP address of my company's local web server.

SEO-friendly static snapshots of single-page web apps without using a dynamic server

Scenario:
I'm hosting a single-page application on GitHub Pages. When accessed via browser, JavaScript processes #! URLs and updates the UI.
I also want my app's content to appear in search results. Since I'm using GulpJS already, I want to add a task to create and save pre-rendered HTML snapshots of my page to accommodate web crawlers.
Problem:
My content is served by GitHub Pages, so I don't have any way to handle the _escaped_fragment_ parameter that web crawlers send. Every tutorial I've found on AJAX SEO assumes you are hosting your content on e.g. a NodeJS or Apache server and have a way to process such URL parameters.
Question:
Can a single-page web app be SEO-friendly when hosted on a static file server (e.g. GitHub Pages)? Is there a special directory I can use? Some special Sitemap or robots.txt configuration? Something else?
What I've found already:
Frequently Asked Questions (via Google Webmasters)
How do I create an HTML snapshot? (via Google Webmasters)
AngularJS and SEO (via Yearofmoo)

Meteor: Loading all page resources in the background

When someone navigates to my Meteor app, I would like the home page to be loaded first, rendered, and displayed. And then as soon as this is done (the user can start clicking around), all the other resources and databases for all pages of my app are loaded (cached) in the background to LocalStorage (as much as can fit), so that all the pages, images, etc, of my app will appear instantly when navigated to.
What's the no-brainer convention for doing this in Meteor? Is there a package?
And secondly, how do I indicate which resources I want to be highest priority in the background loading queue? For example, how do I make sure that a "splash page" and its images shows up right away?
Meteor apps are, by design, single-page sites. If you view-source on a deployed Meteor app, for example http://docs.meteor.com, the <head> always looks something like this:
<link rel="stylesheet" href="/5a6084946b1bc47e30e45c05bdecb13536a2dc64.css">
<script type="text/javascript">
__meteor_runtime_config__ = {"meteorRelease":"galaxy-follower-5","ROOT_URL":
"http://docs.meteor.com","ROOT_URL_PATH_PREFIX":"","serverId":
"964b34dc-ffbb-b860-a313-9eedca254d83","DDP_DEFAULT_CONNECTION_URL":
"ddp+sockjs://ddp--****-docs.meteor.com/sockjs"};
</script>
<script type="text/javascript" src="/3353c2b059d42f3fe42e0d5eba87882b955d7cbe.js">
</script>
That .css file is all of your app's CSS, concatenated into one file; and that .js file is all of your app's JavaScript, including all of your templates, concatenated into one file. That's just the way Meteor is designed, and it's not something you can change without delving deep into Meteor's source and rewriting some major chunks.
The only suggestion I have for you is to have your homepage served by something else, such as an Apache or Nginx server, which really does serve up just the bare minimum that you're after; and fetches the above .css and .js files and preloads them. Use a router package in your Meteor app, and take care that all the links in your homepage point to routes that are defined in the Meteor app. You can also speed things up a bit by separating out and loading from a CDN or your Apache/Nginx server any resources not directly needed by Meteor—images, additional CSS, external JavaScript like libraries—and having those preloaded by your non-Meteor-hosted homepage.
Finally take a look at meteor-external-file-loader. It's designed for loading external JavaScript libraries on the fly in Meteor apps, for example loading Google Maps only on the pages where you're actually showing maps. I'm not sure if it can be used to load JavaScript that's core to your app like templates, but if your app is so large that you're thinking of splitting it up anyway then presumably there are parts of your code that you can separate into packages like your own custom JavaScript libraries, which can then be loaded dynamically from your Apache/Nginx server using meteor-external-file-loader.

Resources