无法在 Mangaeden API Angular 6 中获取图像 url [英] Unable to get image url in Mangaeden API Angular 6

问题描述

我尝试获取 Mangaeden API 的信息，并且成功获得响应，但是当我从 url 呈现图像时.我收到了 403 错误.API 中的请求似乎有问题.

这是应用程序中的错误.

<块引用>

获取

I have tried to get the information of the Mangaeden API and I have successfully get a response but when I rendered the image from the url. I got an error 403. It seems there is a problem in requesting in the API.

This is the error in the application.

GET https://cdn.mangaeden.com/mangasimg/63/63df51e43ebfb8983eb39744496b27ef6173b2237535b9c2408ea32d.jpg 403

But when I tried to load the url in the browser and the next time I try it on my application, It works because I think it will cache the image in the browser.

This is the Mangaeden API Information

You can get all manga informations, chapters and mymanga with mangaeden's API. All the informations are sent in JSON format. You can either use HTTP or HTTPS (advised if you need to use the mymanga's API). Important: we require every API user to have a link to our site in their application/site. New: We also support CORS now

About this. Where can I add their link

We require every API user to have a link to our site in their application/site.

HTML

<img src="{{url}}">

Code for component

@Component({
  selector: 'app-list',
  templateUrl: './list.component.html',
})
export class ListComponent implements OnInit {
  url: String;

  constructor(private mangaedenService: MangaedenService) {}

  isRedered(id) {
    this.url = null;

    this.mangaedenService.getInfo(id)
      .subscribe(data => {
        this.url = 'https://cdn.mangaeden.com/mangasimg/' + data.image;
      });
  }
}

Code for service

import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';
import { HttpClient } from '@angular/common/http';

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

  constructor(private http: HttpClient) {}

  getInfo(id) {
    return this.http.get('https://www.mangaeden.com/api/manga/' + id)
      .map(this.extract);
  }

  private extract(res: Response | any) {
    return res || {};
  }
}

解决方案

Actually, there is no problem in my code. I got error when rendering images in html which got 403 response. I added this in my html code and It works.

<meta name="referrer" content="no-referrer"/>

You can also check this out

Remove http referer

这篇关于无法在 Mangaeden API Angular 6 中获取图像 url的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！