diff --git a/package-lock.json b/package-lock.json
index 5dfe8626..4c951e2d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "nostream",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "nostream",
-      "version": "2.1.0",
+      "version": "2.1.1",
       "license": "MIT",
       "dependencies": {
         "@noble/secp256k1": "1.7.1",
diff --git a/package.json b/package.json
index d1ff51ee..59cf9877 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "nostream",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "A Nostr relay written in Typescript.",
   "supportedNips": [
     1,
diff --git a/resources/index.html b/resources/index.html
index 07f3e735..e22fef48 100644
--- a/resources/index.html
+++ b/resources/index.html
@@ -7,7 +7,7 @@
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
     <link rel="stylesheet" href="./css/style.css">
   </head>
-  <body lang="en" onload="onLoad()">
+  <body lang="en">
     <main class="container">
       <form method="post" action="/invoices">
         <div class="row">
@@ -128,7 +128,7 @@ <h5 class="modal-title">Terms of Service</h5>
       </div>
     </div>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
-    <script>
+    <script nonce="{{nonce}}">
       var processor = "{{processor}}"
       function attemptGetPubkey() {
         const maxRetries = 10
@@ -157,6 +157,7 @@ <h5 class="modal-title">Terms of Service</h5>
           document.body.classList.add('dark-theme');
         }
       }
+      window.addEventListener('load', onLoad)
     </script>
   </body>
 </html>
diff --git a/resources/invoices.html b/resources/invoices.html
index 94dc1f3e..167c71b1 100644
--- a/resources/invoices.html
+++ b/resources/invoices.html
@@ -36,10 +36,10 @@ <h1 class="mt-4 mb-4 text-center text-nowrap">{{name}}</h1>
         <div class="row justify-content-center">
           <div class="card pending col-8 col-lg-4 d-flex flex-column justify-content-center mb-4">
             <div class="card-body m-auto">
-              <div id="invoice" onclick="sendPayment()"></div>
+              <div id="invoice"></div>
             </div>
             <div class="card-body d-flex flex-row justify-content-center">
-              <div class="input-group input-group-sm w-100 mw-256" onclick="copy()">
+              <div class="input-group input-group-sm w-100 mw-256" id="invoiceCopyGroup">
                 <input type="text" name="invoice" class="form-control form-control-sm" id="invoiceInput" value="{{invoice}}" readonly>
                 <span class="input-group-text" id="invoiceAlert">copy</span>
               </div>
@@ -74,7 +74,7 @@ <h2 class="text-danger">Invoice expired!</h2>
         <div class="row pending d-none">
           <div class="col">
             <div class="d-flex justify-content-center mb-3">
-              <button id="sendPaymentBtn" class="btn btn-lg btn-warning d-none" type="submit" onclick="sendPayment()">Pay with wallet</button>
+              <button id="sendPaymentBtn" class="btn btn-lg btn-warning d-none" type="submit">Pay with wallet</button>
             </div>
           </div>
         </div>
@@ -97,7 +97,7 @@ <h2 class="text-danger">Invoice expired!</h2>
     </main>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js" integrity="sha512-CNgIRecGo7nphbeZ04Sc13ka07paqdeTu0WR1IM4kNcpmBAUSHSQX0FslNhTDadL4O5SAGapGt4FodqL8My0mA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
-    <script>
+    <script nonce="{{nonce}}">
       // Check for system preference on load
       if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
         document.body.classList.add('dark-theme');
@@ -263,6 +263,10 @@ <h2 class="text-danger">Invoice expired!</h2>
       if (processor === 'zebedee') {
         document.getElementById('powered-by-zebedee').classList.remove('d-none')
       }
+
+      document.getElementById('invoice').addEventListener('click', sendPayment)
+      document.getElementById('invoiceCopyGroup').addEventListener('click', copy)
+      document.getElementById('sendPaymentBtn').addEventListener('click', sendPayment)
     </script>
   </body>
 </html>
\ No newline at end of file
diff --git a/resources/terms.html b/resources/terms.html
index 6c694fbb..da584e52 100644
--- a/resources/terms.html
+++ b/resources/terms.html
@@ -62,7 +62,7 @@ <h3>Terms of Service Agreement</h3>
       </div>
     </main>
     <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
-    <script>
+    <script nonce="{{nonce}}">
       // Check for system preference on load
       if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
         document.body.classList.add('dark-theme');
diff --git a/src/controllers/invoices/get-invoice-controller.ts b/src/controllers/invoices/get-invoice-controller.ts
index 8ac88505..f6c0de02 100644
--- a/src/controllers/invoices/get-invoice-controller.ts
+++ b/src/controllers/invoices/get-invoice-controller.ts
@@ -6,7 +6,7 @@ import { createSettings } from '../../factories/settings-factory'
 import { FeeSchedule } from '../../@types/settings'
 import { IController } from '../../@types/controllers'
 
-let pageCache: string
+
 
 export class GetInvoiceController implements IController {
   public async handleRequest(
@@ -17,16 +17,15 @@ export class GetInvoiceController implements IController {
 
     if (pathEq(['payments', 'enabled'], true, settings)
       && pathEq(['payments', 'feeSchedules', 'admission', '0', 'enabled'], true, settings)) {
-      if (!pageCache) {
-        const name = path<string>(['info', 'name'])(settings)
-        const feeSchedule = path<FeeSchedule>(['payments', 'feeSchedules', 'admission', '0'], settings)
-        pageCache = readFileSync('./resources/index.html', 'utf8')
-          .replaceAll('{{name}}', name)
-          .replaceAll('{{processor}}', settings.payments.processor)
-          .replaceAll('{{amount}}', (BigInt(feeSchedule.amount) / 1000n).toString())
-      }
+      const name = path<string>(['info', 'name'])(settings)
+      const feeSchedule = path<FeeSchedule>(['payments', 'feeSchedules', 'admission', '0'], settings)
+      const page = readFileSync('./resources/index.html', 'utf8')
+        .replaceAll('{{name}}', name)
+        .replaceAll('{{processor}}', settings.payments.processor)
+        .replaceAll('{{amount}}', (BigInt(feeSchedule.amount) / 1000n).toString())
+        .replaceAll('{{nonce}}', res.locals.nonce)
 
-      res.status(200).setHeader('content-type', 'text/html; charset=utf8').send(pageCache)
+      res.status(200).setHeader('content-type', 'text/html; charset=utf8').send(page)
     } else {
       res.status(404).send()
     }
diff --git a/src/controllers/invoices/post-invoice-controller.ts b/src/controllers/invoices/post-invoice-controller.ts
index e6fd959c..1b0f99c9 100644
--- a/src/controllers/invoices/post-invoice-controller.ts
+++ b/src/controllers/invoices/post-invoice-controller.ts
@@ -13,7 +13,7 @@ import { IUserRepository } from '../../@types/repositories'
 import { path } from 'ramda'
 import { readFileSync } from 'fs'
 
-let pageCache: string
+
 
 const debug = createLogger('post-invoice-controller')
 
@@ -26,9 +26,7 @@ export class PostInvoiceController implements IController {
   ){}
 
   public async handleRequest(request: Request, response: Response): Promise<void> {
-    if (!pageCache) {
-      pageCache = readFileSync('./resources/invoices.html', 'utf8')
-    }
+
 
     debug('params: %o', request.params)
     debug('body: %o', request.body)
@@ -174,9 +172,11 @@ export class PostInvoiceController implements IController {
       processor: currentSettings.payments.processor,
     }
 
+    const pageContent = readFileSync('./resources/invoices.html', 'utf8')
     const body = Object
       .entries(replacements)
-      .reduce((body, [key, value]) => body.replaceAll(`{{${key}}}`, value.toString()), pageCache)
+      .reduce((body, [key, value]) => body.replaceAll(`{{${key}}}`, value.toString()), pageContent)
+      .replaceAll('{{nonce}}', response.locals.nonce)
 
     response
       .status(200)
diff --git a/src/factories/web-app-factory.ts b/src/factories/web-app-factory.ts
index 627218f4..4a90fa05 100644
--- a/src/factories/web-app-factory.ts
+++ b/src/factories/web-app-factory.ts
@@ -1,5 +1,6 @@
 import express from 'express'
 import helmet from 'helmet'
+import { randomBytes } from 'crypto'
 
 import { createSettings } from './settings-factory'
 import router from '../routes'
@@ -10,20 +11,19 @@ export const createWebApp = () => {
     .disable('x-powered-by')
     .use((req, res, next) => {
       const settings = createSettings()
+      const nonce = randomBytes(16).toString('base64')
+      res.locals.nonce = nonce
 
       const relayUrl = new URL(settings.info.relay_url)
       const webRelayUrl = new URL(relayUrl.toString())
       webRelayUrl.protocol = (relayUrl.protocol === 'wss:') ? 'https:' : ':'
 
       const directives = {
-        /**
-         * TODO: Remove 'unsafe-inline'
-         */
         'img-src': ["'self'", 'data:', 'https://cdn.zebedee.io/an/nostr/'],
         'connect-src': ["'self'", settings.info.relay_url as string, webRelayUrl.toString()],
         'default-src': ["'self'"],
-        'script-src-attr': ["'unsafe-inline'"],
-        'script-src': ["'self'", "'unsafe-inline'", 'https://cdn.jsdelivr.net/npm/', 'https://unpkg.com/', 'https://cdnjs.cloudflare.com/ajax/libs/'],
+        'script-src-attr': [`'nonce-${nonce}'`],
+        'script-src': ["'self'", `'nonce-${nonce}'`, 'https://cdn.jsdelivr.net/npm/', 'https://unpkg.com/', 'https://cdnjs.cloudflare.com/ajax/libs/'],
         'style-src': ["'self'", 'https://cdn.jsdelivr.net/npm/'],
         'font-src': ["'self'", 'https://cdn.jsdelivr.net/npm/'],
       }
@@ -32,7 +32,8 @@ export const createWebApp = () => {
     })
     .use('/favicon.ico', express.static('./resources/favicon.ico'))
     .use('/css', express.static('./resources/css'))
-    .use(router)
+
+  app.use(router)
 
   return app
 }
\ No newline at end of file
diff --git a/src/handlers/request-handlers/get-terms-request-handler.ts b/src/handlers/request-handlers/get-terms-request-handler.ts
index c7c59cd3..d5f645d8 100644
--- a/src/handlers/request-handlers/get-terms-request-handler.ts
+++ b/src/handlers/request-handlers/get-terms-request-handler.ts
@@ -3,15 +3,15 @@ import { readFileSync } from 'fs'
 
 import { createSettings as settings } from '../../factories/settings-factory'
 
-let pageCache: string
+
 
 export const getTermsRequestHandler = (_req: Request, res: Response, next: NextFunction) => {
   const { info: { name } } = settings()
 
-  if (!pageCache) {
-    pageCache = readFileSync('./resources/terms.html', 'utf8').replaceAll('{{name}}', name)
-  }
+  const page = readFileSync('./resources/terms.html', 'utf8')
+    .replaceAll('{{name}}', name)
+    .replaceAll('{{nonce}}', res.locals.nonce)
 
-  res.status(200).setHeader('content-type', 'text/html; charset=utf8').send(pageCache)
+  res.status(200).setHeader('content-type', 'text/html; charset=utf8').send(page)
   next()
 }
diff --git a/tsconfig.build.json b/tsconfig.build.json
index ec7a8e21..4bb30a9b 100644
--- a/tsconfig.build.json
+++ b/tsconfig.build.json
@@ -16,7 +16,7 @@
     "inlineSources": false,
     "resolveJsonModule": true,
     "esModuleInterop": true,
-    "lib": ["ESNext"],
+    "lib": ["ESNext", "DOM"],
     "incremental": true
   },
   "ts-node": {
