使用fetch和pushState是否有特定行为?

问题描述 投票:0回答:1

我在尝试使用pushState获取某些数据时遇到问题。

所以我基本上有4个功能:

  • 点击事件监听器
  • 获取所需链接的功能
  • 触发动画的功能
  • 和获取此网址的函数

一切正常,直到我尝试推动历史记录中的状态。

history.pushState在我的获取请求之前或之后,由于某种原因中断了请求:controller / controller / about.php出于某种原因。

我尝试了console.log(url);在所有4个函数上,结果都是相同的(例如要获取的良好网址:controller / about.php)

我在提取请求中尝试了history.pushState,它工作正常(例如,加载controller / about.php),但我需要使用popstate事件并再次调用相同的提取函数。

我的摘要代码:

const loadNewContent = async url => {
    const response = await fetch(url, { headers: headers });
    // Tried adding pushState inside fetch request
    // window.history.pushState(url, `${url}`, url);
};

// function that fires animations then load the last function
const changePage = url => {
    loadNewContent(url).catch(error => console.error(error));;
};

const ajax = e => {
    // Tried adding pushState before fetch fires
    // window.history.pushState(newPage, ``, newPage);
    changePage(newPage);
    // Tried adding pushState after fetch fires
    // window.history.pushState(newPage, ``, newPage);
};

// Click event fires ajax function
ajax(e);
javascript ajax fetch pushstate html5-history
1个回答
0
投票

这就是相对路径的工作方式。最后一个/之后的所有内容都将被丢弃,并添加相对URL。

[http://localhost/imparfait + controller/about.php成为http://localhost/controller/about.php

while

[http://localhost/imparfait/controller/article.php + controller/about.php成为http://localhost/controller/controller/about.php

使用绝对路径(以/开头),相对于方案的URL(以//localhost开头),绝对URL(以http://开头),或使用the URL object构造URL,这将使您指定base而不是fetchlocation.href获取它。

© www.soinside.com 2019 - 2024. All rights reserved.