image-hash's Introduction

Browser image hash

This is browser image hash generator.

This library is made to generate the same hash as image-hash as much as possible.

Supported.

difference hashing (dHash)

Feature Suuport.

average hashing (aHash)
perception hashing (pHash)
wavelet hashing (wHash)

Installation

$ npm install browser-image-hash

Basic Using

import {DifferenceHashBuilder, Hash} from 'browser-image-hash';

document.addEventListener('DOMContentLoaded', async () => {
  const builder = new DifferenceHashBuilder();
  const targetURL = new URL('./example.jpg', window.location.href);
  const destHash = await builder.build(targetURL);
  const srcHash = new Hash('0111011001110000011110010101101100110011000100110101101000111000');

  if (srcHash.getHammingDistance(destHash) <= 10) {
     console.log('Resembles');
     return;
  }

  console.log('Different');
});

⚠️ Since this library uses canvas, please be careful of the same origin policy.

Allowing cross-origin use of images and canvas

image-hash's People

Contributors

Stargazers

Watchers

image-hash's Issues

test faild.

The test is currently being fail due to an update to the dependency package, so please make sure the test passes.

add example.

Create an example directory in the project root and create a simple example that uses this library.

The sample meets the following requirements.

Drag and drop images to upload them.
Output the value of the uploaded dhash as a string to DOM.
Allow the example code to be built with esbuild. (call esbuild by npx.)
The web server will document how to set up the server so that it can be validated by the built-in server, such as php -S or python -m or npx http-server.

Recommend Projects