【vue】解决favicon 401报错问题

1.使用vue-cli脚手架

在vue.config.js里配置

  pages: {
    index: {
      entry: 'src/index.js',
      template: 'src/index.html',
      filename: 'index.html',
      favicon:'./public/favicon.ico'
    },
  },

2.使用webpack

在webpack.config.js里配置

module.exports = {
...
new HtmlWebpackPlugin({
   filename: 'index.html',
   template: 'index.html',
   inject: true,
   favicon:'./public/favicon.ico'
  }),
}

### SpringBoot 结合 Vue 时 GET 请求映射问题解决方案 当在 Spring Boot 和 Vue 的项目中遇到 `No mapping for GET` 错误时,通常是因为前端请求路径未被正确配置到对应的控制器方法。以下是几种有效的解决方案。 #### 方法一:调整静态资源访问路径 如果问题是由于尝试获取 favicon 或其他静态文件而引发,则可以通过修改 application.properties 文件来指定静态资源的位置[^1]: ```properties spring.resources.static-locations=classpath:/META-INF/resources/,classpath:/resources/,classpath:/static/,classpath:/public/ ``` 这会告诉 Spring Boot 去这些位置查找并提供静态资源给客户端。 #### 方法二:确保 REST API 路径匹配 对于像 `/hello/test` 这样的API调用失败的情况,确认后端已经正确定义了相应的路由处理函数,并且该 URL 不与其他已定义的URL冲突[^2]: ```java @RestController @RequestMapping("/hello") public class HelloController { @GetMapping("/test") public String helloWorld(){ return "Hello World!"; } } ``` 这里的关键在于保证前后端约定好的接口地址一致,同时注意区分大小写以及斜杠的存在与否。 #### 方法三:解决跨域引起的 GET 映射找不到 有时即使路径无误也会因为 CORS (Cross-Origin Resource Sharing) 设置不当而导致无法找到对应的服务端点。此时可以在 Controller 类级别或特定的方法上添加 `@CrossOrigin` 注解以允许来自特定源的请求[^3][^4]: ```java @RestController @CrossOrigin(origins = "http://localhost:8084") // 允许本地开发环境下的Vue应用发起请求 @RequestMapping("/api/v1") public class ExampleController { @GetMapping("/data") public ResponseEntity<?> getData() { Map<String, Object> data = new HashMap<>(); data.put("message", "This is some example data."); return ResponseEntity.ok(data); } } ``` 通过以上措施可以有效避免因跨域限制所造成的 GET 请求不匹配现象。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值