SSL Protocol Error on localhost?!

General
1

Trying to run strapi on localhost using yarn start.

However when trying to reach the admin panel I see SSL protocol error. I’ve tried clearing SSL state checking clock settings and all the usual stuff. I can’t even launch yarn develop… still happens?!

2

Either a) you have a proxy forwarding the traffic or b) your browser is doing this.

How are you accessing the admin (whats in the url bar)

3

I’m having the same issue where I’ve separated the front and back ends as suggested in the documentation, but get a ERR_SSL_PROTOCOL_ERROR when trying to connect the two in a local environment. I realize normally they are separated for deployment, but I’m attempting to separate the two to embed the front end into another React application. Here is my config/server.js file:

module.exports = ({ env }) => ({
  host: env('SERVER_HOST'),
  port: env.int('SERVER_PORT'),
  url: 'https://localhost:1337',
  admin: {
    url: '/',
    serveAdminPanel: false,
    auth: { secret: env('ADMIN_JWT_SECRET')},
  },
});

In the URL bar, I have verified the server is running at localhost:1337 without the admin panel accessible. The front end, I am opening the index.html file from the build, but get the error. Any ideas?

4

You need to delete this key or set it to http://....

It’s not possible to mount the admin on the root right now

1 Like
5

@DMehaffy Thank you, that helped!

Here’s the basic steps I took in case anyone is looking for the solution in the future:

Basic outline for separating Strapi front and back ends (LOCAL ENV ONLY), then running each separately, yet connected:

  1. Install a local version of Strapi
  2. Modify the Strapi config/server.js file to the example at the bottom of this comment
  3. Create a front end build running “npm run build” in your Strapi directory.
  4. Start the back end server with the same server.js settings you altered. Navigate to http://localhost:1337. A display should appear in the browser telling you the server is running, however the link to the admin panel UI no longer exists.
  5. Copy the build folder and its contents (The front-end)
  6. Paste the build folder into a different directory of your choice
  7. Globally install the npm package named “serve”
  8. Navigate to the directory of your new front-end location in the CLI (but not to the build folder)
  9. Run “serve -s build” → It should take the build folder generated and serve the contents of the admin panel connecting it to the back end!!

module.exports = ({ env }) => ({
host: env(‘SERVER_HOST’),
port: env.int(‘SERVER_PORT’),
url: ‘http://localhost:1337’,
admin: {
url: ‘/’,
serveAdminPanel: false,
auth: { secret: env(‘ADMIN_JWT_SECRET’)},
},
});