踩坑：云服务器Nginx部署前端遇到http与https问题

南波万Zzz

已于 2022-11-13 20:41:45 修改

阅读量1.1k

点赞数

于 2022-11-09 22:42:45 首次发布

本文链接：https://blog.csdn.net/weixin_45274132/article/details/127779548

版权

问题：nginx部署前端项目，修改配置文件路径后，页面一直无法加载css、js、img

解决：看了一堆博客都没有解决，最后是发现https访问的css、js等资源导致。

解决方案1：:如果没理解错的话，云服务器nginx需要配置ssl证书才能通过https访问，看了下腾讯云服务器ssl证书好像还得花钱买，免费的ssl证书不支持直接ip绑定，刚申请的服务器没绑定域名，放弃这个解决方案。

解决方案二：将前端代码里面的强制https访问删除，删除后通过http访问，成功解决问题！

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

南波万Zzz

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
踩坑：云服务器Nginx部署前端遇到http与https问题

云服务器Nginx部署前端遇到http与https问题
复制链接

扫一扫

Nginx:天翼云Linux服务器部署&静态资源部署&gzip压缩

席木木的博客

07-16

613

Nginx:天翼云Linux服务器部署&静态资源部署&gzip压缩，首先介绍天翼云服务器Nginx安装步骤已经踩坑记录，其次，以CesiumLab切分的3DTiles瓦片为例，利用nginx作为静态资源管理服务器，进行静态资源部署，服务访问测试；最后，对Nginx进行gzip压缩配置，进行服务访问速度的优化。

web服务器nginx+部署前端vue项目

03-22

### Nginx 与前端 Vue 项目的部署 #### 一、Nginx 概述 Nginx 是一款广泛使用的高性能 HTTP 和反向代理 web 服务器。它以其出色的并发处理能力和较低的内存消耗而闻名。根据相关报告，Nginx 能够支持高达 50,000 ...

参与评论您还未登录，请先登录后发表或查看评论

Docker + Jenkins + Nginx实现前端自动化部署

热门推荐

编码世界

11-30

4万+

文章有点长，如果你是以学习的态度来看这篇文章，建议收藏起来慢慢看。前端自动化部署一直以来概念很清楚知道怎么回事，但是其中怎么操作没怎么研究过，虽然之前环境都搭起来了，但是也只是Jenkins构建项目成功，比如提交代码之后怎么触发自动构建，打包后的文件如何迁移到指定服务器的文件目录下，流水线如何搞等等这都是我之前想想头疼也只能头疼的问题。终于还是费了点心思搞了搞自动化部署，又花了大量时间来记录这个过程。

Linux系统下安装nginx部署vue前端静态资源(踩坑)

m0_57176999的博客

10-19

310

linux，nginx，yum，wget，vue.js

踩坑:nginx代理服务器报500错误

叶叶叶叶大爷的博客

06-01

3万+

