小编Viv*_*vek的帖子

我是 next.js 的新手，在尝试将环境变量部署到 Vercel 时遇到问题。

我们正在尝试将 Stripe 支付网关部署到 Vercel

从https://github.com/tmarek-stripe/demo-react-stripe-js下载 Stripe 支付网关示例代码

这是一个带有 .env 文件的 nextjs 应用程序，该文件具有公钥和密钥对。在 localhost 上运行时一切正常，当我将 .env 文件包含在 git 存储库中时，项目在 Vercel 上也正常运行

一旦我将 .env 文件包含在 gitignore 中并将更新推送到存储库，.env 文件就不会显示，并且在尝试进行测试付款时收到 500 服务器错误

付款时出错

下面是支付intent.js的代码

import Stripe from "stripe";

const stripe = new Stripe(process.env.SECRET_KEY);

export default async (req, res) => {
  if (req.method === "POST") {
    try {
      const { amount } = req.body;
      
      const paymentIntent = await stripe.paymentIntents.create({
        amount,
        currency: "usd"
      });

      res.status(200).send(paymentIntent.client_secret);
    } catch (err) {
      res.status(500).json({ …

经过大量研究，关注 YouTube 视频https://youtu.be/Ny5vJRfQito并将支付网关部署到 Azure。

但是，在付款时，遇到以下问题，说明没有找到 payment_intent.js

404 payment_intent.js 未找到错误

控制台出错

以下是存储库中可用文件的屏幕截图

DevOps Repo 中可用的文件

借助URL https://myapp.scm.azurewebsites.net/DebugConsole/?shell=powershell导航到Azure App Service，发现文件不在列表中，如下图

Azure 应用服务中的文件列表

谷歌搜索了很多，但找不到解决方案。

如果这里有人可以帮助我在 Azure 上进行部署以及需要采取哪些其他步骤来解决问题，我将不胜感激。

如果需要任何其他详细信息，请告诉我

提前致谢

更新

这是一个 Next.js 应用程序，最终的项目文件存储在OUT文件夹中，因为 next.js 没有构建文件夹，如下所示。同样的文件也显示在 www 根目录下。

代码在 localhost 上运行良好，以下是完整的文件夹结构

项目文件夹结构

下面是构建管道的屏幕截图

构建管道

下面是out文件夹

文件夹结构和文件