我正尝试代理到某个特定的API端点,该端点返回一个html页面,但出现错误
Access to font at 'https://data.domain.com/v3/assets/fonts/glyphicons-halflings-regular.woff2' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
GET https://data.domain.com/v3/assets/fonts/glyphicons-halflings-regular.woff2 net::ERR_FAILED
在我的角度应用程序中,我具有三个要代理的目标。前两个代理工作正常,但另一个有点奇怪。
我的proxy.conf.json
文件看起来像这样……
{
"/API": {}, // First proxy works fine
"/info": {}, // Second proxy fine too
"/data": {
"target": "https://data.domain.com/v3/uk",
"secure": false,
"pathRewrite": {
"^/data": ""
},
"changeOrigin": true,
"logLevel": "debug"
}
}
因此,在我的数据服务中,我定义了一个变量data
,其中包含路径'/data'
,然后像这样在我的POST请求中将其作为路径传递...
private data = '/data';
public fetchData(data: Data) {
return this.http.post(this.data, data, {responseType: 'text');
}
发出该发布请求后,我期望返回的值是一些我想绑定到模板的html代码。问题就在这里。您会看到,返回的HTML看起来像这样...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>My Page</title>
<!-- Bootstrap -->
<link href='https://fonts.googleapis.com/css?family=Ubuntu:300' rel='stylesheet' type='text/css'>
<link href="https://data.domain.com/v3/assets/css/bootstrap.min.css" rel="stylesheet">
<link href="https://data.domain.com/v3/assets/css/loading-bar.min.css" rel="stylesheet">
<link href="https://data.domain/v3/assets/css/custom.css" rel="stylesheet">
</head>
<body
<p class="title">Page Title</p>
</body>
</html>
看到引导程序导入了吗?我认为这是导致问题的原因,因为在bootstrap.min.css
代码中,对glyphicons-halflings-regular
字体的引用是如此……
url(../fonts/glyphicons-halflings-regular.woff2) format('woff2'),url(../fonts/glyphicons-halflings-regular.woff) format('woff'),url(../fonts/glyphicons-halflings-regular.ttf) format('truetype')
因此,对于每种字体格式,我都会得到完全相同的错误。 我该怎么解决?