ReactJS - Serving the Same Build from Different Paths - node.js

I try to run the same react app on different URLs but for now without success.
Description of the problem:
I have a react app that works perfectly fine when running both on localhost and on production url when served as a root (e.g www.myApp.com)
however what I'm trying to achieve is to have the same app run both on www.myApp.com and on www.anotherSite.com/myApp
What I've tried:
So I took a look at the Deployment section that can be found here:
https://create-react-app.dev/docs/deployment/
and I tried setting the homepage to "." but this ends in a situation where:
www.myApp.com works as expected which is good
www.anotherSite.com/myApp does not work at all -> white page with error showing
I think it's the same problem that this guy has:
https://github.com/facebook/create-react-app/issues/9183
www.anotherSite.com/myApp/ (notice the / at the end) works but the paths are not working (I get redirected to my 404 Page).
I played arround with different combinations of the homepage, setting the basename for the Router and setting the <base href="%PUBLIC_URL%/"/> in index.html
but nothing really works for both cases.
I was able to run the app on www.anotherSite.com/myApp by setting homepage: "/myApp/" but then www.myApp.com does not work.
Any idea what I'm doing wrong?

Related

I ma getting the white screen after deploying the react app in the azure

[I am receiving the all files in console but showing in the frontend and automatically refresh showing the whitescreen][1]
Package.json fileQ5XvT.png
To resolve white/blank screen deployment of react app in Azure, try either of the following ways:
In package.json add "homepage": "."
Make sure to publish from build folder instead of public folder
In your index.html, make sure to check to specify correct JavaScript bundle.
References: How to fix the Blank screen After a Static Deployment with create-react-app and I have deployed a azure-webapp and the page displays blank
You can see this other post: Blank page after running build on create-react-app
If you're using react-router and trying to open index.html directly in the browser (or using electron, which essentially does that), in addition to setting homepage as others have suggested, replace your BrowserRouter with a HashRouter.

Manifest error in react app when using build for deployment

I'm running build for a react app and using the index.html file path on my node server. Everything is working fine but on routes where I am using slugs are giving errors:
path is like: /blog/:id
/blog is working as it should but
/blog/someID is throwing this error in console and browser just gives a white screen.
Things are working fine in my react app locally. I believe it is an issue with the build process.
I have not seen this error before. I've used this process multiple times and it works fine but this time it is throwing some error. Can someone guide me why it is throwing this error?
Thank you.

quasar SPA build produces blank page with Node.js both locally and globally

I just built my app with quasar CLI.
This is my quasar info:
I made a regular spa build knowing that it’s not be sitting directly in root folder on the server, so I changed publicPath:
Server-side static frontpage files are served OK for the main page and the main page has a link pointing to http://localhost:3000/application which produces blank page with this error:
Elements tab looks skim, #q-app does not have any content:
Network connections with 30x status:
What am I missing? Could it be related to build itself or is it something in my node-server?
Github said something about lazy-loaded components and dynamic-import-node plugin, so I added it before build:
I've gone through script tags in the DOM just to see that their source attributes where all absolute, so I changed them to relative paths by modifying quasar.conf like this:
publicPath: '/application'
That's all it took to make it work :)

Swashbuckle running with katana-owin based web api doesnt work with IIS but works with IIS Express

I think I have a similar issue as this post-
Webactivator doesn't run on IIS 7
Swashbuckle running with katana-owin based web api is able to work with IIS Express.
assume all the urls below have an "http" prefix.
I can browse to something like localhost:8085/swagger Which redirects me correctly to localhost:8085/swagger/ui/index
But when published to IIS redirects to localhost/swagger/ui/index instead of localhost/myapp/swagger/ui/index and this results in a 404. Notice that even though an application name is specified while publishing somehow swashbuckle/swagger doesn't know and only uses the pathbase without the application name.
basically it just picks up the site root URL instead of the application URL that was used to call /swagger
Any solution to this problem?
I got the same issue. Solved this using the following code (c.RootUrl)
config.EnableSwagger(c =>
{
c.IncludeXmlComments(GetXmlCommentsPath());
c.SingleApiVersion("v1", "yourAPI");
c.RootUrl(req => req.RequestUri.GetLeftPart(UriPartial.Authority) + VirtualPathUtility.ToAbsolute("~/").TrimEnd('/'));
});
Reference : Relative path for UI request URL

Err_connection_refused using meteor uploads

I am deploying a meteor application to a digital ocean droplet with meteor upload. Everything goes well, the application gets deployed, database works, seeding of data works etc. But there is one problem i can't seem to be able to solve.
I use the meteor-uploads package (https://github.com/tomitrescak/meteor-uploads) for file uploads. Locally everything goes well, the file gets uploaded, finished callback gets called etc. But once I have deployed the application to the server it keeps giving me on of these errors, :
POST http://*ip*/upload net::ERR_CONNECTION_REFUSED
POST http://*ip*/upload net::ERR_EMPTY_RESPONSE
POST http://*ip*/upload net::ERR_CONNECTION_RESET
Any ideas are welcome, I have searched all over for a solution but none seems to fit my problem. I also installed to a fresh droplet but that didn't help. In none of my browsers (Mac Chrome, safari & firefox) does it work, on my phone (Android 5.0) I get the same errors. I am using the newest Meteor version 1.1.0.1
On local host you don't need to set the environmental variables, but the host services provides you should.
Check this tutorial to see how to put the environment variables.
Because the file-upload needs a startup-server-configuration, like this.
//file:/server/init.js
Meteor.startup(function () {
UploadServer.init({
tmpDir: process.env.PWD + '/.uploads/tmp',
uploadDir: process.env.PWD + '/.uploads/',
checkCreateDirectories: true //create the directories for you
})
});
But im not sure if putting this on a startup will work on digital ocean, like i say you you enter it, run printing and check if the /.uploads/ exists

Resources