как исправить ошибку "net :: ERR_SSL_SERVER_CERT_BAD_FORMAT" в vuejs и nodejs при использовании https

Question

У меня есть некоторый код для отправки запроса https в vue.js, и при использовании методов действий в vuex для отправки запроса https я получаю эту ошибку в консоли

GET https://localhost/api/getpeople net:: ERR_SSL_SERVER_CERT_BAD_FORMAT

мой код:

vue.js table.js

 import Axios from "axios";

 let state = {
people: []
  };

     let getters = {
     getPeople(state) {
         return state.people;
    }
}

      let mutations = {

    setPeople(state, people) {

          state.people = people
        }

       }

            let actions = {
            sendHttpReq({ commit }) {
             Axios.get('https://localhost:443/api/getpeople').then(response=>response.data).then(result=>{
                   commit('setPeople',result);
               }).catch(error=>{
             console.log(error.response)
        })
    }
}

    export default {
       state,
        getters,
        mutations,
       actions
              }

Сторона сервера Node.js:

let express=require('express');
  let cors=require('cors');
  let https=require('https');
  let pem=require('pem');
  let mydb=require('./mydb')
  pem.createCertificate({days:1,selfSigned: true},(err,keys)=> {

if (err)
    return err;


let app = express();
app.use(express.json());
app.use(cors());
app.post('/api/setPeople', (req, res) => {
    let body = req.body;
    mydb.insert(body.firstName, body.lastName, body.phone, (result) => {
        res.status(200).send(result)
    });


});
app.get('/api/getpeople', async (req, res) => {
    mydb.getPoeple((result) => {
        console.log(result);
        res.status(200).send(result)
    });
});

https.createServer({key: keys.serviceKey, cert: keys.certificate}, app).listen(443, () => {
    console.log('server is run ' + 443);
});

  })

это код, отправляющий запрос https и получающий ответ, который задается людям, а другой код отображает людей в таблице. другой код правильный, но проблема из этого кода

Я получаю console.log (key.certificate) и получаю следующий результат:

-----BEGIN CERTIFICATE----- MIICpDCCAYwCCQD1yVw3YCtIUDANBgkqhkiG9w0BAQsFADAUMRIwEAYDVQQDDAls b2NhbGhvc3QwHhcNMTkxMDA2MTgxNzE3WhcNMTkxMDA3MTgxNzE3WjAUMRIwEAYD VQQDDAlsb2NhbGhvc3QwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEKAoIBAQDc e+2PKex1g7qkKljtWD9JgP7MBgL/YTsmMj3TGtn1cmV0415jb8tSJZi8x8zJwudY pDAjxk4bCRud0maV4Ag3LNSC8R+GrVpMd5oPzFI9crATf5OHzyJWhb3qYAutkw3s GB78q9VoFZygwV7LF2nAU61z6VS/mwECohEoJUvUSvcMmt4Qa3IBrFxpJhf5K6B8 kLRYzhM/FpRxBGql9vuSYZWIpgWTpOIdUNwUtDejNE35CzrV8fhKzQWVEPQUSX3D 7wJVIa5YBtJnxmPAIthiDTR6Z/N8VTccWJgWXxJsJ8qxIl1jn3xkOvaGRo2PyeVW +baSzEu6jYYkcSWj6DWJAgMBAAEwDQYJKoZIhvcNAQELBQADggEBABe9xrSwiJqW TUpgjc2mhXjsFlAZ9E1tkd3X+rayqfT236fsqtI0oifbCHtcSVGAxS9mu8rrSjLr uLOA8Guiod+pLvyizf1vZHYX6PAFiUOrOSj6i1IPN911yhMTrD1c9F1nHGuaklSv De+A5Vqu0VZdoZx2mtfZthILerqBr/iSMweeTdrTOedbLz9+AbtrEpowEUedytH0 kOpljE0ndoPoqY7Q/CbZq8GlI6Zg504wDuYhUcFAnPgAoY+MWhP/+wquCbnlQfVD /DlWQh51Y+rpUghrf3GNenF58StvD7XpYIwCItpw2F3eWluB8QfDoRJ9rVTtEevA S+44fP5pe4U= -----END CERTIFICATE-----

Answer 1

Взяв сертификат PEM, показанный в вопросе, можно сделать openssl x509 -text и посмотреть:

Certificate:
    Data:
        Version: 1 (0x0)
        ...
    Signature Algorithm: sha256WithRSAEncryption
        Issuer: CN=localhost
        ...
        Subject: CN=localhost

Таким образом, это сертификат X509v1, выданный для localhost. У него нет расширения Subject Alternative Names, как того требует Chrome. Только сертификаты X509v3 могут иметь такие расширения, и они должны быть специально настроены. Документация для pem содержит примеры того, как создавать сертификаты с необходимыми расширениями.

Answer 2

axios выполняя GET запрос, вы должны отправить данные в URL

axios.get('/user?ID=12345')
  .then(function (response) {
    // handle success
    console.log(response);
  })
  .catch(function (error) {
    // handle error
    console.log(error);
  })
  .finally(function () {
    // always executed
  })

и выполнить POST запрос

axios.post('/user', {
    firstName: 'Fred',
    lastName: 'Flintstone'
  })
  .then(function (response) {
    console.log(response);
  })
  .catch(function (error) {
    console.log(error);
  });

теперь в своем коде, который вы отправляетеPOST-запрос и объект для отправки, вы должны использовать

Axios.post('https://localhost:443/api/getpeople',{ withCredentials: 
             true}).then(response=>response.data).then(result=>{
                   commit('setPeople',result);
               }).catch(error=>{
             console.log(error.response)

для GET-запроса

Axios.get('https://localhost:443/api/getpeople').then(response=>response.data).then(result=>{
                   commit('setPeople',result);
               }).catch(error=>{
             console.log(error.response)