Question

我已经在视频后面的后端实现了一个端点。Download a file from a RESTful Web Service.我的工作是从angular 6下载一个zip文件。当我在浏览器中点击url时，我正在运行服务器。已下载。我正在尝试How to use JAX-RS and Angular 2+ to download a zip file。在我的角度代码中，行response.blob()和method: RequestMethod.Get下划线。我无法检查文件是否将下载，存在更好的解决方案。我是初学者

端点

 @GET
    @Path("download/{id}")
    @Produces("application/zip")
    public Response download(@PathParam("id") Integer id) {
        ResponseBuilder response;
        try {
            int userId = angularsession.SessionManager.getOwnerID();
            String filepath = EntryController.download(userId, id);
            File file = new File(filepath);
            String filename = FileManager.onlyFileNameFromAbsolutePath(filepath);

            response = Response.ok((Object) file);
            response.header("Content-Disposition", "attachment; filename=" + filename);
//            return Response.status(Response.Status.OK).header("Content-Disposition", "attachment; filename=" + filename).entity((Object) file).build();

        } catch (FileNotFoundException | PermissionException ex) {
            response = Response.status(Status.NOT_FOUND);
        } catch (IOException ex) {
            response = Response.status(Status.INTERNAL_SERVER_ERROR);
        }
        return response.build();
    }

过滤器交叉原点

<filter>
        <filter-name>CorsFilter</filter-name>
        <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
        <init-param>
            <param-name>cors.allowed.origins</param-name>
            <param-value>*</param-value>
        </init-param>
        <init-param>
            <param-name>cors.allowed.methods</param-name>
            <param-value>GET,POST,HEAD,OPTIONS,PUT,DELETE</param-value>
        </init-param>
        <init-param>
            <param-name>cors.allowed.headers</param-name>
            <param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers,Authorization</param-value>
        </init-param>
        <init-param>
            <param-name>cors.exposed.headers</param-name>
            <param-value>Access-Control-Allow-Origin,Access-Control-Allow-Credentials</param-value>
        </init-param>
        <init-param>
            <param-name>cors.support.credentials</param-name>
            <param-value>true</param-value>
        </init-param>
        <init-param>
            <param-name>cors.preflight.maxage</param-name>
            <param-value>10</param-value>
        </init-param>
    </filter>
    <filter-mapping>
        <filter-name>CorsFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

角度组件

onDownload(id: number) {
    this.entryService.downloadEntry(id).subscribe(
      (response) => {
        var blob = new Blob([response.blob()], { type: 'application/zip' });
        var filename = 'file.zip';
        fileSaver.saveAs(blob, filename);
      }
    );
  }

服务

downloadEntry(id: number) {
    return this.httpClient.get(`${this.url}/${this.endpoint}/${this.download}/${id}`, {
      method: RequestMethod.Get,
      responseType: ResponseContentType.Blob,
      headers: new Headers({ 'Content-type': 'application/json' })
    });
  }

文件保护程序

import fileSaver = require("file-saver");

依赖项

"file-saver": "^1.3.8",

如何在前端使用angular 2+从静态后端下载zip文件

0 个答案: