Equivalent version of SHA256 ComputeHash (from C#) for React Native/JS

Question

I'm trying to build an equivalent version of SHA256 ComputeHash (from C#, the EXACT same output from the below sample), to React Native/JavaScript. This is the following C#:

public static string Hash(string input)
{
    if (string.IsNullOrWhiteSpace(input)) return "";

    using (SHA256 hasher = SHA256.Create())
    {
        // Convert the input string to a byte array and compute the hash.
        byte[] data = hasher.ComputeHash(Encoding.Unicode.GetBytes(input));

        // Create a new Stringbuilder to collect the bytes
        // and create a string.
        StringBuilder sBuilder = new StringBuilder();

        // Loop through each byte of the hashed data 
        // and format each one as a hexadecimal string.
        for (int i = 0; i < data.Length; i++)
        {
            sBuilder.Append(data[i].ToString("X2"));
        }

        // Return the hexadecimal string.
        return $"0x{sBuilder.ToString().ToLower()}";
    }
}

I tried the following, but it doesn't generate the same Hash:

import * as Crypto from 'expo-crypto';

const hash = await Crypto.digestStringAsync(
    Crypto.CryptoDigestAlgorithm.SHA256,
    "StringIWantToHash"
);

Would anyone know, either what's wrong with the JavaScript, or if there is an exact equivalent version of the C# one?

Try this library? https://code.google.com/archive/p/crypto-js/ and also see by using `hmacSha256` also — Tarun Lalwani, Jun 02 '20 at 04:38
So are you saying that its generating different results for same input? — Raj, Jun 02 '20 at 08:20
@Raj I don't see why that would make any difference, that would only make the result worse. I just tried :) — Kevin Jensen Petersen, Jun 02 '20 at 14:51

Muhammad Numan · Answer 1 · 2020-06-02T16:36:24.270

Expo React Native:

Solution 1: install sha256 by

yarn add sha256

import React, { Component } from "react";
import { Text, StyleSheet, View } from "react-native";
const sha256 = require("sha256");

const isNullOrWhitespace = (input) => {
  if (typeof input === "undefined" || input == null) return true;
  return input.replace(/\s/g, "").length < 1;
};

const getByteArray = (input) => {
  let bytes = [];
  for (var i = 0, k = 0; i < input.length; i++, k += 2) {
    bytes[k] = input.charCodeAt(i);
    bytes[k + 1] = 0;
  }
  return bytes;
};


const hash = async (input) => {
  if (isNullOrWhitespace(input)) {
    return "";
  }
  var bytes = getByteArray(input);
  const hashString = "0x" + sha256(bytes, { asBytes: false });
  return hashString;
};

export default class App extends Component {
  state = {
    encodedString: "",
  };
  async UNSAFE_componentWillMount() {
    const encodedString = await hash("test2"); //0x39a2272982dc7e6e5d109ab36ec280f6cd3b4b7440af5c739ed808d4ec02aae4
    this.setState({ encodedString: encodedString });
  }
  render() {
    const { encodedString } = this.state;
    return (
      <View style={styles.container}>
        <Text>{encodedString}</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
  },
});

Solution 2:

you are using ToString("X2") in c# which means you have to convert hash to HEX (base 16)

here id demo: https://snack.expo.io/@nomi9995/expo-crypto

you need to convert hash to HEX (base 16) like this

await hash.toString(16);

try this it will give the same result as c#

Code :

  import React, { Component } from "react";
  import { Text, StyleSheet, View } from "react-native";

  import * as Crypto from "expo-crypto";

  const isNullOrWhitespace = (input) => {
    if (typeof input === "undefined" || input == null) return true;
    return input.replace(/\s/g, "").length < 1;
  };

  const hash = async (input) => {
    if (isNullOrWhitespace(input)) {
      return "";
    }
    let hash = await Crypto.digestStringAsync(
      Crypto.CryptoDigestAlgorithm.SHA256,
      input
    );
    const sBuilder = await hash.toString(16);

    return `0x${sBuilder.toLowerCase()}`;
  };

  export default class App extends Component {
    state = {
      encodedString: "",
    };
    async UNSAFE_componentWillMount() {
      const result = await hash("StringIWantToHash"); //here you can pass your string
      this.setState({ encodedString: result });
    }
    render() {
      const { encodedString } = this.state;
      return (
        <View style={styles.container}>
          <Text>{encodedString}</Text>
        </View>
      );
    }
  }

  const styles = StyleSheet.create({
    container: {
      flex: 1,
      justifyContent: "center",
      alignItems: "center",
    },
  });

Node js:

install crypto-js by

yarn add crypto-js

try this it will give the same result as c#

var CryptoJS = require("crypto-js");

const isNullOrWhitespace = (input) => {
  if (typeof input === "undefined" || input == null) return true;
  return input.replace(/\s/g, "").length < 1;
};

const hash = (input) => {
  if (isNullOrWhitespace(input)) {
    return "";
  }
  let hash = CryptoJS.SHA256(input);
  const sBuilder=hash.toString(CryptoJS.enc.Hex);

  return `0x${sBuilder.toLowerCase()}`;
};


const result=hash("StringIWantToHash");
console.log(result,"result"); // it will give the same result as C#

Here is an example of me trying it out with some input. **Input: test2** ``React Native/Expo returns: 0x60303ae22b998861bce3b28f33eec1be758a213c86c93c076dbe9f558c11c752`` ``C# returns: 0x39a2272982dc7e6e5d109ab36ec280f6cd3b4b7440af5c739ed808d4ec02aae4`` The Correct one is C# as that's the one we're using in our Database too. — Kevin Jensen Petersen, Jun 02 '20 at 14:03
can you post input string here so I can identify which is the actual problem? — Muhammad Numan, Jun 02 '20 at 14:11
@KevinJensenPetersen I have done. you can check Solution1 in my answer — Muhammad Numan, Jun 02 '20 at 16:40
@Muhammed Numan Yes that seems to be the solution, however ``picolino`` answered before you and has a bit cleaner solution, so I went with him. I do however MUCH appreciated your time and help on this matter, and you're definitely getting a huge thumbs up from me! — Kevin Jensen Petersen, Jun 02 '20 at 16:42
@KevinJensenPetersen sorry, there was a problem in my internet and I solved and unable to post my answer my bad luck — Muhammad Numan, Jun 02 '20 at 16:45
@Muhammed Numan Sorry to hear :/ But I still do appreciate your solutions! Without people like you, questions like these would never be answered ^_^ — Kevin Jensen Petersen, Jun 02 '20 at 16:53

picolino · Accepted Answer · 2020-06-02T17:31:19.453

Solution 1: Use UTF8 instead of Unicode

Well, this is an Encoding problem.

Encoding.Unicode is Microsoft's misleading name for UTF-16 (a double-wide encoding, used in the Windows world for historical reasons but not used by anyone else). http://msdn.microsoft.com/en-us/library/system.text.encoding.unicode.aspx (see this answer)

You should be using Encoding.UTF8.GetBytes instead.

Using js-sha256 library like this:

const jssha = require('js-sha256')

function hash(input)
{
    const hashString = "0x" + jssha.sha256(input)
    return hashString;
}

const hashResult = hash("StringIWantToHash")
// Output: 0x29c506d0d69a16e413d63921b7de79525c43715931d8d93127dbeb46eacda2f9

We can achieve pretty similar in C# just using UTF8 encoding:

public static string Hash(string input)
{
    if (string.IsNullOrWhiteSpace(input)) return "";

    using (SHA256 hasher = SHA256.Create())
    {
        // Convert the input string to a byte array and compute the hash.
        byte[] data = hasher.ComputeHash(Encoding.UTF8.GetBytes(input)); // Note that UTF8 here

        // Create a new Stringbuilder to collect the bytes
        // and create a string.
        StringBuilder sBuilder = new StringBuilder();

        // Loop through each byte of the hashed data 
        // and format each one as a hexadecimal string.
        for (int i = 0; i < data.Length; i++)
        {
            sBuilder.Append(data[i].ToString("X2"));
        }

        // Return the hexadecimal string.
        return $"0x{sBuilder.ToString().ToLower()}"; 
    }
}

static void Main()
{
    var hashResult = Hash("StringIWantToHash");
    // Output: 0x29c506d0d69a16e413d63921b7de79525c43715931d8d93127dbeb46eacda2f9
}

Also, I believe that other JS/React Native libraries that help to compute SHA256 hash use UTF8 encoding too, so I think you can use any other crypto libraries for that.

Solution 2: What if you need to use Unicode?

In that case, you need to manually represent C# encoding in JS code.
While you are using Unicode encoding, after every single byte in the string goes '0' byte if it is a plain Latin character. For other symbols (with more than 255 number) Unicode required 2 bytes for that.

var input = "StringIWantToHash";
var encodedInput = Encoding.Unicode.GetBytes(input);
// Output: [83, 0, 116, 0, 114, 0, 105, 0, 110, 0, ...]

So we need to represent that in our JS code:

const jssha = require('js-sha256')

function hash(input)
{
    var bytes = [];
    for (var i = 0; i < input.length; i++)
    {
        const code = input.charCodeAt(i);
        bytes = bytes.concat([code & 0xff, code / 256 >>> 0]);
    }

    const hashString = "0x" + jssha.sha256(bytes)
    return hashString;
}

const hashResult = hash("StringIWantToHash")
// Output: 0x029dbc4b54b39bed6d684175b2d76cc5622c60fe91f0bde9865b977d0d9a531d

I don't know what is wrong, but for me "StringIWantToHash" is always "``0x029dbc4b54b39bed6d684175b2d76cc5622c60fe91f0bde9865b977d0d9a531d``" on my end, while the JS is "``0x29c506d0d69a16e413d63921b7de79525c43715931d8d93127dbeb46eacda2f9``". The C# one "``0x029dbc4b54b39bed6d684175b2d76cc5622c60fe91f0bde9865b977d0d9a531d``" IS the CORRECT one. I wonder what is going wrong. Hmm — Kevin Jensen Petersen, Jun 02 '20 at 14:10
@KevinJensenPetersen I get `0x029dbc4b54b39bed6d684175b2d76cc5622c60fe91f0bde9865b977d0d9a531d` too if I use `Encoding.Unicode.GetBytes`. If I use `Encoding.UTF8.GetBytes` I have this hash: `0x29c506d0d69a16e413d63921b7de79525c43715931d8d93127dbeb46eacda2f9` The hash that generated by using `Unicode` isn't correct. Use `UTF8` hash instead. — picolino, Jun 02 '20 at 14:14
I cannot use UTF8 since our Database is dependent on it being Unicode I guess. Since the correct one is ``0x029dbc4b54b39bed6d684175b2d76cc5622c60fe91f0bde9865b977d0d9a531d `` (The Database handles THAT format) — Kevin Jensen Petersen, Jun 02 '20 at 14:20
@KevinJensenPetersen you should mention that in a question, wait some time, I already have a solution for you. — picolino, Jun 02 '20 at 14:49
I mentioned that it would have to be the exact same as my C# sample (which uses Unicode) :) — Kevin Jensen Petersen, Jun 02 '20 at 14:52
@KevinJensenPetersen I have updated my answer. Check this out. — picolino, Jun 02 '20 at 16:13
Yes this solution works! Is it possible you could tell me the difference you just made, since you had another solution 2 before with a warning sign? :) — Kevin Jensen Petersen, Jun 02 '20 at 16:34
@KevinJensenPetersen I've added all characters support, like Cyrillic and emojis =) Now this JS code works as like C# code for all characters in the input string. — picolino, Jun 02 '20 at 16:37
Perfect! This is definitely working! Accepted and will be given you the bounty when I can (which is currently in 10 hours it says) :) — Kevin Jensen Petersen, Jun 02 '20 at 16:38
How to get the original value from the hashed code generated by js-sha256??? The js-sha256 link didn't explain hot to unhash. — Petronius, Dec 07 '22 at 13:25
@Petronius the point of a hash is that it only goes one way. You can't "undo" it. — picolino, Dec 07 '22 at 20:16

Cihat Girgin · Answer 3 · 2022-03-28T11:48:17.077

after two days of research it works perfectly! Two different codes give the same result.

js

const sha1 = require('sha1');    
const getHash = str =>{
    const hashingBytes = Buffer.from(sha1(str), "hex");
    const base64Value = Buffer.from(hashingBytes).toString('base64');
    return base64Value;
}

c#

 System.Security.Cryptography.SHA1 sha = new System.Security.Cryptography.SHA1CryptoServiceProvider();
        byte[] bytes = System.Text.Encoding.ASCII.GetBytes(str);
        byte[] hashingbytes = sha.ComputeHash(bytes);
        var hash = Convert.ToBase64String(hashingbytes);

Equivalent version of SHA256 ComputeHash (from C#) for React Native/JS

3 Answers3

Expo React Native:

Node js:

Solution 1: Use UTF8 instead of Unicode

Solution 2: What if you need to use Unicode?