我正在尝试实施。我已从官方网站https://www.tiny.cloud/get-tiny/self-hosted下载了最后一个文件，并将其添加到此路径“ app / javascript / vendor / tinymce.min.js”下但是我仍然收到apikey错误。
api key error我正在前端使用带有Rails 6的Rails，并且已经用纱线安装了官方的TinyMCE React组件。
将脚本添加到application.html.erb文件中最终会出现此错误application.html.erb error
这是我的application.html.erb
<!DOCTYPE html>
<html>
<head>
<title>Test TinyCME</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<script src="../../javascript/vendor/tinymce.min.js"></script>
<%= stylesheet_pack_tag 'application', media: 'all' %>
<%= javascript_pack_tag 'index' %>
</head>
<body>
<%= yield %>
</body>
</html>
这是我放置编辑器的react组件
import React from "react";
import { Editor } from "@tinymce/tinymce-react";
const index = () => {
const handleEditorChange = (content, editor) => {
console.log("Content was updated:", content);
};
return (
<div className="container">
<Editor
name="content"
initialValue="<p>This is the initial content of the editor</p>"
init={{
height: 500,
selector: "textarea",
branding: false,
menubar: false,
plugins: [
"advlist autolink lists link image charmap print preview anchor",
"searchreplace visualblocks code fullscreen",
"insertdatetime media table paste code",
],
toolbar:
"undo redo | formatselect | bold italic backcolor | \
alignleft aligncenter alignright alignjustify | \
bullist numlist outdent indent | removeformat",
}}
onEditorChange={handleEditorChange}
/>
</div>
);
};
export default index;
似乎也可以使用Web Pack进行自我托管，但我不知道如何做到这一点，如果有人已经这样做了。他/她可能会很有帮助。
谢谢。
如果尝试使用自托管的TinyMCE时遇到API密钥错误，则意味着Tiny React Wrapper无法找到您的Tiny的自托管安装（或更具体地说，它没有找到可用的tinymce变量），因此它将尝试从云端加载TinyMCE。
Cloud TinyMCE需要一个API密钥，然后为注册域检查该API密钥。您没有发送密钥，因此TinyMCE无法确认“允许”从其加载域。
将自托管TinyMCE与React结合使用，您有两个不同的部署选项。
<head>或<body>的末尾。