828华为云征文 | 将Vue项目部署到Flexus云服务器X实例并实现公网访问

devtools/2024/9/24 2:11:55/

一、Flexus云服务器X实例简介

1.1 概述

        华为云Flexus X实例是华为云推出的一款创新云服务器产品,它主要面向中小企业和开发者,旨在解决传统云服务中的痛点,提供更加灵活、高效的云服务体验。

        华为深刻洞察了中小企业和开发者在云服务应用中遇到的挑战,如资源规格刚性与用户多样化需求之间的矛盾、业务调优复杂性等,将柔性算力技术引入到服务器中,产生了Flexus X实例,实现了对传统云服务的革命性变革,为用户提供了更加贴合实际业务需求的云服务解决方案。

1.2 产品特点

  1. 柔性算力技术:Flexus X实例业界首创CPU内存规格柔性定义,最高可实现3:1的CPU/内存比,同时提供超过100种规格组合,满足用户对算力规格的个性化需求。这一技术突破了传统云服务固定规格的限制,实现了云资源与实际业务场景的精准匹配,有效降低了资源浪费和成本。
  2. 智能调度与稳定性保障:Flexus X实例引入了瑶光云脑技术和大模型智能调度能力,能够智能感知云主机实际利用率并进行智能调度,确保算力分配的稳定性和性能的持久性。同时,Flexus X实例还提供了与华为云旗舰级云服务器产品相媲美的高可用性,包括单AZ 99.975%的可用性和跨AZ 99.995%的可用性。
  3. 应用调优与便捷性:Flexus X实例内置了智能应用调优算法,能够自动匹配合适的应用参数和内核参数,降低业务调优的难度。此外,Flexus X实例还支持热变配能力,用户可以直接升配CPU和内存规格而不需要重启实例,这对于企业级应用、电商、游戏等业务场景非常有价值。
  4. 系统镜像与迁移支持:Flexus X实例提供了多种系统镜像选择,包括CenOS、Ubuntu Server、EulerOS等,用户可以根据需求选择合适的系统镜像。同时,华为云还提供了迁移中心MgC,帮助企业高效地计算迁移成本和实现快速的业务迁移,从而降低企业的上云门槛和成本。

1.3 价格与优惠

        华为云Flexus X实例以其经济型的价格和近乎旗舰级的性能,为用户提供了跃级体验。具体价格可能因配置和促销活动而有所不同,最近华为云828 B2B企业节正在举办,Flexus X实例的促销也非常给力,大家可以去看看。下图就是华为云Flexus X实例在官网给出的价格相较于其他云服务也是十分优惠了,大家有需要的可以抓紧时间入手了。

        接下来我们通过将本地的Vue项目部署到咱们的华为云Flexus X实例服务器上,讲解如何使用华为云Flexus X实例将本地的Vue项目部署上去。这里我们需要用到Nginx,因此得先安装Nginx

二、部署过程

2.1 安装Nginx

接下来我们打开华为云Flexus X实例的控制台:,点击远程登录:

这里还是照旧啊,我们使用华为的CloudShell登录,不得不说,比去年的服务器终端界面友好太多了,输入服务器密码之后,登录成功如下图:

这里我们直接使用wget命令在服务器上直接下载Nginx

wget http://nginx.org/download/nginx-x.x.x.tar.gz(请将x.x.x替换为具体的版本号)。

这里我下载的版本是1.22.1,因此命令就是:

wget http://nginx.org/download/nginx-1.22.1.tar.gz

下载完成之后使用ls命令,可以看到安装包也确实在当前目录下拉。

然后编译安装Nginx

解压安装包:将下载的Nginx源代码包解压到/usr/local,命令如下:

tar -zxvf nginx-1.22.1.tar.gz -C /usr/local

配置Nginx:进入解压后的目录,执行./configure命令进行配置。可以根据需要添加编译选项,如--prefix=/usr/local/nginx指定安装目录,--with-http_ssl_module启用SSL支持等。这里我们先进入到cd /usr/local/nginx-1.22.1/目录,然后再进行配置,命令如下:

cd /usr/local/nginx-1.22.1/

./configure

这里显示pcre pcre-develm没有这个库,因此我们使用命令:

yum install pcre pcre-devel

安装pcre pcre-develm没有这个库

安装完成之后,再执行配置,好像还是有问题,原来是还缺少了zlib依赖,然后我们继续安装

yum install zlib zlib-devel

安装完成之后,我们再执行./configure命令就没有问题了,

编译并安装:执行make命令进行编译,然后执行make install命令进行安装。这两步稍微要等久一点,

到这里我们就已经完成安装了,然后启动nginx:

# 启用nginx服务
cd /usr/local/nginx/sbin/
./nginx -c /usr/local/nginx/conf/nginx.conf

然后在浏览器输入我们服务器的公网IP,就可以看得到Nginx的欢迎界面了:

2.2 打包项目

接下来我们打开Vue项目,执行npm run build命令打包项目,

打包成功后会在项目目录下生成一个dist目录,dist目录里面就包含了项目的静态文件及代码:

接下来我们点击index.html看看是否有页面,如果没有的话,就需要我们在vue.config.js文件上加上下面三个参数。

2.3 配置Nginx

然后我们先在咱服务器上的nginx目录下,新建一个test目录,存放我们刚刚打包的dist目录

然后将dist目录上传进去,这里发现cloudShell是不能多文件上传的,这里提个需求哈,这下我们还得依靠第三方上传。上传上去之后,修改nginx配置文件。

把这里修改成我们刚刚创建的test目录名,因为index.html文件在这里嘛。

然后使用命令关闭刚刚启动的nginx服务,然后再启动

