在我制作应用程序 PWA 后无法访问我的 API

Question

我有一个 React 应用程序和一个在我的共享主机上运行的express.js 服务器。

在将我的应用程序转换为 PWA 之前，我将通过网站 URL 的

/api

访问我的 API。

但之后我收到此错误，并且我没有从 API 得到任何响应，只是浏览器尝试加载我的加载程序图像：

我使用Vite进行开发。

我成功地将我的应用程序转换为 PWA：

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import { VitePWA } from "vite-plugin-pwa";

const manifestForPlugin = {
    registerType: "prompt",
    includeAssets: ["favicon.ico", "apple-touch-icon.png", "masked-icon.svg"],
    manifest: {
        name: "Alibot.ir",
        short_name: "Alibot",
        description: "My personal website.",
        icons: [
            {
                src: "/android-chrome-192x192.png",
                sizes: "192x192",
                type: "image/png",
            },
            {
                src: "/android-chrome-512x512.png",
                sizes: "512x512",
                type: "image/png",
            },
            {
                src: "/apple-touch-icon.png",
                sizes: "180x180",
                type: "image/png",
                purpose: "apple touch icon",
            },
            {
                src: "/maskable_icon.png",
                sizes: "225x225",
                type: "image/png",
                purpose: "any maskable",
            },
        ],
        theme_color: "#171717",
        background_color: "#e8ebf2",
        display: "standalone",
        scope: "/",
        start_url: "/",
        orientation: "portrait",
    },
};
// https://vitejs.dev/config/
export default defineConfig({
    base: "./",
    plugins: [react(), VitePWA(manifestForPlugin)],
});

Answer 1

首先，在浏览器的开发工具（应用程序选项卡）中检查缓存存储。也许您的 API url 已缓存在缓存存储中...

事实上，您必须描述更多有关您的代码的信息。如何将您的应用程序转换为 PWA？