# Wasm problem for vetkeys usage

**URL:** <https://forum.dfinity.org/t/wasm-problem-for-vetkeys-usage/43050>\
**Category:** JavaScript\
**Created:** [March 27, 2025, 4:39pm UTC](https://forum.dfinity.org/t/wasm-problem-for-vetkeys-usage/43050 "2025-03-27T16:39:49Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![MykhailoIvchenko](https://sea1.discourse-cdn.com/flex023/user_avatar/forum.dfinity.org/mykhailoivchenko/32/25605_2.png) [@MykhailoIvchenko](https://forum.dfinity.org/u/MykhailoIvchenko)\
**Post date:** [March 27, 2025, 4:39pm UTC](https://forum.dfinity.org/t/wasm-problem-for-vetkeys-usage/43050/1 "2025-03-27T16:39:49Z")

</div>

Hi guys! I’ve implemented an application with vetKeys usage.  
Here is GitHub repository:  
MykhailoIvchenko/password-manager-dapp  
The application uses React + Vite for the frontend part. I copied the files from the vetkd\_user\_lib folder from this example dfinity/examples/tree/master/motoko/encrypted-notes-dapp-vetkd/  
I also copied code for encryption and decryption from this example and refactored it a little bit.  
The problem is that I get an error during the vetKeys library initialization (that uses wasm), and as a result, the encryption and decryption functions don’t work when we use them.

Here are the error messages in the console:  
Wasm Error WebAssembly.instantiate(): Refused to compile or instantiate WebAssembly module because ‘unsafe-eval’ is not an allowed source of script in the following Content Security Policy directive: “script-src ‘self’”

EvalError: Refused to evaluate a string as JavaScript because ‘unsafe-eval’ is not an allowed source of script in the following Content Security Policy directive: “script-src ‘self’”.

```
at new Function (<anonymous>)
at Object.parseJSON (sm.bundle.js:1:667)
at Object.recorder-screenshot-v3_1743092646161_0.4580180800637803

```

I’ve tried different values in the meta tag, but nothing helped. The current value is below:

```auto
<meta
      http-equiv="Content-Security-Policy"
      content="default-src 'self'; 
              script-src 'self' 'unsafe-eval' blob:; 
              worker-src 'self' blob:;
              style-src 'self' 'unsafe-inline'; 
              img-src 'self' data: blob:; 
              font-src 'self'; 
              connect-src 'self' https://icp-api.io https://*.ic0.app;"
    />

```

And here is the code for the vetkeys library initialization in the App.tsx

```auto
import { useEffect } from 'react';
import CheckAccess from './components/CheckAccess';
import DefaultPageLayout from './components/ui/DefaultPageLayout';
// @ts-ignore
import { default as vetkd_init } from './vetkd_user_lib/ic_vetkd_utils.js';
// @ts-ignore
import vetkd_wasm_url from './vetkd_user_lib/ic_vetkd_utils_bg.wasm?url';

function App() {
  useEffect(() => {
    if (!WebAssembly) {
      console.error('WebAssembly is not supported in this browser.');
    }

    fetch(vetkd_wasm_url)
      .then((res) => res.arrayBuffer())
      .then((buffer) => WebAssembly.instantiate(buffer, {}))
      .then((wasmModule) => {
        vetkd_init(wasmModule.instance);
      })
      .catch((error) => console.error('Wasm Error', error.message));
  }, []);

  return (
    <DefaultPageLayout>
      <CheckAccess />
    </DefaultPageLayout>
  );
}

export default App;

```

Maybe someone faced the same problem, so please advise how to solve it. GhatGPT and Stack Overflow weren’t very helpful.