在Angular 7中,浏览器默认不允许加载本地资源,这是为了保证安全性。然而,可以通过以下两种方法解决这个问题。
方法一:使用proxy配置
proxy.conf.json
的文件。proxy.conf.json
文件中添加以下内容:{
"/api": {
"target": "http://localhost:3000",
"secure": false
},
"/assets": {
"target": "http://localhost:4200",
"secure": false
}
}
这个配置文件将会将所有以/api
和/assets
开头的请求转发到指定的目标地址。
package.json
文件中的scripts
对象下添加一个新的命令:"start": "ng serve --proxy-config proxy.conf.json"
npm start
命令启动Angular应用,现在应该可以加载本地资源了。方法二:使用Angular的内置代理
angular.json
文件。serve
对象下的options
属性,添加以下内容:"proxyConfig": "src/proxy.conf.json"
proxy.conf.json
的文件。proxy.conf.json
文件中添加以下内容:{
"/api": {
"target": "http://localhost:3000",
"secure": false
},
"/assets": {
"target": "http://localhost:4200",
"secure": false
}
}
ng serve
命令启动Angular应用,现在应该可以加载本地资源了。这两种方法都可以解决Angular 7中不允许加载本地资源的问题。根据实际情况选择其中一种方法即可。