获取 HTTP 请求并导航 - Chrome

Question

这是我运行在 Chrome 的控制台 window 中 POST 请求的示例。

fetch("https://demo.wpjobboard.net/wp-login.php", {
  "headers": {
    "Host": "demo.wpjobboard.net:443",
    "Content-Length": "19",
    "Cookie": "wpjb_transient_id=1607759726-1847; wordpress_test_cookie=WP+Cookie+check",
    "Content-Type": "application/x-www-form-urlencoded"
  },
  "body": "log=7887&pwd=789789",
  "method": "POST",
}).then(console.log);

我需要导航并查看 HTML 在 chrome 中呈现的结果，而不仅仅是在控制台中看到一些复杂的结果。如何实现？

Answer 1

Fetch returns promise，首先你得到的是来自服务器的流数据。您需要将其转换为文本或 JSON 之后您可以像普通变量一样使用它。

我已将您的 URL 和选项移到单独的变量中，以便将代码集中在获取请求的实现上。

const url = `https://demo.wpjobboard.net/wp-login.php`
const opts = {
  headers: {
    'Cookie': `wpjb_transient_id=1607759726-1847; wordpress_test_cookie=WP+Cookie+check`,
    'Content-Type': `application/x-www-form-urlencoded`
  },
  body: `log=7887&pwd=789789`,
  method: `POST`,
}

fetch(url, opts)
  .then(res => res.text()) // if you get json as response use: res.json()
  .then(html => {
    const win = window.open(``, `_blank`)
    win.document.body.innerHTML = html
    win.focus()
  })

获取 HTTP 请求并导航 - Chrome

Fetch HTTP Request and Navigate - Chrome

google-chrome

google-chrome-devtools