NextJS和fetch拦截器随机工作

gblwokeq 于 2023-06-22 发布在其他

关注(0)|答案(2)|浏览(234)

我正在尝试将所有对/v1/*的请求修改为https://api.treedis.com/v1/ *。现在，它使用fetch-intercept与以下代码运行得很好：

fetchIntercept.register({
  request(url, _config) {
    const config = _config;
    const myHeaders = new Headers();

    if (!config.headers || !config.headers["Content-Type"]) {
      myHeaders.append("Accept", "application/json");
      myHeaders.append("Content-Type", "application/json");
    }

    let finalUrl = null;
    if (url.indexOf("http") === -1) {
      const domain = process.env.REACT_APP_DOMAIN || "http://localhost:5030";
      finalUrl = `${domain}/${url}`;
    } else {
      finalUrl = url;
    }
    config.headers = myHeaders;
    return [finalUrl, config];
  },
})

process.env.REACT_APP_DOMAIN设置为api.treedis.com。
此文件将导入到_app. js中

import App from "next/app";
import Head from "next/head";
import "../_helpers/auth-header";

class MyApp extends App {
  render = () => {
    const { Component, pageProps } = this.props;
    return (
      <>
        <Head />
        <Component {...pageProps} />
      </>
    );
  };
}

export default MyApp;

现在，当我转到https://my.bc2e.com/tour/appartement-de-4-pieces-paris-5eme（我的NextJS应用程序）时，它试图转到v1/public/getTour。在我的浏览器上，它工作得很好，但在我的客户端上，它显示以下内容：

所以拦截的行动对他没用。当他清理缓存时，它工作，拦截器开始工作，但在几次刷新后它停止工作。
所以这是相当随机的。有时候拦截器会工作，并添加process.env.REACT_APP_DOMAIN，有时候不会。我不知道为什么。
有什么想法吗？
这个NextJS应用程序托管在CloudFront上，Lambda@Edge进行路由。

next.js

来源：https://stackoverflow.com/questions/65848081/nextjs-and-fetch-interceptor-working-randomly