WP Sage - Browsersync proxyUrl not working - wordpress

Just wondering if anyone can help me on an issue I’ve been having with Browsersync issues with the Sage theme for Wordpress.
In terms of my environment, I’m using Laravel Valet, which is parked in a projects directory on my machine. The site in question is in this projects direct on a .test domain and has a self signed SSL cert from Valet.
Running yarn build successfully builds the site, however when running yarn start, the files build and successfully build every time I change a JS/SCSS file with Browsersync showing DONE Compiled in 284ms... however Browsersync is failing to proxy the valet URL, as when I go to https://localhost:3000, Chrome loads for an extremely long time and then throws ERR_TIMED_OUT. Tried in other browsers and get the same issue.
There is no firewall blocking that port, as tried with another app which works successfully
Tried with and without self signed cert from Valet, and tried http and https links from Browsersync
Tried deleting node_modules and running npm install
Tried changing the URL of the site
Tried a different proxyUrl in config.json
devUrl is definitely correct
publicPath is definitely correct as it’s building the files
Browsersync doesn’t throw any errors
Someone on the Sage Discourse recommended downgrading browsersync too but that didn't work 😞
Been looking at this for two days now and just hopelessly Googling… so just seeing if anyone has had this issue before?
Cheers!

Related

Issues not working on private gitlab instance

I have gitlab running behind a nginx reverse proxy on a relative url (my.domain.com/gitlab/) in a docker container. I've migrated some of my projects from Github and everything seemed fine. However when I tried to see details for an existing issue, which was migrated with the project, the website didn't load. It looked like the reverse proxy was routing back to <server-ip-address>:<port> again, instead of the url. I also tested what happens when I create a new issue, because I thought maybe the migration didn't work, but it had the same effects. After a bit more testing I figured that typing in the issue-number in the url works though e.g. my.domain.com/gitlab/group-name/project-name/-/issues/4.
I'm really confused now, whether this is a problem with nginx or gitlab itself. Did anyone have similar issues?
Gitlab-Version: gitlab/gitlab-ce:14.10.0-ce.0
Nginx: nginx:1.21.6-alpine
I just downgraded Gitlab to version gitlab/gitlab-ce:14.9.4-ce.0 and it works. So I guess this is a problem with the other version and has absolutely nothing to do with docker or nginx.

CSS no longer applying with keter and nginx reverse proxy setup

Problem: CSS was being applied to the site but after switching to reverse proxy and adding a security cert while changing nothing else, the CSS no longer loads.
Details: Initially the website was using keter only with no security cert or reverse proxy. The site worked fine as intended. The yesod-devel command correctly renders the site. Once compiled, the styling does not appear on the final site. Before the switch to reverse proxy, everything worked as desired. No other changes were made except to config files related to the reverse proxy and security cert.
Dependencies: The dependencies are at this https://gist.github.com/xave/9cdf396c1918c129aff927ab8999d456.
Workflow: The main dev machine is macOS. The server is Ubuntu. The workflow is to develop and preview on macOS, then to compile and deploy on Ubuntu.
Thoughts:All the CSS is on the page upon inspection. It just isn’t applying. This is true for multiple browsers and even for people who had never before visited the site (so not a caching issue).
Any help would be appreciated and please let me know if you need additional information.

fetch 404 while loading jpg Failed to load resource: the server responded with a status of 404 ()

I have deployed my nodejs based react application to digital ocean also i have used the cloudflare for ssl and dns hosting. My project has using google workbox and lru-cache. I have made nginx settings in the digitalocean ubuntu droplet.
Everything oke except the .jpg,.jpeg product images doesnt loading browser and giving me this error
iam showing in chrome like that
i will solve this error but i couldnt understand interesting with what
After some searching i concern about where is my image files in ubuntu and it has right permission to seen (chod x +R) for internet public users. Can they read my files. But i have suppresed with there is no any file in that directory. Couse ubuntu doesnt give me my process to write permisson when i uploading my jpg files with fs.sysnc
Edited:
After i seen that is interested with nginx settings which has looking another directory, i have corrected that and everything worked out!

