heic-to

Convert HEIC/HEIF images to JPEG, PNG in browser using Javascript.

Inspired by heic2any and libheif-web. The purpose of heic-to is to continuously follow up on releases of libheif to be able to preview HEIC/HEIF images in browser.

Currently, heic-to is using libheif 1.19.5 under the hood.

Release	libheif
1.1.6	1.19.5
1.1.5	1.19.5
1.1.4	1.19.4
1.1.3	1.19.3
1.1.2	1.19.2
1.1.1	1.19.1
1.1.0	1.19.0
1.0.3	1.18.2
1.0.2	1.18.2
1.0.1	1.18.2
1.0.0	1.18.1

Usage

Check whether the image is HEIC or not

import { isHeic } from "heic-to"

const file = field.files[0]
await isHeic(file)

Convert HEIC to JPEG/PNG

import { heicTo } from "heic-to"

const file = field.files[0]

const jpeg = await heicTo({
  blob: file,
  type: "image/jpeg",
  quality: 0.5
})

const png = await heicTo({
  blob: file,
  type: "image/png",
  quality: 0.5
})

Cotent Security Policy

When meets CSP issue like this:

Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive

Fix it by using csp/heic-to

- import { heicTo } from "heic-to"
+ import { heicTo } from "csp/heic-to"

Development guide

How to fast test your changes on local?

yarn s

This will open http://127.0.0.1:8080/example/ for easy testing.

How to build libheif.js from libheif on Mac

brew install cmake make pkg-config x265 libde265 libjpeg libtool
brew install emscripten

git clone git@github.com:strukturag/libheif.git

Did below changes from build-emscripten.sh

# EXPORTED_FUNCTIONS=$($EMSDK/upstream/bin/llvm-nm $LIBHEIFA --format=just-symbols | grep "^heif_\|^de265_\|^aom_" | grep "[^:]$" | sed 's/^/_/' | paste -sd "," -)
EXPORTED_FUNCTIONS=$(/opt/homebrew/opt/llvm/bin/llvm-nm $LIBHEIFA --format=just-symbols | grep "^heif_\|^de265_\|^aom_" | grep "[^:]$" | sed 's/^/_/' | paste -sd "," -)

Start building

cd libheif
mkdir buildjs
cd buildjs
USE_WASM=0 ../build-emscripten.sh ..