1分钟部署一个属于自己的网站,借助云开发静态网站部署属于自己的网站

news/2024/5/17 14:41:44/文章来源:https://blog.csdn.net/TCB_CloudBase/article/details/111048093

今天来教大家部署一个属于自己的第一个静态网站,因为这里借助小程序云开发的静态服务器资源,所以可以轻松的实现自己网站的部署,部署完以后可以在电脑浏览器,手机浏览器,微信公众号里面展示。

老规矩,先看效果图

简单起见,我这里写一个最简单的html静态网页


然后把这个网页部署到云开发静态网站上
微信上访问效果如下

手机浏览器上访问如下

这也就意味着,我们的网站可以供用户在任何地方访问。下面就来教大家如何快速的部署一个属于自己的网站。

一,开通云开发

这里云开发开通开通云开发我们借助小程序开发者工具来实现快速开通。

1-1,注册小程序

这里我就不再多说了,只有注册过小程序的appid才可以开通云开发


我们注册好小程序后,就可以拿到appid了,如上图

1-2,创建一个小程序项目

小程序项目的创建,我这里不再多说,我前面小程序基础课里有讲过很多遍。《小程序基础学习》


这里强调一点,就是创建小程序项目时一定要用我们自己的appid不要用测试号。
图片在这里插入图片描述
如果你一开始是用测试appid创建的,也可以通过上图的方式更换成自己的小程序的appid。

1-3,开通云开发

这里是云开发开通,我就不做过多讲解了,我云开发课程里也讲过很多遍。大家可以去翻看下


只需要点击开发者工具里的云开发按钮,跟着提示一步步操作就可以快速开通云开发。

二,开通静态网站功能


我们上面云开发开通好以后,就可以在这里快速开通静态网站了。

点击以后,直接点击开通即可

这时候开通有个条件

我们必须按照要求改变自己小程序的付费方式,把我们的付费方式改成按量付费即可。



这个时候我们的静态网站功能就开通成功了。

开通成功以后如下图。

这个时候我们就可以把我们开发好的静态网页上传到网站供别人访问了。

三,部署网站

我们的静态html如下


点击上传文件,把我们的index.html文件上传到静态网站

这样就代表上传成功了。

访问我们的网站

上面把网页部署成功以后,我们就可以通过云开发为我们创建的默认网址来访问了。


点击上图所示的详情,就可以拿到访问我们网站的网址如下

上图箭头所示的网址,就是我们网页的访问网址。

如果你的html是以index命名的,我们使用云开发为我们分配的域名,就可以直接访问我们的网站。

study-gas4x-1258760189.tcloudbaseapp.com 就是云开发为我分配的网站域名,以后用户就可以直接通过这个域名访问我们的网站了。
其实到这里我们就可以成功的部署属于我们自己的网站了,无非就是你网页写的比石头哥再好看些。

但是有些同学觉得官方给分配的域名太长,不好记,想使用自己的域名。那么我们该如何配置自己的域名呢?

四,配置域名(选看)

其实前面3步就可以成功的部署自己的网站了,如果你有自己的域名,并且也成功的备案了,再来跟着石头哥学习这一节。如果没有自己的域名,那么你就要先去注册自己的域名,并备案了。所以这一节作为一个选学。

4-1,在网站配置里添加自己的域名


如我在这里点击添加域名,然后添加自己的备案域名。

但是我们这里要想https来安全访问,就必须配置自己的ssl证书。

点完以后,我们这里可以直接申请免费证书。免费证书有效期1年,1年后我们再重新申请新的证书就可以了,所以这里免费的就够用了。

如实的填写自己的备案域名和其余信息。

提交完资料,我们这里需要验证下自己的域名,验证方式选择DNS就可以

点位DNS验证,我们就需要给我们的域名配置访问的解析值了(这里的知识点比较深奥,大家需要自己课下恶补下域名解析的相关知识点)如果不想学习,直接根据提示配置也行。

配置好以后,就可以点击验证先进行验证了

验证通过后,可以看到如下

云开发控制台也会显示部署中,我们耐心等待部署就可以了。

启动成功会有如下标识

