如何用 contenteditable="false">【免费下载链接】docusealOpen source DocuSign alternative. Create, fill, and sign digital documents ✍️项目地址: https://gitcode.com/GitHub_Trending/do/docuseal当你把 DocuSeal 的嵌入式签署表单docuseal-form集成到自己的站点并希望用户只能预览表单而不能提交时需要用到data-token属性。根据 signing-form-javascript.md 的说明data-token是一个使用 API key 签名的 payload 的 JSON Web TokenJWT HS256并且文档明确强调JWT can be generated only on the backendJWT 只能在后端生成同时data-preview属性说明中也指出以预览模式嵌入的已完成文档Completed documents embedded in preview mode要求data-token鉴权。本文基于该文档说明如何生成预览用的 JWT 并把它传给表单。data-token 的 payload 结构在 signing-form-javascript.md 中data-token的properties定义了四个字段字段类型必填文档说明slugstring是Template or Submitter slug。当使用 Submitter slug 时无需再传 email 参数emailstring否签署人邮箱。与 Template slug 配合使用时若未指定 email表单会多显示一个 email 填写步骤external_idstring否你应用内用于标识签署人的唯一字符串previewboolean否默认false。Show form in preview mode without ability to submit it以预览模式显示表单无法提交要让表单进入预览模式就要在 payload 中把preview设为true。另外表单还有一个独立的data-preview属性作用同样是以预览模式显示表单、无法提交两者文档中是并列描述的data-preview负责开启预览展示而涉及鉴权时尤其是预览模式下的已完成文档依赖的是data-token。准备条件按文档要求你需要一个已存在的 DocuSeal 模板以及它的 slug。文档说明 slug 可以从 admin dashboard 的模板页面复制模板表单签名 URL/d/{slug}形式也可以通过/templatesAPI 返回的slug字段获取你的 DocuSeal API key。data-token的 description 明确写着 token 是 signed using the API key即必须用 API key 签名后端服务用于签发 JWT。文档示例如 form-builder-javascript.md使用的是 Node.js 的jsonwebtoken包。不要把 API key 或签名逻辑放到前端代码里——文档对data-token的加粗要求就是JWT 只能在后端生成目的是防止未授权访问文档。后端生成预览 JWT项目文档中嵌入组件的 JWT 生成写法Node.js 示例来自 form-builder-javascript.md签名方式同为 JWT HS256 API keyconst jwt require(jsonwebtoken); const token jwt.sign({ slug: {{template_slug}}, // 替换为你的模板或 Submitter slug email: {{signer_email}}, // 替换为签署人邮箱使用 Submitter slug 时可省略 preview: true // 以预览模式显示表单无法提交 }, {{api_key}});代码中的三个占位符都需要你替换{{template_slug}}换成模板或 Submitterslug{{signer_email}}换成签署人邮箱{{api_key}}换成你的 DocuSeal API key。如果 payload 里使用 Submitter slug文档说明可以不传email参数external_id可选用于在你自己的应用中标识该签署人。前端嵌入表单按 signing-form-javascript.md 的 Example Code把后端生成的 token 作为data-token传给docuseal-formscript srchttps://cdn.docuseal.com/js/form.js/script docuseal-form iddocusealForm contenteditable="false">【免费下载链接】docusealOpen source DocuSign alternative. Create, fill, and sign digital documents ✍️项目地址: https://gitcode.com/GitHub_Trending/do/docuseal创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考