02课程发布模块之部署Nginx

news2024/12/24 7:16:37

部署Nginx

部署网关

通过Nginx访问后台网关,然后由网关再将请求转发到具体的微服务,网关会把请求转发到具体的服务

upstream gatewayserver{
	server 127.0.0.1:63010 weight=10;
} 

# 网站首页对应的虚拟机
server {
    listen       80;
    server_name  www.51xuecheng.cn localhost tjxt-user-t.itheima.net;
    // .....................

	location /api/ {A
		proxy_pass http://gatewayserver/;
	} 
}

修改前端文件的网关地址
在这里插入图片描述

部署教学机构管理页面

upstream uidevserver{
   server 127.0.0.1:8601 weight=10;
}
# 教学机构页面对应的虚拟机
server {
    listen       80;
    server_name  teacher.51xuecheng.cn;
    #charset koi8-r;
    ssi on;
    ssi_silent_errors on;
    #access_log  logs/host.access.log  main;
    #location / {
        #   alias   D:/itcast2022/xc_edu3.0/code_1/dist/;
        #   index  index.html index.htm;
        #}
    location / {
        proxy_pass   http://uidevserver;
    }

    location /api/ {
        proxy_pass http://gatewayserver/;
    } 
}

在这里插入图片描述

部署网站首页

因为页面需要加载一些css、js、图片等静态资源所以需要借助Nginx访问静态页面,同时对于一些动态资源的请求也需要由Nginx代理访问防止跨域

在这里插入图片描述

第一步: 修改本机(Windows)C:\Windows\System32\drivers\etc目录下的hosts文件,Centos7操作系统的hosts文件在/etc目录下

  • 前后端联调时将前端中原本指向后台网关的地址更改为Nginx的地址
# 输入域名时需要找域名对应的服务器的IP地址,此时会先从host文件中找,如果没有配置请求dns服务器去找
127.0.0.1 www.51xuecheng.cn 51xuecheng.cn ucenter.51xuecheng.cn teacher.51xuecheng.cn file.51xuecheng.cn

第二步: 在nginx.conf文件中指定前端工程xc-ui-pc-static-portal所在的路径,修改完配置文件后需要执行命令重新加载Nginx的配置文件

# 重新加载Nginx的配置文件
nginx.exe -s reload
# 网站首页对应的虚拟机
server {
        listen       80;
        server_name  www.51xuecheng.cn localhost;
        #rewrite ^(.*) https://$server_name$1 permanent;
        #charset koi8-r;
        # 引入页头页尾
        ssi on;
        ssi_silent_errors on;
        #access_log  logs/host.access.log  main;
        location / {
        	# 绝对路径
            alias   D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal/;
            index  index.html index.htm;
        }
        # 静态资源,目录以/结尾
        location /static/img/ {  
                alias  D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal/img/;
        } 
        location /static/css/ {  
                alias   D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal/css/;
        } 
        location /static/js/ {  
                alias   D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal/js/;
        } 
        location /static/plugins/ {  
                alias   D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal/plugins/;
                add_header Access-Control-Allow-Origin http://ucenter.51xuecheng.cn;  
                add_header Access-Control-Allow-Credentials true;  
                add_header Access-Control-Allow-Methods GET;
        } 
        location /plugins/ {  
                alias   D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal/plugins/;
        } 

        #error_page  404              /404.html;
        # redirect server error pages to the static page /50x.html
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

        # proxy the PHP scripts to Apache listening on 127.0.0.1:80
        #location ~ \.php$ {
        #    proxy_pass   http://127.0.0.1;
        #}

        # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
        #
        #location ~ \.php$ {
        #    root           html;
        #    fastcgi_pass   127.0.0.1:9000;
        #    fastcgi_index  index.php;
        #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
        #    include        fastcgi_params;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
        #location ~ /\.ht {
        #    deny  all;
        #}
    }

第三步: 启动Nginx并访问http://www.51xuecheng.cn查看首页
在这里插入图片描述

