网站正常访问，但接口地址http可以成功，https却无法跑通

Question

我的项目环境如下：

服务器 Linux CentOS
后端接口 Node
前端页面 Vue
请求 Axios

---

域名可以正常访问，如下：
http://www.bdtime.online/
https://www.bdtime.online/

---

通过 Node 写好的接口端口为 3000，接口地址为：

http://www.bdtime.online:3000/axios
https://www.bdtime.online:3000/axios

但此时问题出现了 http 可以请求成功，且浏览器直接访问成功返回 “get request”
使用浏览器访问 https 接口地址，浏览器提示 “此网站无法提供安全连接”，请求 https 接口报错，如下：

Error: Network Error
    at createError (createError.js?2d83:16)
    at XMLHttpRequest.handleError (xhr.js?b50d:84)
POST https://www.bdtime.online:3000/axios net::ERR_SSL_PROTOCOL_ERROR

---

不确定是否是我 Nginx 的配置问题，我的配置如下：

    server {
        listen       80;
        listen       443 default ssl;
        
        server_name  bdtime.online www.bdtime.online;
        
        ssl_certificate     /www/online.crt;
        ssl_certificate_key /www/online.key;
        
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
        ssl_ciphers ECDHE-RSA-AES256-SHA384:AES256-SHA256:RC4:HIGH:!MD5:!aNULL:!eNULL:!NULL:!DH:!EDH:!AESGCM;
        ssl_prefer_server_ciphers on;
        ssl_session_cache shared:SSL:10m;
        ssl_session_timeout 10m;

        charset utf-8;

        #access_log  logs/host.access.log  main;

        location / {
            root   /www/html;
            index  index.html index.htm;
        }
}

后端接口代码，如下：

const express = require('express')
const app = express()

app.all('*', (req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*')
  res.header('Access-Control-Allow-Headers', 'content-type') 
  res.header('Access-Control-Allow-Methods', 'DELETE,PUT,POST,GET,OPTIONS')
  if (req.method.toLowerCase() == 'options')
    res.sendStatus(200)
  else
    next()
})

app.get('/axios', (req, res) => {
  res.send('get request')
})

app.post('/axios', (req, res) => {
  res.send('post request')
})

app.listen(3000, () => {
  console.log('server start success')
})

前端页面代码，如下：

<template>
  <div
    class="hello"
    @click="submit"
  >测试</div>
</template>

<script>
import axios from 'axios'
export default {
  methods: {
    submit () {
      axios.post('https://www.bdtime.online:3000/axios').then((res) => {
        console.log(res)
      }).catch(err => {
        console.log(err)
      })
    }
  }
}
</script>

---

还望各位大佬指点迷津，谢谢!

Answer 1

你用这个nginx配置试试，看能不能访问:https://www.bdtime.online/api...

 server {
        listen       80;
        listen       443 default ssl;
        
        server_name  bdtime.online www.bdtime.online;
        
        ssl_certificate     /www/online.crt;
        ssl_certificate_key /www/online.key;
        
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
        ssl_ciphers ECDHE-RSA-AES256-SHA384:AES256-SHA256:RC4:HIGH:!MD5:!aNULL:!eNULL:!NULL:!DH:!EDH:!AESGCM;
        ssl_prefer_server_ciphers on;
        ssl_session_cache shared:SSL:10m;
        ssl_session_timeout 10m;
        charset utf-8;
        location / {
            root   /www/html;
            index  index.html index.htm;
        }
        location ^~/api {
             proxy_http_version 1.1;
             proxy_set_header Upgrade $http_upgrade;
             proxy_set_header Connection "upgrade";
             proxy_set_header Host $host;
             proxy_set_header X-Nginx-Proxy true;
             proxy_cache_bypass $http_upgrade;
             proxy_pass http://nodeapi; #反向代理
        }
}
upstream nodeapi {
    server 127.0.0.1:3000;
    keepalive 64;
}

如果你要3000端口https访问，那参考以下

var express = require('express');
var app = express();
var http = require('http');
var https = require('https');

http.createServer(app).listen(3001, "0.0.0.0");

const options = {
  key: fs.readFileSync('./key/key.pem'), //注意文件路径
  cert: fs.readFileSync('./key/cert.pem')//注意文件路径
};

https.createServer(options, app).listen(3000, '0.0.0.0');