# 启用nginx服务
cd /usr/local/nginx/sbin/
./nginx -c /usr/local/nginx/conf/nginx.conf

然后刷新

OK,这下就已经成功部署上去了。

三、Flexus云服务器X实例的优势所在

3.1 产品优势

  • 提供丰富的公共镜像,可灵活自定义镜像版本。
  • 智能感知业务动态升降配,负载范围更高。
  • 支持灵活自定义vCPU、内存实例规格。
  • 支持按需计费更精细和灵活的定价模式,可基于实际负载画像智能推荐规格。

3.2 资源规格配置丰富

Flexus X实例通过和其他服务组合,具备计算、镜像安装、网络、存储、安全等能力,您可根据业务需要灵活配置各资源。

服务

说明

镜像服务(IMS)

通过镜像服务提供的公有镜像、私有镜像、共享镜像,Flexus X实例可快速安装操作系统。

云硬盘(EVS)

Flexus X实例通过EVS实现数据存储服务,并通过EVS的快照功能实现数据的备份和恢复。

虚拟私有云(VPC)

Flexus X实例通过VPC建立专属的网络环境,设置子网、安全组等。

弹性公网IP(EIP)

Flexus X实例通过EIP实现外网链接。

云备份(CBR)

Flexus X实例通过CBR备份单个云硬盘数据或整机数据,并利用备份数据恢复数据。

云监控(CES)

Flexus X实例通过云监控监控主机资源,您可以查看Flexus云服务器X实例的资源运行情况。

主机安全(HSS)

通过HSS,您可以实时监测Flexus云服务器X实例中的风险,降低Flexus云服务器X实例被入侵的风险。

3.3 计费模式优势

Flexus X实例支持包年/包月、按需计费的计费模式,以满足不同场景下的用户需求。Flexus X实例支持在包年/包月、按需计费间变更计费模式。

3.4 强烈推荐

        看到这里,你是否已经被Flexus云服务器X实例的强大性能和灵活配置所吸引了呢?如果你正寻找一款能够助力你业务飞速发展的云服务器,那么Flexus X无疑是你不二的选择。

        而在这个充满机遇与挑战的828企业节,华为云更是为大家准备了一系列精彩纷呈的活动和优惠。无论你是初创企业,还是正在寻求数字化转型的传统企业,这里都有属于你的舞台。

        现在,就让我们一起加入华为云的大家庭,参与828企业节,共同探索云计算的无限可能。在这里,你不仅可以获得顶尖的技术支持,还能与众多行业精英交流心得,拓展人脉。更有机会赢取丰厚大奖,为你的企业发展注入新的动力。


http://www.ppmy.cn/devtools/116270.html

相关文章

思维商业篇(5)—发展趋势分析

思维商业篇(5)—发展趋势分析 核心理论 巴菲特曾在《滚雪球》一书中提到他的投资之道其实非常简单,可以总结为两句话:找到足够长的雪道,找到足够湿的雪球。 而发展趋势的分析,正好可以借助巴菲特的这个滚雪球理论。 足够长的雪…

vue3 axios ant-design-vue cdn的方式使用

1、vue3 快速上手 | Vue.js <script src"https://unpkg.com/vue3/dist/vue.global.js"></script><div id"app">{{ message }}</div><script>const { createApp, ref } VuecreateApp({setup() {const message ref(Hello …

PCIe进阶之TL:Request Handling Rules

1 Handling of Received TLPs 本节介绍接收到的 TLP 在数据链路层经过完整性验证之后,这些 TLP 在事务处理层时的处理方式。这些规则如下图所示: 接收侧会忽略保留字段。如果 Fmt 字段显示存在至少一个 TLP Prefix : (1)通过检查后续 DWORD 的第一个字节中的 Fmt 字段,…

408算法题leetcode--第七天

283. 移动零 283. 移动零思路&#xff1a;代码中注释阐述时间&#xff1a;O(n)&#xff1b;空间&#xff1a;O(1) class Solution { public:void moveZeroes(vector<int>& nums) {// 简单思路&#xff1a;用一个辅助数组&#xff0c;将非0元素复制到里面// 双指针&…

設置Android設備全局代理

全局代理是指在設備上設置一個代理伺服器&#xff0c;使所有的網路請求都通過這個代理伺服器進行轉發。這樣&#xff0c;無論你使用的是哪款應用&#xff0c;所有的網路流量都會經過代理伺服器&#xff0c;從而實現統一的網路訪問控制和隱私保護。 配置Wi-Fi網路代理 在Andro…

【已解决】键盘输入数字-使用JAVA语言实现键盘输入的数字再通过快速排序算法输出

文章目录 一、前言任务描述相关知识分治策略&#xff1a;编程要求测试说明 二、具体代码实现总结 一、前言 —快速排序 任务描述 在待排序的n个元素中任取一个元素&#xff08;通常取第一个元素&#xff09;作为基准&#xff0c;把该元素放入最终位置后&#xff0c;整个数据序…

spring怎么识别拦截器 异常处理器

Spring框架中识别和调用拦截器&#xff08;Interceptor&#xff09;和异常处理器&#xff08;HandlerExceptionResolver&#xff09;是通过容器内部的组件扫描和自动装配机制来完成的。 拦截器&#xff08;Interceptor&#xff09;: Spring MVC 的拦截器必须实现 HandlerInte…

Spring Boot-应用启动问题

在使用 Spring Boot 进行开发时&#xff0c;应用启动问题是开发人员经常遇到的挑战之一。通过有效排查和解决这些问题&#xff0c;可以提高应用的稳定性和可靠性。 1. Spring Boot 启动问题的常见表现 Spring Boot 应用启动失败通常表现为以下几种情况&#xff1a; 应用启动…