New Closed Beta: Dockerized Services

We are pleased to announce our Closed Beta for our Docker Images is ready to use for some of our most popular premium features. 

Already, here at Tiny we’ve given you the ability to create your own Docker Images from scratch, but with our latest release, Tiny is now releasing the docker Images created on your behalf. Your developers no longer need to worry about creating, and maintaining yet another piece of code in your application. 

Why Docker and TinyMCE? 

TinyMCE is used in millions of different applications, some of which contain very complex systems that need to be easily maintained and upgraded. Docker provides developers with the ability to package and run an application within an isolated container. 

Because a docker image is a lightweight, standalone executable package of software that includes everything needed to run an application, it makes deployment easier and more predictable for our customers. 

Utilizing TinyMCE for Docker helps to take away surprises, helping to ensure the application and dependencies will be deployed in the same way. 

We know some existing TinyMCE customers currently run a servlet container (tomcat/jetty) just to run our services. With TinyMCE for Docker, a servlet container will no longer be necessary, which will help simplify both the maintenance and development process.

What can I trial? 

As part of the TinyMCE Docker Beta, we are offering Dockerized services for the following features;

• Enhanced Media Embed
• Link Checker
• Spell Checker Pro 

These features are all available in our Professional Plan and Flexible plans. 

How do I access the Beta? 

Note: while the Insights Program was the pathway to participate for this project, the TinyMCE Roadmap offers a way forward for registering ideas and features you'd like to see TinyMCE offer in the future. 

As this is a Closed Beta you can only access it via our Insights Program. 

Once you sign up for the program, our Insights Program Manager will reach out to organize sending you instructions on how to access the Beta, organize your secret access key, and more importantly get you in contact with the developers responsible in case you run into any technical issues. 

Once you have signed-up, the development team will be able to provide you with your Tiny Dockerized Services secret key, which will allow you to access these containers. You will also be provided with in-depth instructions on how to set-up and configure this beta. 

Participating in this beta isn’t a time-consuming process, taking far less time than building a docker Image yourself. It should add minimal effort to your developers, it is about ensuring that what we have created fits your developer’s use-case and needs, helping us to create an even better product. 

Getting started with TinyMCE Spelling Services for Docker

Once you have received your secret key, getting started with Docker for TinyMCE is simple. Below is an example of how to set-up Docker for our Spelling Services, usually referred to as Spell Checker Pro. 

Step 1- Access Docker 

Firstly, you need to login to the Tiny Cloud Docker registry:

$ docker login docker.tiny.cloud

It will prompt for a username, then a password:

$ Username: tiny/tiny-premium

$ Password: {the-secret-key-you-have-been-given}

Step 2 - Pulling the Docker Image

You will then need to pull the image from the Docker registry

docker pull docker.tiny.cloud/ephox-spelling:latest

Step 3 - Running the Docker Container 

You will now need to run the Docker container from the image

docker run -p 18080:18080 docker.tiny.cloud/ephox-spelling:latest

This will then trigger the -p 18080:18080 to open the service on localhost:18080. On the docker container, the service will be running in port 18080, so this will map that port to the specified port on your localhost.  

If this has been set-up correctly, you should see something like this appear: 