近期公司开发官网,使用react dva antd 架构,打包后成静态资源文件,在阿里云服务器上面部署nginx作为静态服务器,一切配置好后,按照nginx的配置静态资源地址进行部署,发现最后服务器一直报500错误 nginx的配置文件是在nginx.conf中引入了2个配置文件,一个是admin,一个是default, admin的配置如下: server { listen...

Nginx 踩坑笔记: 部署 React/Vue 前端应用路由 404 Not Found(Error: 404 Not Found | Nginx 1.21.6)

超悠閒的博客

03-03

3385

Nginx 踩坑笔记: 部署 React/Vue 前端应用路由 404 Not Found(Error: 404 Not Found | Nginx 1.21.6) 文章目录Nginx 踩坑笔记: 部署 React/Vue 前端应用路由 404 Not Found(Error: 404 Not Found | Nginx 1.21.6)0. 项目背景1. 问题描述2. 问题排查 & 解决方案解决方案附录：示例项目运行文档参考连接 0. 项目背景 React/Vue 等 SPA 前端应用使用 hist

react及vue前端项目使用history路由部署nginx 404踩坑问题

cdy_1的博客

07-08

807

这么一看是不是觉得没啥问题了，但是但是问题来了，结果虽然是跳转我项目的index.html了，但还是没匹配到我的路由，比如我跳转home页，他给我跳转我项目自己的404页了，出现了下面这个玩意儿。但是由于我的比较特殊，我是部署多个项目的也就是说文件结构是下面这种，像刚才那种配置的话就会跳转到根目录的index.html了，显然不是我想要的。我的配置就是这样，然后就好了，所有针对部署多个项目的情况应该这么配置，注意这个名字要和nginx里的那个文件夹名字一样。一种是哈希路由，其原理就是通过哈希值跳转。

《Docker》阿里云服务器docker部署nginx并配置https踩坑记录（完整）

Oliver尹的博客

12-11

3431

今天在为阿里云服务器续期的时候发现原来阿里云上面也可以申请免费的ssl证书，而博主平时玩耍的域名一直是http的方式访问的，于是，很自然的想搞一个证书，将http改为https；才有了本文这篇踩坑记录，耐心看完，你也许有所收获；

阿里云nginx配置https踩坑(配置完后访问显示无法访问此网站)

yueye_wu的博客

06-04

1374

阿里云nginx配置https踩坑(配置完后访问显示无法访问此网站)

服务器上部署前端Vue项目代码

weixin_43977534的博客

03-30

4349

服务器上部署前端Vue项目代码

使用nginx部署前端项目（超详细教程）.pdf

04-29

【使用Nginx部署前端项目】的教程是一个详尽的指南，主要面向初学者，旨在教会读者如何利用Nginx高效地部署前端应用。Nginx是一个高性能的Web服务器和反向代理，因其高并发处理能力和低内存占用而受到广泛青睐。 ...

windows服务器部署 nginx+tomcat+mysql服务器端部署阿里云服务器部署及配置

04-28

详细说明了windows服务器nginx+tomcat+mysql部署及配置（配置阿里云后台安全组，配置域名）很适合新手学习附件中包含： 1.操作说明文档 2.操作录屏 3.安装所用到的软件安装包 1)Windows Server 2019 数据中心版 ...

uwsgi+nginx在阿里云服务器部署django项目完整操作文档

05-17

uwsgi+nginx在阿里云服务器（系统ubuntu20.04）部署django项目完整操作文档，本人实测，根据本文档操作绝对OK，所有该踩得坑都已经踩过，文档内包含部署所需的配置文件，附带详细注释。

云原生k8s集群中部署微服务项目前端代理服务 Nginx

09-22

image: nginx:latest ports: - containerPort: 80 ``` 部署完成后，为了使外部流量能够访问到Nginx，我们需要创建一个Service对象。Service定义了如何访问Pod的策略，可以是ClusterIP（内部访问）、NodePort...

使用腾讯云域名解析实现网站重定向

weixin_59271089的博客

08-02

396

最近，在CSDN平台上我写了一系列博客，希望能与同学分享一些技术心得。然而，每当需要向他人推荐我的博客时，那串复杂且缺乏规律的CSDN博客首页域名总让我感到不便。这让我开始思考，如果能将这一域名替换为一个既个性化又便于记忆的新域名，无疑会提升博客的辨识度和用户体验，使得分享与交流变得更加顺畅。

国标GB/T28181视频转S3云存储，支持阿里云OSS、腾讯云COS、天翼云存储，视频转云存大大降低运营商项目运营成本

Babosa的专栏

08-04

132

分散点位的视频进行集中的云存储，既能够方便视频录像的集中管理，又能够降低运营成本和录像丢失的风险！对于有带宽资源和云存储资源的厂商来说，是一个极佳的方案！

计网：http/1.1、http/2和http/3的改变和优化

qq_64680177的博客

08-04

819

所以http/1.1从原本的短连接改为了长连接，由请求头中的Connection字段来指定连接类型，当它的值为Keep-Alive时就为长连接。开启了 HTTP Keep-Alive 机制后，连接就不会中断，而是保持连接。当客户端发送另一个请求时，它会使用同一个连接，一直持续到客户端或服务器端提出断开连接。当然如果某个 HTTP 长连接超过一定时间没有任何数据交互，服务端就会主动断开这个连接

http相关