前端vue/h5下载Springboot后端静态资源(txt/word/excel)

1.首先Springboot需要配置跨域和静态资源static目录存放对应的资源文件(txt等)

import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
 
@Configuration
public class CorsConfig {
 
    private CorsConfiguration buildConfig() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        corsConfiguration.addAllowedOrigin("*");
        corsConfiguration.setAllowCredentials(true);
        corsConfiguration.addAllowedHeader("*");
        corsConfiguration.addAllowedMethod("*");
        return corsConfiguration;
    }
 
    @Bean
    public CorsFilter corsFilter() {
        org.springframework.web.cors.UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", buildConfig());
        return new CorsFilter(source);
    }
 
}

2.此时静态资源txt已经可以访问了通过 http://ip:port/项目名称/xxx.txt

3.前端h5/vue通过axios下载对应地址内容即可

this.$axios({
        method: "get",
        url: url,
        responseType: "blob",
      })
        .then(function (response) {
            //下载
            let data = response.data;
            if (!data) {
              return;
            }
            var blob = new Blob([data], {
              type: "text/plain;charset=UTF-8",
            });
            var url = window.URL.createObjectURL(blob);
            var aLink = document.createElement("a");
            aLink.style.display = "none";
            aLink.href = url;
            aLink.setAttribute("download", "xxx.txt");
            document.body.appendChild(aLink);
            aLink.click();
            //下载完成移除元素
            document.body.removeChild(aLink);
            //释放掉blob对象
            window.URL.revokeObjectURL(url);
    
        })
        .catch(error => {
          console.log(error);
        });

你可能感兴趣的:(Cx_架构之旅,springboot,static,vue,h5,静态资源下载)