虽然已经启动成功,我们如果想通过自己的域名访问自己的云开发静态网站,还需要配置下CNAME进行重定向,也就是访问我们域名的时候我们要重定向到云开发给我们分配的域名。

这里理解起来有点晦涩,官方给的文档也是没有讲明白,我也是试了很多遍才知道是这样配置的。这里都配置好以后,我们就可以直接通过自己的域名访问网站了。
图片
大家也可以去访问下石头哥的云开发静态网站试一试。

到这里我们的网站部署就讲完了,后面我会用vue写一些炫酷的网站,然后部署到线上供大家观赏。

产品介绍

云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为开发者提供高可用、自动弹性扩缩的后端云服务,包含计算、存储、托管等serverless化能力,可用于云端一体化开发多种端应用(小程序,公众号,Web 应用,Flutter 客户端等),帮助开发者统一构建和管理后端服务和云资源,避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
开通云开发:https://console.cloud.tencent.com/tcb?tdl_anchor=techsite
产品文档:https://cloud.tencent.com/product/tcb?from=12763
技术文档:https://cloudbase.net?from=10004
技术交流加Q群:601134960
最新资讯关注微信公众号【腾讯云云开发】

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

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

一键部署!教你用云开发极速建站

无论是对于个人开发者还是企业,都经常需要通过一个网站去展示自己、与用户建立连接。生活论坛、地方门户、图片社区、博客站点…通过自己手把手去选框架、写代码又太耗时间。 借助云开发的一键部署能力,你不需要一行一行地写 HTML、CSS,也不…

简单几步,用云函数上传文件至静态网站托管

前言 云开发CloudBase为开发者提供静态网站托管的能力,静态资源(HTML、CSS、JavaScript、字体等)的分发由对象存储 COS 和拥有多个边缘网点的 CDN 提供支持。 本篇文章将使用云开发 Node.js 管理端 SDK演示,只需简单几步即可在云…

一键部署!这样搭建一个文档网站真的很简单!

本文由贝壳找房的前端工程师刘成帅(Jacob)带来,文中介绍了如何运用云开发CloudBase,免服务器、免域名快速搭建个人站点的方式。一起学习吧~ 前言 最近笔者在复习 JavaScript 基础知识,刚看完 《JavaScript 高级程序设…

监控和告警 | 网站被攻击了?

前段时间,我的网站疑似被攻击了,今天带大家一起来事故现场看看,并且分享事故分析思路和事后防控手段。 孽起 先看看我是怎么发现网站被攻击的吧。 通常,为了保证线上网站和后台服务的稳定运行,我们需要给项目添加监…

用云开发Webify,5分钟上线新网站!

用最简单的方式,带你上线自己的网站! 大家好,我是鱼皮。 相信每位学编程的同学都想要拥有一个自己的网站,比如个人博客,可以拿来记录自己的学习过程、分享自己的文章、展示作品等,从而激励自己持续学习和总…

Webify个人网站扶持计划:免费托管你的网站

再小的网站都有自己的价值,Webify 致力于帮助有情怀的站点先跑起来。 为了让更多开发者聚焦于网站本身的内容建设,而无需操心部署流程以及访问量与托管费用不对等的情况。 Webify 特别推出个人站点扶持计划: 将博客/论坛/官网等任意形式的个…

Next.js + 云开发Webify 打造绝佳网站

Next.js酷在哪里? 之前使用 Next.js strapi 做了一个简单博客站点也顺道写了一篇 Next.js 简明教程,之后 Next 本身一直在迅猛发展。利用代 js 能力来说做到了: 极佳的开发体验极佳的网站最佳的”动“,“静”平衡 从特性上来说…

十年老站长心声:我为什么选择把 Hexo 网站迁移到 Webify

前 言 我的这个博客站点大约始建于2010年以前,使用过 dlog、pjblog、zblog 等博客程序,也手动建立使用过纯静态 HTML 页面,大约2010年开始使用 WordPress。最近几年有感于 WordPress 过于臃肿复杂,而我的目的只是想写点什么&…

不套用模版,用微搭低代码开发企业门户网站

移动互联网时代,要快速打造企业品牌形象,越来越多企业选择小程序、H5等移动端形态构建门户网站。 如果拥有自己的门户网站,就意味着企业能够覆盖用户的更多碎片时间,使自己的品牌更加深入人心,使客户咨询等服务更加便…

