---
title: How to Make a Backend for Finder
description: Set up a server-side backend for Jodit file browser and image upload.
keywords: file browser backend, finder backend, image upload, server setup
---

# How to make a backend for finder

To save files on your server, a configured backend must be installed on it that can accept a file (photo, excel table, etc.),
put it in the desired directory (folder). Also, the server side can cut or reduce the photo, convert html to pdf, etc.
A special address on this backend will give you a list of all available files and directories.

You can independently create a program using available technologies: php, nodejs, golang, java.
It is not difficult, it is enough to repeat the [protocol](https://github.com/xdan/jodit-connectors#api) that Jodit uses to communicate with the server.

The server must be able to return JSON in this format:

```json5
{
	success: true,
	data: {
		// some data
	}
}
```

And for example, the list of files should be like this:

```json5
{
	success: true,
	data: {
		sources: [
			{
				baseurl: 'https://xdsoft.net/jodit/finder/files/',
				path: '',
				files: [
					{
						file: 'pexels-palu-malerba-2426577.jpg',
						name: 'pexels-palu-malerba-2426577.jpg',
						type: 'image',
						thumb: '_thumbs/pexels-palu-malerba-2426577.jpg',
						changed: '01/09/2022 10:40 AM',
						size: '1.02MB',
						isImage: true
					},
					{
						file: 'pexels-leah-kelley-3722176.jpg',
						name: 'pexels-leah-kelley-3722176.jpg',
						type: 'image',
						thumb: '_thumbs/pexels-leah-kelley-3722176.jpg',
						changed: '01/09/2022 10:40 AM',
						size: '745.82kB',
						isImage: true
					}
				],
				name: 'default'
			}
		],
		code: 220
	}
}
```

You can easily generate such a JSON file yourself. But it is better to use a ready-made official implementation.

There are two options here:

- `docker image` is a universal way, suitable for any hosting with support for docker images.
- `php connector` - suitable for most hosts that already have `php`

> most preferably using a docker image

## Configuring the Jodit backend via docker

> We will not explain what docker is and how it works in this article, this is a topic for a separate discussion.

### Installing docker

> There is no point in focusing on the docker installation process, the official website has detailed installation manuals for all popular operating systems:

- [Ubuntu](https://docs.docker.com/engine/installation/linux/ubuntu/)
- [Mac](https://docs.docker.com/docker-for-mac/install/)
- [Windows](https://docs.docker.com/docker-for-windows/install/)

We also need `docker-compose`. How to install can be read [on the link](https://docs.docker.com/compose/install/).

The docker image is called [chupurnov/filebrowser](https://hub.docker.com/r/chupurnov/filebrowser)

To test the work, it is quite enough, just run the command on your computer:

```bash
docker pull chupurnov/filebrowser && docker run -t -i -p 8080:80 chupurnov/filebrowser
```

> To stop the server press CTRL+C

And if you then go to the page `http://localhost:8080?action=files`, you will see the following message:

```json
{
	"success": false,
	"time": "2022-01-09 19:45:25",
	"data": {
		"messages": [
			"You need override `checkAuthentication` method in file `Application.php` more https://github.com/xdan/jodit-connectors#configuration"
		],
		"code": 501
	},
	"elapsedTime": null
}
```

The error tells us that we must think about the security of our application and write a method for authorizing the user.
In the first couples, you will probably be able to just mute this method.
To do this, we need to tell the docker image to use a different file `Application.php`

Let's create a folder `jodit-connecotor` on your computer, and create a file there `Application.php`:

```bash
mkdir ./jodit-connector && touch ./jodit-connector/Application.php
```

Open the generated file in some code editor, for example in [VSCode](https://vscode.dev/)

And add a class to it, with which we override the behavior `checkAuthentication`:

```php
<?php
use Jodit\Application;

class JoditRestApplication extends Application {
    function checkAuthentication() {
      // Do hothing
    }
}
```

> It is not recommended doing the `checkAuthentication` method in the production server.
> In it, you need to check whether the user has any privileges, whether he has a cookie, etc. But for a test environment, this is fine.

save the file and start the server again, but with the overridden `Application.php` file

```bash
docker run -t -i -p 8080:80 -v $(pwd)/jodit-connector/Application.php:/var/www/Application.php chupurnov/filebrowser
```

When you visit the `http://localhost:8080?action=files` page again, you will see an empty file list with no error:

```json
{
	"success": true,
	"time": "2022-01-09 19:59:36",
	"data": {
		"sources": [
			{
				"baseurl": "http://localhost:8080/",
				"path": "",
				"files": [],
				"name": "default"
			}
		],
		"code": 220
	}
}
```

Now this address can be used in local development:

```js
const config = {
	filebrowser: {
		ajax: {
			url: 'http://localhost:8080/'
		}
	},
	uploader: {
		url: 'http://localhost:8080/?action=fileUpload'
	}
};
Jodit.make('#editor', config);
```

All added images to such uploaded via [Jodit.Finder](https://xdsoft.net/jodit/pro/docs/plugin/finder) will be immediately removed after the container is stopped.
If you want to prevent this from happening, or if you want the connector to return a list of files when you first start it, then just create a folder

```bash
mkdir ./jodit-connector/images
```

Put several images in it, and run the docker image with this folder as storage:

```bash
docker run -t -i -p 8080:80 \
  -v $(pwd)/jodit-connector/Application.php:/var/www/Application.php \
  -v $(pwd)/jodit-connector/images:/var/www/files \
   chupurnov/filebrowser
```

And go to the address `http://localhost:8080?action=files&path=files`, then we will see these same files in the list.

### Additional connector configuration

The connector also allows you to customize itself through a configuration file.
Create a file `config.php`

```bash
touch ./jodit-connector/config.php
```

And open it in an editor. Let's add a basic configuration:

```php
<?php
return [
    "allowCrossOrigin" => true,
    "allowReplaceSourceFile" => true,
    "debug" => false,
    "maxFileSize" => "5Mb",
    "memoryLimit" => "256Mb",
    "sources" => [
        "default" => [
            "title" => "Images",
            "root" => '/var/www/files',
            "baseurl" => "http://localhost:8080/"
        ]
    ]
];
```

> You can find the values of all settings [here] (https://github.com/xdan/jodit-connectors#configuration)

Start the server again:

```bash
docker run -t -i -p 8080:80 \
  -v $(pwd)/jodit-connector/Application.php:/var/www/Application.php \
  -v $(pwd)/jodit-connector/config.php:/var/www/config.php \
  -v $(pwd)/jodit-connector/images:/var/www/files \
   chupurnov/filebrowser
```

> Now the base folder becomes `files` and there is no need to specify it in the path, open `http://localhost:8080?action=files`

### Docker Compose

So it is not customary to run an image on the docker server.
It is very inconvenient to type such a command on the server every time.
It is much more convenient to use [docker-compose](https://docs.docker.com/compose/) for this.

Create a file `docker-compose.yml`

```bash
touch ./jodit-connector/docker-compose.yml
```

Open the file in a code editor

And fill in like this:

```yaml
# docker compose version
version: '2'
# List of our services (containers)
services:
    jodit:
        # we have our own image, we indicate the name
        image: chupurnov/filebrowser

        # The port through which our connector will be opened. For a sold server it is probably better to use 80:80
        ports:
            - '8080:80'

        # mount the directory with projects
        volumes:
            - ./Application.php:/var/www/Application.php
            - ./config.php:/var/www/config.php
            - ./images:/var/www/files
```

Go to the `jodit-connector` folder and run` docker-compose`

```bash
cd ./jodit-connector
docker compose pull && docker compose up -d
```

To stop the server, run:

```bash
docker compose down
```

in the same folder.

This code does exactly the same as before, but now after accidentally restarting the server, your backend will be restarted.

## Setting up Jodit backend via php

To work, you need php 7.4+ and [`composer`](https://getcomposer.org/doc/00-intro.md#installation-linux-unix-macos) installed.

> We will need the same two files as in the docker solution `Application.php` and `config.php`.

Run in the working folder on your server:

```bash
composer create-project --no-dev jodit/connector
```

Go to the `connector` folder and edit the` Application.php` and `config.php` files in the same way as for the docker image solution.
The server is ready. Now, in your `nginx` configuration, set the path to this folder on your server.

```nginx
server {
  index index.php index.html;
  server_name sitename.com;
  error_log  /var/log/nginx/error.log;
  access_log /var/log/nginx/access.log;
  root /var/www/html;

  location ~ \.php$ {
    try_files $uri =404;
    fastcgi_split_path_info ^(.+\.php)(/.+)$;
    fastcgi_pass php:9000;
    fastcgi_index index.php;
    include fastcgi_params;
    fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    fastcgi_param PATH_INFO $fastcgi_path_info;
  }
}
```

and restart your nginx

```bash
nginx -s reload
```