2020-12-04 04:36:02.611Z [ioapp-compute-0] INFO  ironbark - ironbark
2020-12-04 04:36:02.923Z [ioapp-compute-0] WARN  c.e.d.config.AllowedOriginsConfig$ - No allowed-origins specified in config!
2020-12-04 04:36:02.953Z [ioapp-compute-0] INFO  ironbark - ironbark config loaded successfully: IronbarkConfig(Logger[ironbark],SpellingConfig(None),OriginWhitelist(List()),None)
2020-12-04 04:36:03.718Z [scala-execution-context-global-13] INFO  o.h.b.c.nio1.NIO1SocketServerGroup - Service bound to address /0.0.0.0:18080
2020-12-04 04:36:03.723Z [scala-execution-context-global-13] INFO  o.h.server.blaze.BlazeServerBuilder -
  _   _   _        _ _
 | |_| |_| |_ _ __| | | ___
 | '   _|  _| '_ _  _(_-<
 |_||___|__| .__/ |_|/__/
             |_|
2020-12-04 04:36:03.804Z [scala-execution-context-global-13] INFO  o.h.server.blaze.BlazeServerBuilder - http4s v0.21.3 on blaze v0.14.11 started at http://0.0.0.0:18080/

You will notice that when you run this command, there will be a log warning shown relating to "allowed-origins" not being configured. This is expected behavior as we will be setting this up in a further step. 

Step 4 - Configure your Docker Container with Environment Variables

One way to configure the docker container is to use environment variables. There is also an option to use a Mounting Configuration File. If you would prefer this method, these instructions will be provided by our team when you join the beta.  

The default configuration file available at /ephox-spelling/ephox-spelling-docker-env.conf will substitute any known environment variables provided. The environment variables it understands are:

• ORIGIN0 … ORIGIN99
• DICT_PATH

These environment variables can be specified individually using -e or using docker’s --env-file. As an example:

$ docker run -p 18080:18080 -e ORIGIN0=http://example.com docker.tiny.cloud/ephox-spelling:latest

If you are looking for more information on setting up and using Environment Variables, our team has put together more in-depth documentation. Please read steps 6-10 in this documentation for more details on how to supply environment variables to the service. 

If you are after a more complex configuration, the chances are utilizing the Mounting Configuration option will be better for your application.

Step 5 - Test the service via cURL

Whilst this is not a mandatory step, it is better to double-check you have Spell Checker Pro set-up and working properly within your container. 

To do so, once the service is running on 18080, you should notice that it is now open to receive requests. In order to double-check this, below are some of the expected outputs you should be seeing, noting that we assume http://good.com is in your allowed origins and http://bad.com is not.

To check the service is running use;

curl http://localhost:18080/version

An example output is - 2.102.0

To make sure that a request is being sent to the spelling service use;

curl http://localhost:18080/1/correction -d '{"words": ["teh"], "language": "en_US"}' -H "Origin: http://good.com" -H "Content-Type: application/json"

Finally, to check if the a request is unauthorized and coming from the wrong origin utilize; 

curl http://localhost:18080/1/correction -d '{"words": ["teh"], "language": "en_US"}' -H "Origin: http://bad.com" -H "Content-Type: application/json"

If you are receiving an error the message you should receive is - { "message": "The supplied authentication is not authorized to access this resource" }.

If you are experiencing any difficulties during this step and are not sure where the set-up went wrong, our support and development team during this Beta is able to assist. Please go ahead and make a ticket here. 

Step 6 - Test directly in TinyMCE

We would also encourage you to test this service directly within the TinyMCE service itself before deploying. 

You are able to test in the editor by configuring our Spell Checker Pro feature directly in the editor and calling it via tinymce.init. If you are running this locally on the default port of 18080, you would use these settings:

tinymce.init({
  …,
  spellchecker_rpc_url: "http://localhost:18080"
});

Get TinyMCE self-hosted 

As this service is generally used within a self-hosted environment, we would encourage you to ensure you get TinyMCE Community, which is our open source editor which can be easily extended to add our additional premium features which are included in this beta. 

 You can get a copy of the TinyMCE package in one of two ways:

• Download TinyMCE and unzip it where you need it (for example, on your application server)
• Use a package manager such as NPM, Bower, Composer, or NuGet
• If you would prefer a Cloud-hosted version you can access it here

Once you have the TinyMCE package locally available to your application, you can load it on your application pages with the following script:

<script src="/path/to/tinymce/tinymce.min.js"></script>

For example, in a simple HTML page:

<!DOCTYPE html>
<html>
<head>
  <script src="/path/to/tinymce/tinymce.min.js"></script>
  <script type="text/javascript">
  tinymce.init({
    selector: '#mytextarea'
  });
  </script>
</head>
<body>
  <h1>TinyMCE Quick Start Guide</h1>
  <form method="post">
    <textarea id="mytextarea">Hello, World!</textarea>
  </form>
</body>
</html>

Please note that with the above, all docker service URLs will also need to be configured within the TinyMCE editor.

The above should appear in your editor and you are ready to begin configuring our advanced features utilizing Docker.

If you'd like to see more features like TinyMCE and Docker in the future, check on the TinyMCE Roadmap!