I'm trying to configure Webpack Hot Module Replacement to work with a remote server.
I'm building an application on Salesforce.com platform and want to configure internal application page to get all necessary files from my local machine using ngrok and webpack-dev-server. And the actual result is the same behavior of HMR - replace changed modules using socketio. I use angular-webpack2-starter seed project to test it just from ngrok. But when I open the page from ngrok endpoint and update some module the connection with HMR is lost.
Logs screenshot here
Related
I'm new to Progressive Web Apps, and I'm adding a Service Worker to my app for the very first time. It's a simple Service Worker, with my goal being purely to test that it is being registered properly. The file is serviceWorker.js:
console.log('Hello Service Worker');
I'm adding this to an application that I'm running with the Webpack Dev Server. I'm using a self-signed certificate locally with it. I setup the Service Worker in my index.tsx (React Typescript) like this:
if ('serviceWorker' in navigator) {
navigator.serviceWorker
.register('/service-worker.js')
.then(() => console.log('Worker registered'))
.catch((ex) => console.error('Worker registration error', ex));
}
However, when I start the dev server and go to the app, I get an error:
Failed to register a ServiceWorker for scope ('https://localhost:3000/') with script ('https://localhost:3000/service-worker.js'): An SSL certificate error occurred when fetching the script.
The URL, https://localhost:3000/service-worker.js, does indeed work, the browser is just blocking it because of the self-signed piece of the cert.
I'm using Chrome Browser on on M1 Pro MacBook running MacOS Monterey, with Webpack 5.
For the record, I'm aware of plugins like Workbox, I would prefer not to use them at this time because I'm still very new to Service Workers. I believe in working with the low-level constructs when starting with a new tech to understand them better before embracing easier abstractions.
I'm not aware of any features—including service workers—that require HTTPS on localhost.
localhost, and equivalent IP address ranges, are specifically excluded from HTTPS requirements by Chromium-based browsers, and both Firefox and Safari follow that, at least when it comes to service workers.
So I would suggest that you just access your web site via http://localhost:3000 instead.
There are more details in this older answer.
This might be a stupid question since it seems pretty simple, but I can't get my nuxt project to run on my IP address.
The Nuxt.js docs say that I have to put this in my package.json file in order for it to start on my IP:
"config": {
"nuxt": {
"host": "0.0.0.0",
"port": "3333"
}
}
In a lot of articles online the 0.0.0.0 automatically binds to your IP address so you can access the project in the browser with your IP address. Whenever I run the command yarn dev it just starts the project on 0.0.0.0:8000. Is this normal? If yes, how do I get it to run on my actual IP Address?
I would really like to know how I can get this done, this is really confusing me.
I know you asked this a long time ago and never got an answer. This is currently the top Google result so it is worth a good answer for the future of the internet.
Your setup looks (largely) correct, but it needs to be in your nuxt.config.js file, not your package.json.
There are a few ways to do this:
Option #1 - Inside nuxt.config.js:
export default {
// ... All your other settings are already here
// You will need to add this:
server: {
host: '0',
port: '3000' // optional
}
}
This will expose your app on your local network. When you run npm run dev now it will run on your computer's IP address. The output in the console will link to your computer's IP address followed by the port number. It will no longer use "localhost".
Option #2 - From the Command Line
If you just want to run this as a one-off command to test something briefly, then you can specify HOST=0 in the command line before running your npm run dev command.
It would look like this:
HOST=0 PORT=8000 npm run dev
Option #3 - Create A Script for Hosting the Dev Server
This option is good if you frequently switch between localhost testing and internal network testing. It allows you to create a new NPM script so that you can simply run npm run dev when you want to run locally, or run npm run dev:host if you want to host internally.
This requires adding a script to package.json
/*
* package.json
*/
{
... other options
"scripts": {
"dev:host": "nuxt --hostname '0' --port 8000"
}
}
You can change the name of the script (the part that says "dev:host" to be anything you want to call it. In this example though you would run npm run dev:host in the console to run it on the network. But the npm run dev command would work the same as before (using localhost).
All of these are useful in case you want to open the app in development on a mobile device for testing. Your mobile device will need to be on the same wifi network as your computer to access the page. Just open a web browser on your other device, type in the IP address with the port number and it will connect to your dev server. This does NOT publically expose your app, it only exposes it internally on your network. This is designed for testing, nothing more.
Read More in the Docs: https://nuxtjs.org/docs/2.x/features/configuration#edit-host-and-port
If you wanna run the app in public IP you need a hosting like digitalocean, vultr.
If you wanna run the app in a private IP then you install a web server and you need to use your public ip address and set up port forwarding. But this is not safe.
You can modify this in the nuxt.config.js file it is not advised to as it might cause you issues when hosting your site. It is much better to modify the host direct in the dev command. Like this
HOST=0 npm run dev
or the port that you want
PORT=8000 npm run dev
or both
HOST=0 PORT=8000 npm run dev
I started to code my new website using ASP.net core
Everything runs properly with development environment: Open VSCode and F5 to run.
But after i publish all of them to IIS, it runs with 404 error
This localhost page can’t be found No webpage was found for the web
address: https://localhost:1111/ HTTP ERROR 404
The error page is displayed when the page connects database to runs backend actions.
Any actions in published web that don't use database such as href to another link, run javascript validation, ... would run with no 404 error
Do I miss anything or make something wrong?
here're the steps that i did to publish my site
open terminal and run dotnet publish --configuration Release
copy publish folder in bin\Release\netcoreapp2.2\publish to the publish folder in IIS setting
open IIS and add application pool with .net CLR version is No managed code
add website with application pool above, bind type is https, hostname is localhost, and tick all 3 checkboxes (Require server name indication, Disable HTTP/2, disable OCSP Stapling), SSL certificate is IIS Express Development Certificate
I forgot the page that guided me those steps
I myself have found the cause. The reason that the web app return a 404 page when I post something to backend to process database is I used windows authentication in my database connection string. So it couldn't access the database when I publish to IIS. When i change connection using sql server authentication, it works properly
I am using vue + netlify for a small web app that uses netlify functions I built. Everything works fine in production (when I commit to master and netlify auto-deploys based on my master branch) but when I try to use netlify dev to spin up a local development instance, calls to the netlify function are failing:
VM23:1 POST http://localhost:18002/.netlify/functions/customfunction 404 (Not Found)
Clearly the endpoint in the dev enironment is not the same, but how do I know what that endpoint may be? In the console when running the netlify dev command it says that the lambda server is listening on 3467... but trying to use endpoint http://localhost:34567/.netlify/functions/customfunction results in a CORS error. Any help here would be appreciated!
you might be getting the CORS error because your server is not running on the same host with your vue app and to fix this you have to set a proxy and for that you need to create a vue.config.js file on the project directory (not the vue folder) then past the following code:
module.exports = {
devServer: {
proxy: 'http://localhost:34567' // the port your server in running on
}
}
now your proxy is set so your request URL will the following :
/.netlify/functions/customfunction
Doc reference : https://cli.vuejs.org/config/#devserver-proxy
I created this simple dynamic web project (glassfish 4.1.1 latest atm) using eclipse java ee Mars.2 that I installed 2 days ago.
Checking on the admin, the app is deployed and running fine. I could not access the web app using the localhost:8080 url but it works when I use <computername>:8080.
I could access the admin using localhost:4848.
I tried disabling the firewall but the problem persists. What could be the problem?
The error is:
404 Not Found
No context found for request
In eclipse I see the log int he console that says: Automatic timeout occurred
As I pointed out in comments, you can configure listeners in Configuration -> needed configuration -> Network Config -> Network Listeners. However, it is still rather strange that your localhost doesn't work with 0.0.0.0 IP address, since it is a special address which means "listen on all available IPs on given port". Perhaps your network is somehow misconfigured.