Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

@viteHmrUrl and @viteDevUrl not resolving in Content Security Policy

Đang mở
#45 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
65/100
Loại issue
Lỗi
Độ rõ ràng
Khá rõ ràng
Mức độ hoạt động
Ít trao đổi
Công nghệ
typescript, vite
Lĩnh vực
security

Hướng nghiên cứu

Bắt đầu bằng cách theo dõi cách các từ khóa @viteDevUrl và @viteHmrUrl được ghi trong tài liệu được xử lý khi cấu hình Shield CSP được phát ra ở chế độ HMR. So sánh policy được tạo với các placeholder dạng literal được báo cáo và các origin localhost dành cho dev và WebSocket như mong đợi. Hoàn tất khi cả hai từ khóa đều được resolve và @nonce cùng các directive khác vẫn tiếp tục hoạt động.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

Package version

9.0.0

Describe the bug
Description

When configuring AdonisJS Shield CSP with the documented Vite keywords @viteDevUrl and @viteHmrUrl, the generated Content Security Policy appears to emit those keywords literally instead of resolving them to the Vite dev server URL and HMR WebSocket URL.

This causes the browser to block the Vite HMR WebSocket connection under connect-src.

Environment
  • AdonisJS app running in HMR mode
  • Local server: http://localhost:3333
  • Vite HMR WebSocket attempted at: ws://localhost:24678
  • Shield CSP enabled in report-only mode
  • Browser: Chrome
Relevant Shield configuration
import env from '#start/env'
import app from '@adonisjs/core/services/app'
import { defineConfig } from '@adonisjs/shield'

const publicAssetOrigins = ['https://assets.feldistribution.com']

if (!app.inProduction) {
  publicAssetOrigins.push('https://s3.us-east-005.backblazeb2.com')
}

const shieldConfig = defineConfig({
  csp: {
    enabled: env.get('CSP_ENABLED'),
    directives: {
      baseUri: [`'self'`],
      formAction: [`'self'`],
      frameAncors: [`'none'`],
      defaultSrc: [`'self'`, '@viteDevUrl'],
      connectSrc: [
        `'self'`,
        '@viteHmrUrl',
        'https://analytics.feldistribution.com',
        'https://www.google-analytics.com',
        'https://region1.google-analytics.com',
        'https://www.googletagmanager.com',
        'https://www.googleadservices.com',
        'https://googleads.g.doubleclick.net',
        'https://www.google.com',
        'https://www.google.ca',
        'https://ad.doubleclick.net',
      ],
      scriptSrc: [
        `'self'`,
        '@nonce',
        'https://www.googletagmanager.com',
        'https://analytics.feldistribution.com',
        'https://www.googleadservices.com',
        'https://googleads.g.doubleclick.net',
      ],
      styleSrc: [`'self'`, '@nonce', `'unsafe-inline'`],
      styleSrcAttr: [`'unsafe-inline'`],
      fontSrc: [`'self'`],
      frameSrc: [
        `'self'`,
        'https://www.google.com',
        'https://www.youtube.com',
        'https://www.youtube-nocookie.com',
      ],
      imgSrc: [
        `'self'`,
        ...publicAssetOrigins,
        'data:',
        'https://i.ytimg.com',
        'https://*.googleusercontent.com',
        'https://*.gstatic.com',
        'https://www.google-analytics.com',
        'https://www.googletagmanager.com',
        'https://googleads.g.doubleclick.net',
        'https://www.google.com',
        'https://www.google.ca',
      ],
      objectSrc: [`'none'`],
      reportUri: ['/csp-report'],
    },
    reportOnly: env.get('CSP_REPORT_ONLY'),
  },
})

export default shieldConfig
Actual behavior

The CSP violation report shows the policy still contains the raw keywords:

default-src 'self' @viteDevUrl;
connect-src 'self' @viteHmrUrl ...

The browser then blocks the Vite HMR websocket:

violated-directive: connect-src
effective-directive: connect-src
blocked-uri: ws://localhost:24678/?token=L-TsiGIT3QLz
source-file: http://localhost:3333/@vite/client

Full relevant report excerpt:

[15:10:22.658] WARN (25504): CSP violation report
    csp: {
      "csp-report": {
        "document-uri": "http://localhost:3333/fr",
        "referrer": "http://localhost:3333/fr",
        "violated-directive": "connect-src",
        "effective-directive": "connect-src",
        "original-policy": "base-uri 'self';form-action 'self';frame-ancestors 'none';default-src 'self' @viteDevUrl;connect-src 'self' @viteHmrUrl https://analytics.feldistribution.com https://www.google-analytics.com https://region1.google-analytics.com https://www.googletagmanager.com https://www.googleadservices.com https://googleads.g.doubleclick.net https://www.google.com https://www.google.ca https://ad.doubleclick.net;script-src 'self' 'nonce-jFaViDxm0jwvKG_9' https://www.googletagmanager.com https://analytics.feldistribution.com https://www.googleadservices.com https://googleads.g.doubleclick.net;style-src 'self' 'nonce-jFaViDxm0jwvKG_9' 'unsafe-inline';style-src-attr 'unsafe-inline';font-src 'self';frame-src 'self' https://www.google.com https://www.youtube.com https://www.youtube-nocookie.com;img-src 'self' https://assets.feldistribution.com https://s3.us-east-005.backblazeb2.com data: https://i.ytimg.com https://*.googleusercontent.com https://*.gstatic.com https://www.google-analytics.com https://www.googletagmanager.com https://googleads.g.doubleclick.net https://www.google.com https://www.google.ca;object-src 'none';report-uri /csp-report",
        "disposition": "report",
        "blocked-uri": "ws://localhost:24678/?token=L-TsiGIT3QLz",
        "line-number": 745,
        "column-number": 27,
        "source-file": "http://localhost:3333/@vite/client",
        "status-code": 200
      }
    }
Expected behavior

Based on the Shield documentation, @viteDevUrl should resolve to the Vite development server URL, and @viteHmrUrl should allow the HMR WebSocket connection.

I expected the emitted CSP to contain the resolved dev/HMR origins instead of the literal placeholder keywords.

Notes

Other CSP directives appear to be emitted correctly. For example, @nonce is resolved to an actual nonce value, and styleSrcAttr is emitted as style-src-attr 'unsafe-inline'.

The issue appears specific to the Vite CSP keywords not being resolved.

Reproduction repo

No response

Ngôn ngữ chính
TypeScript
Star
52
Fork
13
Merge trung bình
37 phút
Pull request đã merge (30 ngày)
1

Chuẩn bị môi trường

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.