使用Angular HTTP-Client请求mobile.de接口遇403错误，能否获取数据？

当然可以获取到这个接口的数据！你遇到的问题本质是双重限制：浏览器的同源策略（CORS）加上服务器的访问验证（403状态码），装了CORS插件只解决了前者，但服务器本身还是拒绝了你的请求。下面给你几个可行的方案：

1. 优先尝试JSONP请求 #

你的目标接口带了_jsonp=_loadModels参数，说明它本身支持JSONP方式请求——而JSONP是不受浏览器同源策略限制的，刚好能绕开CORS问题。

在Angular里这么做：

• 首先在你的模块（比如AppModule）中导入HttpClientJsonpModule：

import { HttpClientModule, HttpClientJsonpModule } from '@angular/common/http';

@NgModule({
  imports: [
    HttpClientModule,
    HttpClientJsonpModule // 加上这个模块
  ]
})
export class AppModule {}

• 然后在组件里用jsonp方法发起请求：

import { HttpClient } from '@angular/common/http';
import { Component } from '@angular/core';

@Component({...})
export class YourComponent {
  constructor(private http: HttpClient) {}

  fetchData() {
    const url = 'https://www.mobile.de/svc/r/models/3500?_lang=de';
    // 第二个参数是接口指定的回调函数名，对应原链接里的_loadModels
    this.http.jsonp(url, '_loadModels')
      .subscribe({
        next: data => console.log('获取到的数据：', data),
        error: err => console.error('请求失败：', err)
      });
  }
}

这个方法最直接，因为接口本身就提供了JSONP支持，大概率能成功。

2. 搭建后端代理服务器 #

如果JSONP不行，那服务器可能还有其他反爬机制（比如验证请求头、Cookie等），这时候就需要用后端代理来绕开：

浏览器的同源策略只限制前端请求，后端服务器之间的请求不受限制。你可以用Node.js（Express）快速搭一个简单的代理：

• 先安装依赖：

npm install express axios

• 新建一个proxy.js文件：

const express = require('express');
const axios = require('axios');
const app = express();

// 代理接口
app.get('/mobile-models', async (req, res) => {
  try {
    // 模拟浏览器的请求头，避免被服务器识别为爬虫
    const browserHeaders = {
      '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': 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8'
    };
    // 请求目标接口
    const response = await axios.get('https://www.mobile.de/svc/r/models/3500?_jsonp=_loadModels&_lang=de', {
      headers: browserHeaders
    });
    // 返回数据给前端
    res.send(response.data);
  } catch (err) {
    res.status(err.response?.status || 500).send(err.message);
  }
});

// 启动代理服务
app.listen(3000, () => {
  console.log('代理服务器运行在 http://localhost:3000');
});

• 启动代理：node proxy.js
• 然后Angular里请求自己的代理接口：

this.http.get('http://localhost:3000/mobile-models')
  .subscribe(data => console.log(data));

这个方法几乎能解决所有跨域+反爬的问题，因为后端请求可以完全模拟浏览器的请求环境。

3. 复制浏览器请求头到Angular请求 #

如果不想搭代理，也可以试试把浏览器里能正常请求的头信息完全复制到Angular的请求中：

1. 打开浏览器开发者工具（F12），找到Network面板，刷新那个能正常访问的接口
2. 查看该请求的Request Headers，把所有关键头（比如User-Agent、Accept、Cookie等）复制下来
3. 在Angular请求中添加这些头：

import { HttpHeaders } from '@angular/common/http';

// ...

const headers = new HttpHeaders({
  'User-Agent': '你复制的浏览器User-Agent',
  'Accept': '你复制的Accept值',
  // 其他必要的头信息
});

this.http.get('https://www.mobile.de/svc/r/models/3500?_jsonp=_loadModels&_lang=de', { headers })
  .subscribe(data => console.log(data));

不过这种方法可能还是会被浏览器的CORS策略拦截，所以最好配合CORS插件使用，但如果服务器有严格的反爬，可能还是需要代理。

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