返回

Vite-Vue 部署到 Azure Blob 存储:未经身份验证请求的 404 错误,如何解决?

vue.js

Vite-Vue 页面在 Azure Blob 存储中部署时未经身份验证的请求返回 404 错误

问题症状

将使用 Vite-Vue 框架构建的页面部署到 Azure Blob 存储后,对于未经身份验证的请求,页面会返回 404 错误响应。在开发模式下,外部地址允许所有请求。

解决方法

要解决此问题,请遵循以下步骤:

检查 CORS 设置

确保已为 Azure Blob 存储容器启用跨源资源共享 (CORS)。这将允许从不同的来源访问存储在容器中的资源。有关配置 CORS 的详细说明,请参阅 Azure 文档

使用正确的 URL

确保在请求中使用正确的 URL。对于部署在 Azure Blob 存储中的页面,URL 应类似于 https://<storage-account-name>.z6.web.core.windows.net/<container-name>/<index-file-name>.

检查文件权限

确保已为 Blob 存储容器和其中的文件设置了适当的文件权限。未经身份验证的用户应能够以只读方式访问文件。

启用静态网站托管

确保已为 Blob 存储容器启用了静态网站托管。这将允许容器直接提供静态文件。有关启用静态网站托管的详细说明,请参阅 Azure 文档

结论

通过遵循这些步骤,你可以解决 Azure Blob 存储中部署的 Vite-Vue 页面的未经身份验证请求的 404 错误响应。通过检查 CORS 设置、使用正确的 URL、检查文件权限和启用静态网站托管,你可以确保未经身份验证的用户能够访问页面。

常见问题解答

1. 为什么需要启用 CORS?

CORS 允许从不同的来源访问存储在容器中的资源。如果不启用 CORS,未经身份验证的请求将被阻止。

2. 如何检查文件权限?

可以在 Azure 门户或使用 Azure CLI 检查文件权限。有关详细信息,请参阅 Azure 文档

3. 如何启用静态网站托管?

可以在 Azure 门户或使用 Azure CLI 启用静态网站托管。有关详细信息,请参阅 Azure 文档

4. 我仍然遇到 404 错误,该怎么办?

确保已正确配置所有步骤,并检查你的代码是否存在任何错误。

5. 如何获得更多帮助?

你可以使用 Azure 论坛GitHub Issues 与社区联系并获得帮助。