# Image server

The image server is a simple nodejs express server that allows images to be uploaded with Multer and resizes the based on url scheme, resizing is done with the [node-steam](https://github.com/asilvas/node-image-steam#throttle-options) library.

See: <https://github.com/Amsterdam/openstad-image-server>

Http-bearer is used fo validating requests so only registered clients can upload images.

Knex migrations create the clients table for registering clients that are allowed to use the API.

## Prerequisites

* [Git](https://git-scm.com/)
* [Node.js and npm](https://nodejs.org/en/)
* [ImageMagick](http://www.imagemagick.org/script/index.php)
* [MySQL](https://www.mysql.com/)

## Installation

#### 1. Run npm install

```
npm i
```

#### 2. Configure .env

```
DB_NAME=
DB_USER=
DB_PASSWORD=
PORT_API=
PORT_IMAGE_SERVER=
IMAGES_DIR=
THROTTLE_CC_PROCESSORS=4
THROTTLE_CC_PREFETCHER= 20
THROTTLE_CC_REQUESTS= 100
APP_URL=
CACHE_TTS=
CACHE_OPTIMIZED_TTS=
CACHE_OPTIMIZED_TTS=
```

For throttle see options in [node-steam](https://github.com/asilvas/node-image-steam#throttle-options).

The app url is used to return a full url after upload.

Images directory defaults to images, if doesn't get created, create it manually.

#### 3. Install knex globally

```
npm install knex -g
```

#### 4. Run knex migration

```
knex migrate:latest
```

#### 5. Add a client to mysql

[See clients](#clients)

#### 6. Run the server

Run npm (or pm2, or whatever runner you use).

```
npm run start
```

## Clients

For every site create a row in the MySQL clients table. Generate a random token that's safe. Currently there is no interface for creating so create it command line or through an mysql interface like sequelpro or phpmyadmin. The seed will generate one if the ENV values is

## Uploading an image

Example with node.js, using node-fetch & form-data. Pass the access\_token that you've generated for the client, can be in url or as header "Bearer: ${token}" make sure it's over HTTPS.

```
const FormData = require('form-data');
const fetch = require('node-fetch');

exports.upload = function (token, buffer, fileName) {
  const form = new FormData();
  form.append('image', buffer, fileName);
  form.append('field', 'files');

  return fetch(process.env.IMAGE_API_URL+ '/image?access_token=' + process.env.IMAGE_API_ACCESS_TOKEN, {
    method: 'POST',
    body: form,
  })
  .then(function(res) {
    return res.json();
  })
  .then(function(json) {
    //json.url
  })
  .catch(function(err) {
    // handle error
  })
}
```

## Displaying & Resizing image

Example for creating a thumbnail resize and crop:

```
http://imageserver.com/image/path.png/:/rs=w:350,h:250;cp=w:350,h:250
```

For all options (resizing, cropping, filter, etc) check [node-steam](https://github.com/asilvas/node-image-steam).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.openstad.org/openstad/technical/image.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.