ExpressJS+NodeJS server won't serve CSS files - angularjs

I'm trying to host my own web server, so i redirected traffic from the domain to my computer. Traffic is successfully reaching my computer and the website is being displayed except ExpressJS is not serving the only CSS file so the content on my website is all over the place because its not being styled.
The failed GET of the CSS file is seen in the console:
resource: net::ERR_CONNECTION_TIMED_OUT xxx.xx.xx.xxx/styles.176e4d821cc3a21887b2.bundle.css Failed to load
Looking further into the error we see it is the only file that failed, even though all the files are in the same physical directory as you see on the next image:
I'm using Angular and this is my dist deployment folder and you can see the CSS file is in the same locations as the JS files but only the CSS file fails to be GET'd:
In Express i have the following which seems to serve the JS and HTML files but not the CSS file:
app.use(express.static(path.join(__dirname, '/')));
Also, everything works perfect on localhost, its only on traffic redirected from my .com website that the site fails to GET the css file.

Related

404 connecting frontend to backend, content security policy

I have the backend server.js file in a folder labeled server alongside a client folder. I have express, cors, and nodemon installed as dependencies in the server folder, and performed a CRA to generate the front end.
However, I created an endpoint to return a json object to test if the server is working and it is not.
Step 1:
First, I attempted to set the "/" endpoint to return a res.send({message: "welcome to the server"}) and display it on the dom.
RESULT:
Cannot Get /
---In the Console of the Chrome browser I see a 404 for the path http://localhost:5000/weather although I've defined the endpoint as instructed, and in Firefox Dev Edition I see that the Content Security Policy blocked a resource http://localhost:5000/favicon
Step 2:
This lead me to attempt a HTTP response header that would include the security policy directives being violated.
Step 3:
Hereafter I learned that the diagnostics are throwing this error because servers by their nature do not serve the contents of the root directory, therefore I included a static path for the folder where that resource would be located to circumvent the cause of the 404 error. I lastly updated the file path in index.html where the /favicon.ico is being referenced and removed the %public% from its url so that it is an exact path to the public folder
Step 4:
Because the combination of configuring the Content Security Policy HTTP request header, updating the path for the server to resolve to the public client folder, and opening it in different browsers did not work. I tried one final thing that I've read from mining stack overflow: removing the devtools.JSONview.enabled from my Firefox browser. To no avail..
What could be the source of this problem? I've tried every solution ive seen so far.. is there something I've overlooked? Does Helmut really fix this issue? If so, what directive would it add that I haven't already? Please, and Thank you
Setting Response Header to include Content Security Policy with relevant directives,
Updating the file path of the favicon.ico resource and setting a static path for express to locate missing directory,
And updating browser settings in Firefox, attempted in Chrome to no avail.

After deploy my react app returns an error that cannot load a js file

I have an json file in the public folder, to which after starting the application I make a request to it. When I load the application from a port on which I hosted it, everything is fine, but when I change the port with some url (test.project.bg) this json file does not build or somehow does not find the way to it.

How do I set the favicon used when serving files from DNN Platform?

When serving static files (e.g. PDFs) from a DNN website, the default DNN favicon shows up, rather than the favicon configured for the site. How can we get the site's main favicon to be used when serving static files?
When serving static files, DNN isn't part of the request. There's also not a way for the web server to tell the browser an alternate location for the favicon. So the browser looks in the default location, /favicon.ico. A DNN favicon is included here in the default installation package. Assuming you aren't hosting sites with different favicons in your DNN installation, you can simply overwrite DNN's favicon.ico file in the root of the file system with your custom favicon.ico file (this will require access to the web server's file system, it's not exposed through the web interface by default).
If you host multiple sites with different favicon.ico files, there's not as simple of an answer here. You could probably use URL Rewrite rules to read the host being used in the request, and redirect /favicon.ico requests to the correct spot.

How can I call ReactJS chunk files via sharepoint master page without webpack configuration

I developed an application with ReactJS and got chunk files with npm run build. But how can I call these files via sharepoint master page. I just add the main chunk files to master page and loaded it but it never called the component and it doesn't render.
I uploaded the below files to the SiteAssets folder in SharePoint. I just the call main.553276c9.chunk.js via master page.
0.45984e43.chunk.js
0.45984e43.chunk.js.LICENSE.txt
0.45984e43.chunk.js.map
3.e5ccfe13.chunk.js
3.e5ccfe13.chunk.js.LICENSE.txt
3.e5ccfe13.chunk.js.map
4.bdcd656e.chunk.js
4.bdcd656e.chunk.js.map
5.41ddc0b8.chunk.js
5.41ddc0b8.chunk.js.map
6.cc7d4939.chunk.js
6.cc7d4939.chunk.js.map
main.553276c9.chunk.js
main.553276c9.chunk.js.map
runtime-main.85cbbfa2.js
runtime-main.85cbbfa2.js.map
Most build systems that generate files like this should also generate an index.html file that should load and run your app. You should upload that html file, along with all js files, and run your app from that.
If you're using Create React App with react-scripts the index.html should be in build/index.html.
According the documentation runtime-main.85cbbfa2.js is file to include.
runtime-main.[hash].js
This is a small chunk of webpack runtime logic which is used to load and run your application. The contents of this will be embedded in your build/index.html file by default to save an additional network request. You can opt out of this by specifying INLINE_RUNTIME_CHUNK=false as documented in our advanced configuration, which will load this chunk instead of embedding it in your index.html.
Just note that that filename will change when the code changes. The build process will update your HTML file, with that new filename. So you definately want to be in the habit of uploading that.

hugo serve content inside .well-known folder

Third party application which I'm trying to integrate, asking to put a file inside a .well-known folder. how can I make that file accessible from URL? (example.com/.well-known/token.txt). site is deployed as a gitlab page. every attempt I tried gives 404 error.
If you put your ".well-known" folder inside the "static" folder it should get deployed to the root of your website as you expect.

Resources