DevKinsta with Browsersync

sage
,
1

Hello, I’m in the process of switching over from a legacy MAMP setup to using DevKinsta which utilizes Docker.

I have my config.json configured as follows:

{
  "entry": {
    "main": [
      "./scripts/main.js",
      "./styles/main.scss"
    ],
    "customizer": [
      "./scripts/customizer.js"
    ],
    "gutenberg": [
      "./scripts/gutenberg.js",
      "./styles/gutenberg.scss"
    ]
  },
  "publicPath": "/mywebsite/wp-content/themes/mytheme",
  "devUrl": "https://mysiteurl.local",
  "proxyUrl": "http://localhost:3000",
  "cacheBusting": "[name]_[hash:8]",
  "watch": [
    "app/**/*.php",
    "config/**/*.php",
    "resources/views/**/*.php"
  ]
}

This results in the site being available at https://localhost:3000/ but throws security exceptions since the certificate is for https://mysiteurl.local. I’m close but seem like I’m missing something obvious.

Screen Shot 2021-05-05 at 6.34.01 PM

Any insight as to how I can get the browsersync to work at https://mysiteurl.local:3000 as expected would be appreciated.

Thanks,
Dan

2

BrowserSync acts as a HTTPS proxy. Similar to Squid3 as HTTPS proxy, it uses its own self-signed certificate.

So with the default setup you have to dismiss the warning in browser.

When you want to configure this “properly”, you have to provide BrowserSync a cert sign key and cert that is trusted by your device (added to the browsers and system trust stores).

You could go even further and use your own self-hosted, local CA like small-step and create an intermediary private key for BrowserSync.

1 Like