部署课程详情页面

访问http://www.51xuecheng.cn/course/course_template.html查看课程详情页面,该页面是静态页面还没有使用freemarker提供的标签

  • Nginx监听到静态资源请求/course/course_template.html时就会去xc-ui-pc-static-portal\course\课程目录下找对应的文件

在这里插入图片描述

部署文件服务器

在进行课程预览时需要展示在MinIO文件系统存储的课程图片和视频,这里我们可以统一由Nginx代理,然后通过文件服务域名统一访问

在这里插入图片描述

第一步: 修改本机(Windows)C:\Windows\System32\drivers\etc目录下的hosts文件增加文件服务的域名解析

127.0.0.1 file.51xuecheng.cn

第二步: 在nginx.conf配置文件中配置要代理的文件服务器的地址,配置完毕后重新加载nginx配置文件

  # 文件服务
  upstream fileserver{
    server 127.0.0.1:9000 weight=10;
  } 
  # 增加一个文件服务的虚拟主机,同样监听80端口
   server {
        listen       80;
        server_name  file.51xuecheng.cn;
        #charset koi8-r;
        ssi on;
        ssi_silent_errors on;
        #access_log  logs/host.access.log  main;
        location /video {
            proxy_pass   http://fileserver;
        }

        location /mediafiles {
            proxy_pass   http://fileserver;
        }
   }

第三步: 访问http://file.51xuecheng.cn/mediafiles/图片在Minio的存储地址展示在Minio文件系统中存储的图片

在这里插入图片描述

部署播放视频页面

在课程详情页面中点击马上学习或课程目录下的小节的名称可以打开对应的视频播放页面learning.html

在这里插入图片描述

第一步: 首先在nginx.conf配置文件中配置视频播放页面的地址,配置完毕后重新加载nginx配置文件

# 网站首页对应的虚拟机
server {
    listen       80;
    server_name  www.51xuecheng.cn localhost;
    //....

    location /course/preview/learning.html {
        alias D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal/course/learning.html;
    } 
    location /course/search.html {  
        root   D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal;
    } 
    location /course/learning.html {  
        root   D:/itcast2022/xc_edu3.0/code_1/xc-ui-pc-static-portal;
    } 
}

第二步: 在learning.html视频播放页面的videoObject对象的定义处配置viedo属性指定为我们在Minio文件系统中存储的视频地址

data: {
    videServer:'http://file.localhost',
    courseId:'',
    teachplanId:'',
    teachplans:[],
    videoObject : {
        container: '#vdplay', //容器的ID或className
        variable: 'player',//播放函数名称
        poster:'/static/img/asset-video.png',//封面图片
        //loaded: 'loadedHandler', //当播放器加载后执行的函数
        video:'http://file.51xuecheng.cn/video/a/9/a92da96ebcf28dfe194a1e2c393dd860/a92da96ebcf28dfe194a1e2c393dd860.mp4'
        // video: [//视频地址列表形式
        // 	['http://file.xuecheng-plus.com/video/3/a/3a5a861d1c745d05166132c47b44f9e4/3a5a861d1c745d05166132c47b44f9e4.mp4', 'video/mp4', '中文标清', 0]
        // ]
    },
    player : null,
    preview:false

}

第三步: 重启Nginx访问localhost/course/preview/learning.html?id=82观察视频是否可以正常播放,此页面还会请求后台接口获取课程计划暂时不处理

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1541342.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

AtCoder ABC346 A-E题解

比赛链接:ABC346 Problem A: 签到题。 #include <bits/stdc.h> using namespace std; const int maxn105; int A[105],B[105]; int main(){int N;cin>>N;for(int i1;i<N;i)cin>>A[i];for(int i1;i<N;i){B[i]A[i1]*A[i];cout<<B[i]<<end…

【Godot4.2】像素直线画法及点求取函数

