详情页标题前

腾讯云云函数(SCF)快速部署 Nextjs 框架-云淘科技

详情页1

操作场景

本文将为您指导如何通过 Web Function,将您的本地 Next.js SSR 项目快速部署到云端。说明文档主要介绍控制台部署方案,您也可以通过命令行完成部署,详情请参见 通过命令行完成框架部署。

前提条件

在使用腾讯云云函数服务之前,您需要 注册腾讯云账号 并完成 实名认证

操作步骤

模板部署:一键部署 Next.js 项目

1. 登录 Serverless 控制台,单击左侧导航栏的函数服务。2. 在主界面上方选择期望创建函数的地域和命名空间,并单击新建,进入函数创建流程。3. 选择使用模板创建来新建函数,在搜索框里输入 webfunc 筛选函数模板,选择Next.js 框架模板并单击下一步。 4.新建页面,您可以查看模板项目的具体配置信息并进行修改。5. 单击完成即可创建函数。函数创建完成后,您可在函数管理页面查看 Web 函数的基本信息。6. 单击左侧菜单栏中的触发管理,查看访问路径 URL,访问您部署的 Next.js 项目。如下图所示: n

腾讯云云函数(SCF)快速部署 Nextjs 框架-云淘科技

7. 单击访问路径 URL,即可访问服务 Next.js 项目。如下图所示: n

腾讯云云函数(SCF)快速部署 Nextjs 框架-云淘科技

说明由于 Nextjs 框架每次部署前需要重新构建,请确保本地更新代码并且重新 build 之后再进行部署。

自定义部署:快速迁移本地项目上云

前提条件

本地已安装 Node.js 运行环境。

本地开发

1. 参考 Next.js 官方文档,安装并初始化您的 Next.js 项目:

npx create-next-app

2. 在根目录下,执行以下命令在本地直接启动服务。

cd my-app && npm run dev

3. 打开浏览器访问 http://localhost:3000,即可在本地完成 Next.js 示例项目的访问。如下图所示: n

腾讯云云函数(SCF)快速部署 Nextjs 框架-云淘科技



部署上云

接下来执行以下步骤,对已初始化的项目进行简单修改,使其可以通过 Web Function 快速部署,此处项目改造通常分为以下两步:修改监听地址与端口为 0.0.0.0:9000。新增 scf_bootstrap 启动文件。具体步骤如下:1. 在项目根目录下新建 scf_bootstrap 启动文件,在该文件添加如下内容(用于启动服务并指定启动端口):

#!/var/lang/node12/bin/nodeconst { nextStart } = require('next/dist/cli/next-start');nextStart([ '--port', '9000', '--hostname', '0.0.0.0' ])

注意此处仅为示例启动文件,具体请根据您的业务场景进行调整。示例使用的是云函数标准 Node 环境路径,本地调试时,需修改成您的本地路径。2. 新建完成后,还需执行以下命令修改文件可执行权限,默认需要 777755 权限才可正常启动。示例如下:

chmod 777 scf_bootstrap

3. 登录 Serverless 控制台,单击左侧导航栏的函数服务。4. 在主界面上方选择期望创建函数的地域,并单击新建,进入函数创建流程。5. 选择从头开始新建函数,根据页面提示配置相关选项。如下图所示: n

腾讯云云函数(SCF)快速部署 Nextjs 框架-云淘科技

函数类型:选择 “Web 函数”。函数名称:填写您自己的函数名称。地域:填写您的函数部署地域,默认为广州。运行环境:选择 “Nodejs 12.16”。提交方法:选择“本地上传文件夹”,上传您的本地项目。函数代码:选择函数代码在本地的具体文件夹。6. 单击完成完成 Next.js 项目的部署。

开发管理

部署完成后,即可在 SCF 控制台快速访问并测试您的 Web 服务,并且体验云函数多项特色功能,例如层绑定、日志管理等,享受 Serverless 架构带来的低成本、弹性扩缩容等优势。n

腾讯云云函数(SCF)快速部署 Nextjs 框架-云淘科技


官网1折活动,限时活动,即将结束,速速收藏
同尘科技为腾讯云授权服务中心。
购买腾讯云产品享受折上折,更有现金返利。同意关联立享优惠

转转请注明出处:https://www.yunxiaoer.com/149757.html

(0)
上一篇 2023年12月9日 下午1:24
下一篇 2023年12月9日 下午1:25
详情页2

相关推荐

  • 腾讯云云点播社交短视频

    场景描述 社交短视频,顾名思义社交为主体,通过短视频的方式促进社交。该场景具有如下核心需求: 核心诉求 说明 视频快速制作并分享 用户通过短视频的形式记录并分享生活,参与了视频生成、处理、上传、分发和播放等多个环节。让用户简单快速实现这一系列操作将提高用户的参与热情,有利于社交短视频平台的发展,是其核心诉求之一。 媒体智能 在社交短视频平台,用户也可以关注有…

    腾讯云 2023年12月9日
  • 腾讯云高性能计算集群应用场景

    大规模 AI 训练 自动驾驶、NLP、推荐系统等场景,有数据量大,计算量密集等特点。高性能云服务器可支持高速低延时的 RDMA 网络互联及最新一代的 CPU 架构和异构 GPU 部件进行计算密集型负载的计算,满足业务对服务器的高计算性能、高稳定性、高实时性的诉求。 工业仿真 大量制造业企业,如汽车,航空等行业,需要利用仿真计算驱动设计,公司自建高性能计算集群…

    腾讯云 2023年12月9日
  • 信息流广告,信息流部分建议宽度830px,只针对默认列表样式,顺序随机
  • 腾讯云容器服务健康状态检测同尘科技

    边缘场景下的弱网络会触发 Kubernetes 驱逐机制,引起不符合预期的 Pod 驱逐动作。边缘计算情景下,边缘节点与云端的网络环境十分复杂,网络质量无法保证,容易出现 API Server 和节点连接中断等问题。如果不加改造直接使用原生 Kubernetes,节点状态会经常出现异常,引起 Kubernetes 驱逐机制生效,导致 Pod 的驱逐和 End…

    2023年12月9日
  • 在polarDB-mysql 内核版本 8.0.1.1.38.2上执行文档示例。提示的错误怎么处理?-云小二-阿里云

    alter table t1PARTITION BY RANGE COLUMNS(create_time) INTERVAL(DAY, 1)(PARTITION p0 VALUES LESS THAN(‘2023-12-23’));You have an error in your SQL syntax; check the manu…

    阿里云 2024年1月3日
  • 腾讯云对象存储设置访问域名(CDN/全球加速)

    简介 本文档提供关于如何使用非默认域名请求 COS 服务。 SDK API 参考 SDK 所有接口的具体参数与方法说明,请参考 SDK API。 自定义源站域名 关于如何设置自定义源站域名请参考 自定义源站域名。以下代码展示了如何使用自定义源站域名访问 COS 服务。 示例代码 CosXmlConfig config = new CosXmlConfig.B…

    腾讯云 2023年12月9日

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信
本站为广大会员提供阿里云、腾讯云、华为云、百度云等一线大厂的购买,续费优惠,保证底价,买贵退差。