当前位置首页 >> 评论消息 >> 正文

使用腾讯云托管部署前端项目 | 云托管征文-腾讯云开发者社区-腾讯云

更新时间: 2025-06-05 12:56:05

阅读人数: 911

本文主题: 投稿征文平台小程序

背景介绍最近腾讯云和微信团队联合推出的后端上云新姿势——微信云托管!可以使用开源模版,也可以直接使用Git项目来进行项目构建部署。并且是免运维的,无需服务器,1分钟部署小程序/公众号/网站服务端。周末抽时间体验了一下,下面以部署一个前端项目为例,来简单展示一下云托管的使用方法。目前云托管是免费额度,大家可放心体验。使用项目虽然云托管主推的是后端上云,但其实只要构建出容器就可以。本次演示使用的项目是 https://gitee.com/alone_snake/vitepro,该项目托管在gitee上,是一个公开项目。这是一个使用vite构建的前端项目模版,项目根目录下有Dockerfile。内容为代码语言:shell复制FROM node:12.21.0-alpine as builder WORKDIR /app COPY package.json . RUN yarn COPY . . RUN yarn build FROM nginx:latest COPY --from=builder /app/dist /usr/share/nginx/html项目需要使用Nodejs来编译构建,最后将编译出的静态文件(存放在dist目录)都拷贝到nginx镜像的/usr/share/nginx/html目录云托管操作流程很多同学搞不清楚云托管与云开发的关系,这里我根据官方的文档来给大家讲解一下,云开发是指微信团队联合腾讯云推出的专业的小程序开发服务,只针对小程序,但也有一部分是支持公众号玩耶开发的,开发者无需搭建服务器,可免鉴权直接使用平台提供的 API 进行业务开发,开发者可以直接使用官方提供的api来操作云数据库中的数据。云托管是讲项目的部署,运维给管理起来,属于项目开发流程之后的,项目开发完,需要部署,运维这时可以使用云托管。登录多的不说了,因为这是实践课,要使用云托管,首先需要登录云托管的微信云托管登录地址 https://cloud.weixin.qq.com/cloudrun/qrLogin?nextpage=console&act=tap_banner_freetry_notLogin使用个人微信扫描,然后选择微信下的小程序或公众号。image.png第一次登录后可以直接选择模版进行部署。image.png开发者可以选择自己需要的模版进行体验。选择Spirng boot模版进行部署image.png部署完成后就会出现部署后的信息, 包括服务访问的公网域名地址,数据库,代码源image.png以上是基于官方提供的模版来进行部署体验。下面使用自己开发的前端项目来部署。创建服务进入收入,点击服务管理,点击创建服务image.png输入服务名称,开启公网访问image.png创建服务名称后,需要选择代码,这里可以绑定Github,或GitLabimage.png一共有五种方式,GitHub,GitLab, Gitee,手动上传代码,拉取镜像。image.png前三种都需要登录平台进行授权,这种方式可以使用webhook,提交代码后就能立即构建,通过运行流水线,部署一个新的版本。以下是Gitee的授权image.png授权后,在代码仓库处就能够选择自己账号下的所有项目image.png然后要部署服务的分支和容器暴露的端口。这里需要注意一点的是,选择的项目需要都已经容器化了,意思就是项目中有Dockerfile,能够构建出镜像。如果满足以上条件,则是无法进行部署的。高级设置中可以设置一些构建时的环境变量,也可以指定Dockerfile的名称。填写完成后,点击发布。进入部署环境。image.png根据所打印的日志可以推断出一下内容,整个流水是在Jenkins运行的检出代码登录腾讯的镜像仓库开始构建镜像构建完成后 推送 Docker 镜像到 TCR开始部署服务部署完成后,点击服务首页的公网访问就可以访问到部署的页面。如下image.pngimage.pngCI/CD修改项目部分代码,推送到Gitee,默认将代码推送到master分支就会自动触发流水线。image.png点击版本的详情可以查看构建部署的日志。其中版本列表的备注就是本次提交的信息。其他功能可以查看服务的日志可以云端调试,相当于一个简陋的在线postman。服务监控,主要用于后端可以为一个项目配置多个环境设置自定义域名,只需要绑定域名,并将绑定的CNAME记录添加到域名解析中。云托管的底层还是K8s,容器编排,Jenkins。最后希望大家都能用的愉快。

使用腾讯云托管部署前端项目 | 云托管征文-腾讯云开发者社区-腾讯云

【云+社区年度征文】云开发实践之framework快速部署kodexplorer-腾讯云开发者社区-腾讯云

目录介绍部署过程步骤一.准备工作步骤二.进入项目目录进行初始化步骤三.编辑配置文件cloudbaserc.json步骤四.创建变量文件.env步骤五.部署应用可选.一键部署按钮一键部署按钮总结相关产品与服务文件存储文件存储(Cloud File Storage,CFS)为您提供安全可靠、可扩展的共享文件存储服务。文件存储可与腾讯云服务器、容器服务、批量计算等服务搭配使用,为多个计算节点提供容量和性能可弹性扩展的高性能共享存储。腾讯云文件存储的管理界面简单、易使用,可实现对现有应用的无缝集成;按实际用量付费,为您节约成本,简化 IT 运维工作。产品介绍产品文档2025春季采购节

flutter完整开发实战详解(三、 打包与填坑篇)

面试题集可以帮助你查漏补缺,有方向有针对性的学习,为之后进大厂做准备。但是如果你仅仅是看一遍,而不去学习和深究。那么这份面试题对你的帮助会很有限。最终还是要靠资深技术水平说话。网上学习 Android的资料一大堆,但如果学到的知识不成体系,遇到问题时只是浅尝辄止,不再深入研究,那么很难做到真正的技术提升。建议先制定学习计划,根据学习计划把知识点关联起来,形成一个系统化的知识体系。学习方向很容易规划,但是如果只通过碎片化的学习,对自己的提升是很慢的。

黑米吧

欢迎來到黑米吧指南,我们致力于提供全方位的日常生活健康知识,涵盖了各方面的科学知识,是值得信赖的社区。