概述 基于CanvasItem提供的绘图函数进行线段绘制只需要直接调用draw_line函数就可以了。 但是对于可以保存和赋值节点直接使用的纹理图片&#xff0c;却需要依靠Image类。而Image类没有直接提供基于像素的绘图函数。只能依靠set_pixel或set_pixelv进行逐个像素的填色。 所以…

Linux 的 app :一般到哪里下载 ?(**)

利用 appimagetool 工具对开发好的项目进行打包 &#xff08;***带笔记*&#xff09; https://blog.csdn.net/ken2232/article/details/131313613 1. 首选&#xff0c;直接通过 OS发行版的官网仓库&#xff1a;简单、方便&#xff1b;可能相对最可靠。 如&#xff1a; sudo a…

matlab基于Simulink的模糊逻辑控制应用

一、原理 模糊逻辑指模仿人脑的不确定性概念判断、推理思维方式&#xff0c;对于模型未知或不能确定的描述系统&#xff0c;以及强非线性、大滞后的控制对象&#xff0c;应用模糊集合和模糊规则进行推理&#xff0c;表达过渡性界限或定性知识经验&#xff0c;模拟人脑方式&…

基于YOLOv8深度学习的橙子病害智能诊断与防治系统【python源码+Pyqt5界面+数据集+训练代码】深度学习实战、目标分类

《博主简介》 小伙伴们好&#xff0c;我是阿旭。专注于人工智能、AIGC、python、计算机视觉相关分享研究。 ✌更多学习资源&#xff0c;可关注公-仲-hao:【阿旭算法与机器学习】&#xff0c;共同学习交流~ &#x1f44d;感谢小伙伴们点赞、关注&#xff01; 《------往期经典推…

算法:bfs(深度优先搜索)

// dfs习题&#xff1a; // 输入9行&#xff0c;0代表未知 // 输出9行即最终结果 #include <stdio.h> #include <stdlib.h> int main() {int table[9][9];//输入数据for (int i 0; i < 9; i) {for (int j 0; j < 9; j) {scanf("%d", &table[…

js工具方法记录

