如何获取外部页面全部URL？含Angular动态站点解决方案

针对你提到的Angular站点（Migros优惠页面）源码中看不到URL的问题，因为这类SPA（单页应用）的内容是通过JavaScript动态渲染的，静态HTML源码里不会包含完整的链接，你可以尝试以下几种方法：

1. 直接调用站点的API接口 #

Angular应用通常会通过后台API获取数据（包括商品/页面的URL信息）。你可以通过浏览器开发者工具（F12）的Network面板，筛选XHR/Fetch类型的请求，找到返回业务数据的接口。刷新页面后，观察加载的请求，找到包含目标URL的JSON接口，然后直接请求这个接口获取数据。

示例PHP实现：

<?php
// 替换为你找到的Migros API接口地址
$apiUrl = 'https://example-migros-api-endpoint';

$curl = curl_init();
curl_setopt_array($curl, [
    CURLOPT_URL => $apiUrl,
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_HTTPHEADER => [
        'User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/118.0.0.0 Safari/537.36',
        'Accept: application/json'
    ]
]);

$response = curl_exec($curl);
curl_close($curl);

$data = json_decode($response, true);

// 根据API返回的实际结构提取URL，以下仅为示例
if (isset($data['offers']) && is_array($data['offers'])) {
    foreach ($data['offers'] as $offer) {
        echo $offer['detailUrl'] . '<br>';
    }
}
?>

2. 使用无头浏览器渲染完整页面 #

如果API接口有签名验证、难以直接调用，或者你需要获取页面上所有可见的URL，可以用无头浏览器模拟真实浏览器加载页面，渲染所有动态内容后再提取链接。常用工具包括Puppeteer（Node.js）、Playwright，或者PHP封装的spatie/browsershot。

Node.js + Puppeteer示例： #

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({ headless: 'new' });
    const page = await browser.newPage();
    // 等待页面完全加载（networkidle2表示网络请求基本停止）
    await page.goto('你的Migros页面地址', { waitUntil: 'networkidle2' });

    // 提取页面中所有a标签的完整URL
    const allLinks = await page.evaluate(() => {
        return Array.from(document.querySelectorAll('a')).map(link => link.href);
    });

    console.log(allLinks);
    await browser.close();
})();

PHP + Browsershot示例： #

首先安装依赖：

composer require spatie/browsershot

然后编写代码：

<?php
require 'vendor/autoload.php';

use Spatie\Browsershot\Browsershot;

$html = Browsershot::url('你的Migros页面地址')
    ->waitUntilNetworkIdle()
    ->bodyHtml();

$dom = new DOMDocument();
libxml_use_internal_errors(true);
$dom->loadHTML($html);
libxml_clear_errors();

$links = $dom->getElementsByTagName('a');
foreach ($links as $link) {
    echo $link->getAttribute('href') . '<br>';
}
?>

3. 提取页面全局状态数据 #

部分Angular站点会把页面数据挂载到window全局对象中（比如用于服务端渲染或状态管理的数据）。你可以在浏览器控制台输入window，查看是否有包含URL的全局变量（比如window.__INITIAL_STATE__）。如果存在，你可以通过无头浏览器获取这个变量，直接提取数据，比解析HTML更高效。

内容的提问来源于stack exchange，提问作者Ray