当前位置：文江博客话题详情

JavaScript Vue.js GO gin

如何使用gin框架加载vue项目的静态文件？为什么这样不行？

发布于 2022-09-13 00:25:43 字数 1240 浏览 33 评论 0

在写一个小项目，前端使用vue，后端使用golang（gin），前端打包的文件部署在服务器（nginx）上可以正常访问，但是我想通过gin去实现对静态文件的访问。

这是项目目录

其中min.go

package main

import (
    "github.com/gin-gonic/gin"
)

func main() {
    engine := gin.Default()
    engine.Static("/", "./static")
    engine.Run(":8080")

}

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite App</title>
  <script type="module" crossorigin src="/assets/index.c265e3df.js"></script>
  <link rel="modulepreload" href="/assets/vendor.dc36514a.js">
  <link rel="stylesheet" href="/assets/index.ce97d0a0.css">
</head>
  <body>
    <div id="app"></div>
    
  </body>
</html>

favicon.ico和assets下的文件都可以通过127.0.0.1:8080/assets/index.c265e3df.js单独访问。但是一旦访问index.html就会出现问题

报错如下

好像和js的导入方式有关，但是我找不到相关信息。

收藏 0

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

评论（3）

韶华倾负 2022-09-20 00:25:43

index.html 的入口要改下：

    engine.GET("/", func(c *gin.Context) {
            content, err := ioutil.ReadFile("static/index.html")
        if err != nil {
            c.Writer.WriteHeader(404)
            c.Writer.WriteString("Not Found")
            return
        }
        c.Writer.WriteHeader(200)
        c.Writer.Header().Add("Accept", "text/html")
        c.Writer.Write(content)
        c.Writer.Flush()
    })

素衣风尘叹 2022-09-20 00:25:43

package web
import "embed"
//go:embed index.html
var Content embed.FS

配置入口及静态文件映射：

engine.GET("/", func(c *gin.Context) {
        c.Writer.WriteHeader(200)
        b, _ := web.Content.ReadFile("index.html")
        _, _ = c.Writer.Write(b)
        c.Writer.Header().Add("Accept", "text/html")
        c.Writer.Flush()
    })
engine.StaticFS("/assets", http.Dir("./static/assets"))
engine.StaticFile("/favicon.ico", "./static/favicon.ico")

思念满溢 2022-09-20 00:25:43

手动设置静态文件的content-type或者直接使用Iris框架。

~没有更多了~

关于作者

暂无简介

0 文章

0 评论

22 人气

关注发私信

相关话题

热门标签

操作系统程序设计 IT运维 Linux系统管理 JavaScript 服务器应用 solaris C/C++ PHP Shell BSD Vue.js aix Oracle Python HTML 系统管理 HTML5 CSS 前端

推荐作者

留蓝

文章 0 评论 0

18790681156

文章 0 评论 0

zach7772

文章 0 评论 0

Wini

文章 0 评论 0

ayeshaaroy

文章 0 评论 0

初雪

文章 0 评论 0

友情链接

我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的隐私政策了解更多相关信息。单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。

原文