☰

NGINX-axios GET 请求返回我尝试通过 get 请求获取的所有静态 html 文件的 VUE.js index.html 文件

tag-icon • tag-icon nginx centos
NGINX-axios GET 请求返回我尝试通过 get 请求获取的所有静态 html 文件的 VUE.js index.html 文件

因此，我有一个 vue 应用程序，它在我的 MAC 上运行良好npm run serve。

运行npm run build并将我的代码部署到我的 CENTOS 环境（使用 NGINX），所有 .get 请求都返回网络选项卡中的 200，但内容应该是我拉入应用程序的静态 html 文件。

以下是一些代码示例：

this.axios.get(flatHtmlLocation).then(response => {
                let corsHTML = response.data;
                let htmlDoc = (new DOMParser()).parseFromString(corsHTML, "text/html");
                this.rawDog = htmlDoc;
                this.htmlData = htmlDoc.documentElement.getElementsByTagName('body')[0].innerHTML;
            })

^ 当我在 Mac 上玩游戏时，这个功能运行得很好。

我正在从特定目录的 /public/ 目录中提取静态 .html 文件。

我的文件结构如下：

应用程序名称

-- public
     index.html
     /directory-where-static-html-lives/filename.html 
  -- src
     -- components/component/file_pulling_the_static_asset.vue

这是我正在使用的生产应用程序的 .conf（NGINX）文件的副本：

    server {
    listen 80 default_server;
    listen [::]:80 default_server;


    server_name _;

    location /api/ {
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_redirect off;
        proxy_buffering off;
        proxy_pass http://some-fancy-pants-url:4000;
    }
 location /public/ {
        root /opt/location-of-my-app;
    }

    location / {
        root    /opt/location-of-my-app/dist;
        index    index.html index.htm;
        include  /etc/nginx/mime.types;
        try_files $uri $uri/ /index.html;
    }



}

我有屏幕截图，但是 ServerFault 不允许我发布它们，因为声誉不佳！

TLDR：当我GET在 UI 中发出请求并尝试时GET /opt/location-of-my-app/dist/someDirectoryName/subDirectory/nameOfFile.html，实际返回的页面200 success是：/opt/location-of-my-app/dist/index.html。

我在 NGIX.conf 文件中做错了什么导致这种情况发生？

答案1

因为/public你仍然需要添加一个try_files指令。

尝试这个

    ...

    location /public {
        root /opt/location-of-my-app;
        try_files $uri $uri/ =404;
    }

    ...

相关内容