内蒙古包钢钢管:用腾讯云微搭搭建企业门户网站,开启传统企业数字化转型之路

包钢钢管厂研发负责人: 作为一个国有的钢管厂企业,我们需要一个简单便捷、快速高效的搭建工具,联通我们的员工和客户,而微搭就是这样一款工具,它与微信和企业微信原生地互相结合。 企业背景 在我国行业数字化浪潮的趋…

php 企业网站 mail_花都新零售企业管理系统价位

花都新零售企业管理系统价位 ewttre花都新零售企业管理系统价位 实际上软件设计的主要任务就是将软件分解成模块是指能实现某个功能的数据和程序说明、可执行程序的程序单元。如今的短视频,沦为抄袭的重灾区。一些优质的短视频,未经允许被“搬运工”和“…

网站无法连接mysql_nacos无法连接mysql的解决方法

原因nacos的pom依赖的mysql版本与mysql版本不一致导致步骤1:修改pom文件中mysql为对应版本依赖mysqlmysql-connector-java8.0.19步骤2:building项目解决编译报错(删除旧依赖)步骤3:重新打包 mvn -Prelease-nacos -Dmaven.test.skiptrue clean…

iis服务器怎么部署php网站,iis服务器怎么部署php网站

iis服务器怎么部署php网站 内容精选换一换华为云帮助中心,为用户提供产品简介、价格说明、购买指南、用户指南、API参考、最佳实践、常见问题、视频帮助等技术文档,帮助您快速上手使用华为云服务。PHPWind(简称:PW)是一个基于PHP和MySQL的开源…

html5标签seo的作用,seo标签是什么意思,简述seo网站标签的作用

在HTML代码中,能适当布局一些优化标签,会给网站带来意想不到的结果。那么关于SEO优化标签的用处你真的知晓么? 跟随赢客互动小编的脚步一起认识下以下这些seo标签吧!1.标题标签在网页html代码中标签是定义在最重要的标题&#xff…

linux国产操作系统下载网站,三分钟快速安装国产操作系统Ylmf OS

雨林木风旗下国产操作系统Ylmf OS 4.0已经发布,(具体见http://www.linuxidc.com/Linux/2011-06/36739.htm)靓丽清爽的系统界面和丰富的系统应用立刻引起广大网友的热烈关注。但是不少网友对Linux操作系统有天生的恐惧感,担心其复杂的分区操作和安装方法对…

王者荣耀测试自己本命英雄软件,王者荣耀本命英雄测试网站分享 2021本命英雄测试入口...

王者荣耀本命英雄测试网站在其中还是非常的有用的,根据我们的性格能够给我们带来不同的选择,每个在面对相同的情况都是会做出不同的选择的,根据这些选择,我们能够找到最适合我们的英雄,下面就是具体的王者荣耀本命英雄…

让搜索引擎快速收录网站

让搜索引擎快速收录网站或许很多朋友面临这样的窘境,网站刚上线,提交完搜索引擎,可是搜索引擎并没有马上收录网站,而是过了很长一段时间才收录网站的首页。这是一个可能让人发疯的问题,如果每一个新站都等很长一段时间…

针对Seoer提出的争议性问题进行解答

很多东西都没有唯一、没有绝对,seo技术和知识同样也是如此,可能适合自己的优化方法和套路,对别人不会起到多少的效果,因为seo是一个综合性的评判,它跟行业的不同、网站的不同、甚至细节的不同都会有截然不同的结果&…

边玩边学,15个学习Python 的编程游戏网站!

经常听到有朋友说,学习编程是一件非常枯燥无味的事情。其实,大家有没有认真想过,可能是我们的学习方法不对? 比方说,你有没有想过,可以通过打游戏来学编程? 今天我想跟大家分享几个网站&#…

关于下载cuda和cudnn官方网站访问不了的替代方案

一、背景 最近一段时间在做深度学习Tensorflow2.x的项目,由于涉及到了docker环境下的tensorfow的GPU加速,于是我就在电脑(飞行堡垒)装双系统win10ubuntu,后改成了win10上面装WSL(Win10的linux子系统)。由于前边装双系统的过程中系统出了一些…