angular - 尝试从 4chan API 获取

Question

我正在尝试向此端点 https://a.4cdn.org/boards.json 发出 GET 请求4chan API https://github.com/4chan/4chan-API .

文档说:

CORS is supported from origins boards.4chan.org or boards.4channel.org, via http:// or https://. 

当我在浏览器中访问此端点时，我得到了 JSON，但是当我在 Angular 应用程序中发出请求时，我得到了以下响应:

headers: Object { normalizedNames: Map(0), lazyUpdate: null, headers: Map(0) }
message: "Http failure response for https://a.4cdn.org/boards.json: 0 Unknown Error"
name: "HttpErrorResponse"
ok: false
status: 0
statusText: "Unknown Error"
url: "https://a.4cdn.org/boards.json"

这是我的代码:

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

@Injectable({
  providedIn: 'root'
})
export class BoardsService {

  constructor(private http: HttpClient) { }

  getBoards() {
    this.http.get('https://a.4cdn.org/boards.json').subscribe({
      next: (data) => {
        console.log(data);
      },
      error: (err) => {
        console.log(err);
      },
      complete: () => {
        console.log('complete');
      }
    });
  }
}

有人能够让它工作吗？

我希望我不需要创建一个 API，只需使用另一个 API

Answer 1

您遇到了CORS问题。

本质上，这个 4chan API 不能从浏览器使用，除非从 4chan 上托管的页面完成。解决方法是从服务器获取，因为它不是 Web 浏览器，并且不强制执行 CORS 规则。

您不必自己托管服务器，有大量现有服务旨在规避 CORS(例如，请参阅 cors-anywhere)。请注意，这对于生产代码来说不是一个好主意，例如，有人可能会劫持 CORS 重定向服务器并做坏事。

建议您创建自己的 API，或者托管一些简单的服务器来绕过 CORS(例如 cors-anywhere)。