Javascript 无法访问@font-face中提到的字体文件

首先，我对网页包和它的加载器还不熟悉。我有一个应用程序，在其中生成一个CSS文件，该文件位于不同的域上，而请求是从该域发起的（更像是一个静态代码存储库）。问题是，服务器加载style.css文件，并导入字体，这些字体也存储在同一存储库中，访问方式如下：

@font-face {
    font-family: someFont;
    src: url(/0.0.1/fonts/f9c391f982c59a955bb0e1866fbbed4a.woff2) format("woff2"),url(/0.0.1/fonts/ac4b1e27ea3661e299554aaa429e97c5.woff) format("woff");
    font-weight: 300;
    font-style: normal;
    font-display:swap}

现在，假设这是在

style.less

文件和域

https://example.com

由于我知道CORS问题，并在我的node/Express应用程序中添加了CORS（），因此这个style.less的加载非常完美

cont cors = require('cors');
app.use(cors());

现在的问题是，time styles.css文件试图加载里面的字体，我开始得到CORS错误。当我检查标题时，所有其他发送到该存储库的请求在响应标题中都有

访问控制允许来源：'*'

，但没有字体请求

以下是加载程序的web包配置和路径：

output: {
        path: path.resolve(__dirname, `dist/client/${pkg.version}`),
        publicPath: `/${pkg.version}/`
    },

    devtool: ifProduction('nosources-source-map', 'source-map'),
module: {
        rules: [
            {
                test: /\.less$/,
                use: [MiniCssExtractPlugin.loader, 'css-loader', 'less-loader']
            },
            {
                test: /\.(ttf|eot|svg?)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: 'file-loader?name=fonts/[name].[ext]'
            },
            {
                test: /\.(png|jpg|ico|svg|eot|ttf|woff|woff2)$/,
                loader: 'url-loader'
            }
        ]
    },

---

有人能帮我解决这个问题吗？

尝试将

url

字符串括在

font-face

定义中的引号中。如下图所示

//注意引号
src:url（“/0.0.1/font/f9c391f982c59a955bb0e1866fbbed4a.woff2”）格式（“woff2”），
url（“/0.0.1/fonts/ac4b1e27ea3661e299554aaa429e97c5.woff”）格式（“woff”）；