一个比较鸡肋的前端需求，看看有没有大佬有实现方式！

[godleon]

环境

springboot + vue3 ；

需求

举例：现在我线上有一个 web 项目，比如 www.test.com ；

我进去之后，有一个用户列表，用户列表有一个查看详情按钮，点击查看详情 是跳一个 HTML 页面；

关键点

每个用户的 HTML 页面都不一样； 这就需要我在新增的时候上传针对这个用户的 HTML 静态页面，（这个文件

是我从三方渠道导出来的，导出来是一个压缩包 带 HTML + JS + CSS ），然后我新增的时候 我要针对这个用户

把压缩包导入进去，然后我在列表里 查看详情的时候 就是我导入的这个带有交互和样式的 HTML 文件；

这个需求该如何实现，其实主要就是如何存储 并且能访问到；

[maocat]

整活还得看前端，顶级 serverless

[soar0712]

首先确保 html 里的 js 和 css 引用是相对引用。上传压缩包后把内容解压到一个可以直接访问的 publish 目录，不论是 spring 自己做还是用 nginx 的，然后将链接指向 publish 下的 html 文件

[godleon]

@soar0712 如果用 Nginx 指定的话，相当于我要在 nginx 转发的地方配一个动态的指向文件的路由， 这个路由是我新增的时候 定好的

[tcper]

你上传压缩包的时候，自动解压到一个目录，把这个用户和对应目录记录一下不就得了

[dengshen]

给每一个用户建一个文件夹，把相关的静态资源放在这个文件夹里面。

[godleon]

@tcper
@dengshen
怎么在页面上通过按钮 访问到这个新建文件夹里的 HTML 呢

[retrocode]

这不就是很普通的上传逻辑吗... 你可以参考上传图片代码, 除了中间多个解压外没什么不同, 图片怎么访问, 文件怎么访问就可以了呀

[jydeng]

按用户 id 放到对应目录，然后跳转过去就好了吧

[Arionbat]

nginx 代理的 publish 目录下，新建用户 id 的文件夹，压缩包解压后的文件都放到这个文件夹里，那你前端访问这个 html 只要在 域名后加上 id/html 文件名称 就可以了

[tcper]

@godleon nginx 配好路径就完事了

[EchoWhale]

跟前端没啥关系，运维层面解决

[soar0712]

@godleon #3 不需要在 nginx 指定，nginx 指向一个固定的一级目录，你解压缩的时候创建二级目录，每个链接对应一个二级目录，链接指向的是二级目录下的 html 文件，文件夹名称你代码里生成就好了。比如 nginx 里配置一条规则，所有/detail 开头的链接，都指向/mnt 目录，你解压了一个压缩包到/mnt/aaa 目录，aaa 是你代码生成的，并且在数据库里记录了对应关系。那么列表的详情按钮指向/detail/aaa/index.html ，实际访问就是/mnt/aaa/index.html 文件了

[leokun]

不想做上传的话，可以用
iframe.contentWindow.document.open();
iframe.contentWindow.document.write(htmlContent);
iframe.contentWindow.document.close();

[leokun]

而且还安全一点，ifream 有 sandbox 模式，要不然同源访问上传 html 文件，xss 太容易了

[Tarlor]

（这个文件是我从三方渠道导出来的，导出来是一个压缩包 带 HTML + JS + CSS ）
这里面的数据肯定是有规律的，提取数据套个前端？

[snowlee]

放对象存储里啊，比如阿里云 oss , 存储和访问都解决了

[godleon]

@snowlee 这个貌似可以诶，自建一个 minio 存吧

[DKburNIng]

上传后放到你的前端静态文件目录里，文件夹名拿用户 id 命名。然后你点用户按钮，跳转到/id

[pg243911007]

qq 空间不就是这样的吗， 每个用户支持自己装扮空间， 开了 vpi 还支持自定义 css

[Eension]

一个笨办法
三种文件读取后，写入一个 html ，前提是简单的 js src 结构
然后 v-html