nginx添加ssl证书后http无法访问原因及解决方法

博客网站的nginx服务器接入ssl证书后提高了数据交互的安全性，但最近发现在http协议下访问网站出现了跨域访问的问题导致后端接口无法被调用。原因是在http协议下访问的是80端口，调用后端接口访问的是443端口所以产生了跨域问题。
跟随网上教程将ssl on去掉并将listen 443改为listen 443 ssl，失败。
索性不用80端口了，在nginx中配置更改为接收到80端口的请求后强制跳转到443端口。

原配置文件：

server {
    listen 80;
    listen      443 ssl;
    server_name jhxblog.cn www.jhxblog.cn;

       # ssl证书地址
    xxx

    # ssl验证相关配置
    xxx

    location / {
        root    /data/xbblog/view/build;
        index index.html index.htm;
		try_files $uri $uri/  /index.html;
    }
xxx
}

更改后的配置文件

server {
    listen      443 ssl;
    server_name jhxblog.cn www.jhxblog.cn;

       # ssl证书地址
    xxx

    # ssl验证相关配置
    xxx

    location / {
        root    /data/xbblog/view/build;
        index index.html index.htm;
		try_files $uri $uri/  /index.html;
    }
xxx
}
server {
   listen       80;
   server_name  jhxblog.cn www.jhxblog.cn;
   return 301 https://$server_name$request_uri;
}

原文链接： https://www.jhxblog.cn/#/home/read?articleid=31