校验数字是否有效的11位手机号 function isValidPhoneNum(value: string) {return /^[1][3,4,5,6,7,8,9][0-9]{9}$/.test(value) }手机号中间4位掩码 function maskPhoneNum(phone: string, space false) {if (!phone) {return }const reg /(\d{3})\d{4}(\d{4})/return pho…

【测试开发学习历程】MySQL分组查询与子查询 + MySQL表的联结操作

目录 1 MySQL分组查询与子查询 1.1 数据分组查询 1.2 过滤分组 1.3 分组结果排序 1.4 select语句中子句的执行顺序 1.5 子查询 2 MySQL表的联结操作 2.1 关系表 2.2 表联结 2.3 笛卡尔积 2.4 内部联结 2.5 外联结 2.6 自联结 2.7 组合查询 1 MySQL分组查询与子查询…

LangChain-Chatchat知识库对话

前言 上次我们完成了Chatchat的本地部署&#xff0c;使用了LLM对话的功能。这次我们尝试一下其他的功能&#xff0c;之前总是有报错没有跑通&#xff0c;这次处理了几个问题之后才跑通了知识库对话和文件对话。 知识库对话 原理: 首先我们看这个图可以明白&#xff0c;知识库…

Redis学习二--常见问题及处理

基本概念 Redis基本概念数据结构 机制 持久化机制&#xff1a; RDB(内存快照)&#xff1a;某一时刻的内存快照以二进制的方式写入磁盘&#xff0c;可以手动触发和自动触发。 优点&#xff1a;生成文件小&#xff0c;恢复速度快&#xff0c;适用于灾难恢复。 缺点&#xff1a…

03-SparkSQL入门

0 Shark Spark 的一个组件&#xff0c;用于大规模数据分析的 SQL 查询引擎。Shark 提供了一种基于 SQL 的交互式查询方式&#xff0c;可以让用户轻松地对大规模数据集进行查询和分析。Shark 基于 Hive 项目&#xff0c;使用 Hive 的元数据存储和查询语法&#xff0c;并基于Hiv…

MySQL5.6.11安装步骤(Windows7 64位)

MySQL5.6.11安装步骤&#xff08;Windows7 64位&#xff09; 1. 下载MySQL Community Server 5.6.21&#xff0c;注意选择系统类型&#xff08;32位/64位&#xff09; 2. 解压MySQL压缩包 将以下载的MySQL压缩包解压到自定义目录下。 3. 添加环境变量 变量名&#xff1a;MYS…

【项目设计】基于MVC的负载均衡式的在线OJ

项目代码&#xff08;可直接下载运行&#xff09; 一、项目的相关背景 学习编程的小伙伴&#xff0c;大家对力扣、牛客或其他在线编程的网站一定都不陌生&#xff0c;这些编程网站除了提供了在线编程&#xff0c;还有其他的一些功能。我们这个项目只是做出能够在线编程的功能。…

“低代码+平台”:驱动企业数字化转型与创新的新引擎

“低代码平台”作为一种新兴的软件开发范式&#xff0c;正逐渐成为企业快速响应市场变化、优化业务流程、提升数字化水平的重要手段。它的价值在于&#xff0c;将传统软件开发的复杂性大大降低&#xff0c;赋予了非技术人员或轻量级开发者快速构建应用的能力&#xff0c;并能灵…

可视化驯龙高手:Portainer——轻松驾驭Docker的图形化管理利器

在Docker容器技术的海洋中&#xff0c;Portainer如同一艘满载智能导航系统的旗舰&#xff0c;为我们提供了直观且易用的图形化管理界面&#xff0c;让繁杂的容器管理和运维工作变得轻松愉悦。本文将带你了解Portainer的基本功能&#xff0c;掌握其安装方法&#xff0c;并体验其…

摘录笔记——2024年3月22日

目录 一、背景 1.1 新人的选择困局 1.2 高人才密度环境下普通员工的成长效率困局 1.3 业务发展和个人成长的二元对立困局 1.4 中年打工人低费效比引发的职场生涯终结困局 二、人的本质 2.1 人的本质的定义 2.2 由“人的本质”引出的几个关键过程 2.2.1 认知指引实践&a…

【前端寻宝之路】学习和总结HTML表格的实现和合并

&#x1f308;个人主页: Aileen_0v0 &#x1f525;热门专栏: 华为鸿蒙系统学习|计算机网络|数据结构与算法|MySQL| ​&#x1f4ab;个人格言:“没有罗马,那就自己创造罗马~” #mermaid-svg-IWDj0gWiFt6IMq3x {font-family:"trebuchet ms",verdana,arial,sans-serif;f…

啥是反射???

在Java编程中&#xff0c;反射&#xff08;Reflection&#xff09;是一种强大的工具&#xff0c;它允许程序在运行时检查类、接口、字段和方法的信息&#xff0c;并且可以动态地创建和操作对象。 一、反射的基本概念 反射是Java语言的一个特性&#xff0c;它允许程序在运行时对…

QML ShapePath绘制虚线

一.qml PathLine介绍 在 QML&#xff08;Qt Modeling Language&#xff09;中&#xff0c;PathLine 是 Path 元素的一个子类型&#xff0c;用于创建两点之间的直线段。Path 类型用于描述一个二维路径&#xff0c;可以用来绘制形状、曲线和直线。PathLine 是所有路径曲线中最简单…

从0写一个问卷调查APP的第13天-1

1.今日任务 我也只是一个大学生&#xff0c;有什么思路不对的地方给我指出来哟! 分析&#xff1a;上次我们实现了任务调查的插入。但是我们插入的问卷调查只有它的标题&#xff0c;也就是这个问卷调查是什么我们告诉数据库了&#xff0c;但是现在我们还没有给它添加任何问题&…