[Vuejs]-Content Security Policy blocks my locale NUXT JavaScript files

by

-3👍

✅

I changed addMeta to false and problem solved!
I’ll explain the reason later

const self = 'localhost:*'
render: {
    csp: {
        reportOnly:false,
        addMeta: false,
        policies: {
            'default-src': [self],
            'script-src': [self, 'unsafe-inline','strict-dynamic'],
            'style-src': [self,"'unsafe-inline'"],
            'img-src':[self,'data:'],
            'object-src':[self,'self']
        }
    }
},

0👍

Examples below from mdn docs. Guess you problem can be solved by one of them. Please refer for more examples here

Example 1

A web site administrator wants all content to come from the site’s own origin (this excludes subdomains.)

Content-Security-Policy: default-src 'self'

Example 2

A web site administrator wants to allow content from a trusted domain and all its subdomains (it doesn’t have to be the same domain that the CSP is set on.)

Content-Security-Policy: default-src 'self' trusted.com *.trusted.com

Example 3

A web site administrator wants to allow users of a web application to include images from any origin in their own content, but to restrict audio or video media to trusted providers, and all scripts only to a specific server that hosts trusted code.

Content-Security-Policy: default-src 'self'; img-src *; media-src media1.com media2.com; script-src userscripts.example.com

Here, by default, content is only permitted from the document’s origin, with the following exceptions:

Images may load from anywhere (note the "*" wildcard).
Media is only allowed from media1.com and media2.com (and not from subdomains of those sites).
Executable script is only allowed from userscripts.example.com.

Leave a comment