Strapi只需几分钟就可以打造一款CMS内容管理系统

Strapi是一款基于NodeJs开源的项目,Strapi 提供了很大的灵活性用于管理内容,同时提供开放的API请求,可以毫不费力地构建强大的 API 。

功能特性

  • 扁平化的管理面板,优雅、完全可定制、完全可扩展的管理面板
  • 安全性,可重用策略、CSRF、CORS、P3P、Xframe、XSS 等
  • 插件化,可在几秒钟内安装身份验证系统、内容管理、自定义插件等等
  • 支持多类型数据库,使用 Mongo 作为主数据库,同时支持 Postgres、MySQL 等

环境要求:

  • NodeJS:目前支持 v18 和 v20 ,不支持 Node 的奇数版本,例如:v19
  • NPM:v6 及以上
  • Yarn:推荐使用Yarn 包管理器

创建项目

在终端中,运行以下命令:

NPM

sql 复制代码
npx create-strapi-app@latest my-project --quickstart

Yarn

lua 复制代码
yarn create strapi-app my-project --quickstart

选择安装类型

  • Quickstart (recommended),使用默认数据库(SQLite)
  • Custom (manual settings),允许选择你喜欢的数据库

安装后也可以修改数据库类型,所以这里选择Quickstart ,待命令执行完之后进入项目文件夹,执行yarn develop,你会得到如下图的界面:

至此安装完成,进入配置页面,完善后台登录账号后进去控制台,在这里默认有一个User 模型,我们可以新建一个自己的模型,比如Article

如上图,Article 模型已经建立完成了,大家记得点击保存按钮!同时也支持一些字段类型的设置,比如字段长度,是否必填等等

接下来我们就可以进入Content Manager 中写我们的第一篇文章了

写完之后记得Publish Save

API调用

REST API 允许通过 API 端点访问 content-types。创建内容类型时,Strapi 会自动创建API查询。

对于每个 Content-Type,会自动生成以下接口:

方法 网址 描述
GET /api/:pluralApiId 获取条目列表
POST /api/:pluralApiId 创建条目
GET /api/:pluralApiId/:documentId 获取入口
PUT /api/:pluralApiId/:documentId 更新条目
DELETE /api/:pluralApiId/:documentId 删除条目

这里的pluralApiId 就是我们之前创建的Articles

例如获取Article 列表,那么API就是/api/Articles

在请求API时需要进行鉴权,在请求头中写入API 令牌,新的 API 令牌是从管理面板生成的。

生成的token 只会显示一次,如果隐藏掉之后则只能重新生成

当对 Strapi 的 API 执行请求时,应使用以下语法将 API 令牌添加到请求的 Authorization 标头中:bearer your-api-token。记得token前固定值bearer

至此Article模型搭建已经完成了。

部署

在生产中运行服务器之前,你需要构建生产管理面板:

ini 复制代码
NODE_ENV=production yarn build

使用 production 设置运行服务器:

ini 复制代码
NODE_ENV=production yarn start

建议使用 pm2 来管理Node进程。

也可以根据环境使用环境变量来配置你的应用,例如:

javascript 复制代码
// /config/server.js
module.exports = ({ env }) => ({
	host: env('HOST', '0.0.0.0'),
	port: env.int('PORT', 1337),
});

然后你可以创建 .env 文件或直接在你选择的部署平台中设置环境变量:

ini 复制代码
HOST=10.0.0.1
PORT=1338

最后

欢迎大家体验,快去实现你的第一个博客项目吧!

相关推荐
zhoupenghui1689 分钟前
golang时间相关函数总结
服务器·前端·golang·time
White graces23 分钟前
正则表达式效验邮箱格式, 手机号格式, 密码长度
前端·spring boot·spring·正则表达式·java-ee·maven·intellij-idea
庸俗今天不摸鱼24 分钟前
Canvas进阶-4、边界检测(流光,鼠标拖尾)
开发语言·前端·javascript·计算机外设
bubusa~>_<1 小时前
解决npm install 出现error,比如:ERR_SSL_CIPHER_OPERATION_FAILED
前端·npm·node.js
流烟默2 小时前
vue和微信小程序处理markdown格式数据
前端·vue.js·微信小程序
梨落秋溪、2 小时前
输入框元素覆盖冲突
java·服务器·前端
菲力蒲LY2 小时前
vue 手写分页
前端·javascript·vue.js
天下皆白_唯我独黑2 小时前
npm 安装扩展遇到证书失效解决方案
前端·npm·node.js
~欸嘿2 小时前
Could not download npm for node v14.21.3(nvm无法下载节点v14.21.3的npm)
前端·npm·node.js
化作繁星3 小时前
React 高阶组件的优缺点
前端·javascript·react.js