Google Chrome localhost error NET::ERR_CERT_AUTHORITY_INVALID without option to dismiss

I am developing a website using Roots.io stack (Trellis + Bedrock + Sage).
I am working, locally, on several sites and they're all working fine. Until today I reboot my computer > execute vagrant up > attempt to access the local development URL https://mysite.dev > but suddenly get an error, in Chrome, stating "NET::ERR_CERT_AUTHORITY_INVALID".
Normally, I do get a similar error, but I have the option to dismiss it. But now I do not.
Via BrowserSync, I can access the site via localhost:3000 but not using the development URL.
If you're familiar with Roots, you know that Trellis generates the SSL locally as self-signed in an automated process. So I know very little about how it works outside of their documentation.
I understand that this issue seems to be a mix-match with the SSL certificates locally, but I don't really know how to troubleshoot that. I'm thinking there is a file locally that needs to be deleted and replaced. But I don't know how to generate a replacement if that's the case.
I have spent about an hour reading any articles I could find on the topic but none seem to really explain precisely what's going on in a way I can apply.
Update: Ultimately I'm looking for a way to add an exception for the ticket in Chrome. I was able to do it in Firefox and it's working there.
Thank you.
Short Answer: Don't use .dev extensions in your local URLs as this is now a real domain name extension no longer reserved for localhost.
Long Answer: https://ma.ttias.be/chrome-force-dev-domains-https-via-preloaded-hsts/
You can either
Import this certificate using Chrome's Options > Manage Certificates > Import
Or simply ignore SSL errors launching chrome with args --ignore-certificate-errors like /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --ignore-certificate-errors &> /dev/null & (not recommended).

PhpStorm + WordPress Project + "502 Bad Gateway error"

I have used WordPress on Cloud9 successfully previously, but I can't even get a new one to start via JetBrains IDE.
I have two machines: one Windows (XAMPP) and one Mac (MAMP) and getting the same "502 Bad Gateway" error when the browser tries to login to the WordPress dashboard page.
I downloaded a fresh WordPress copy, set up my database and ran index.php in the WordPress root folder. That does take me through the database questionary and up to the WordPress login page, and then the browser hangs there. It tries to load something and nothing happens. If I halt the browser and refresh, I'll get the 502 error and I'll keep getting this error on ANY OTHER files that I try to run from now on (it feels like something server-related breaks from within the IDE and I have to restart it).
The PHP 7 interpreter seems to be working fine, because I don't have an issue running any other of my non-WordPress projects.
The project address is http://localhost:63342/wordpress/, but I noticed this below link is shown in the PHP-CGI server window:
/Applications/MAMP/bin/php/php7.0.0/bin/php-cgi -e -b 127.0.0.1:56502
Does this PHP CGI pointing to a different port number mean anything? I am new to WordPress and it was a breeze starting one in Cloud9, but I just don't understand why it doesn't work in PhpStorm 10.
As I said, there is the same problem on two machines (Windows, Mac, MAMP, XAMMP, and PhpStorm), so I know it is me who's missing something here.
I recommend you use Varying Vagrant Vagrants WordPress (VVV).
It's a better solution and will help you achieve better results without too much hassle.
I would recommend you to use a simple editor like Sublime Text or Atom and install packages. I have personally lost many hours trying to get PhpStorm, MAMP, LAMP, and XAMPP work the way they should.
I managed to solve my problem. It was the port number causing it to crash. My MAMP port number is 8888 (XAMPP is 80) and when I set up PhpStorm a year ago on both machines somehow I entered 63342 as server port number!
This never created any problem for me whatsoever running dozens of PHP projects since then, but obviously, it mattered to WordPress (dashboard). I went to PhpStorm settings and corrected the port number so it matches MAMP/XAMPP and all is working fine now.
It was a pretty basic (and silly) mistake to make on my part, but that wasted two full days in which I could have been teaching myself WordPress and developing themes/plugins.
Yes, it worked for me after configuring the built-in server port to 80 (I have used XAMPP)
Setting steps in phpstrom: Configure the built-in web server

Resources