title: 403 Forbidden on Console.log When Calling <img src="{{item.photo}}"> on Ionic 3
body: <p>I made an APi call and want to retrieve {{item.photo}} which contains value of something like </p>
  
  <pre><code>http://example.com/img/1461212599.jpg
  </code></pre>
  
  <p>there is no problem when i opened it in a browser. the image is shown fine. but got error 403 forbidden when accessing it from Ionic 3 app.</p>
  
  <p>What could be the problem and how to resolve it?</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p><strong>Rest Provider</strong></p>
  
  <pre><code>getItembyCategory() {
      return this.http.get(this.apiUrl)
       .toPromise()
       .then(data =&gt; {
          return data;
       })
       .catch(err =&gt; {
          return err;
       })
     }
  </code></pre>
  
  <p><strong>Home.ts</strong></p>
  
  <pre><code>import { RestapiProvider } from './../../providers/restapi/restapi';
  import { Component } from '@angular/core';
  import { NavController } from 'ionic-angular';
  
  @Component({
    selector: 'page-home',
    templateUrl: 'home.html'
  })
  export class HomePage {
    items; 
  
    constructor(public navCtrl: NavController, public restProvider: RestapiProvider) {
  
    }
  
    getProduct(){
      this.restProvider.getItembyCategory()
       .then(data =&gt; {
         this.items = data['details']['item'];
      });
    }
  
    generatePriceArray(obj){
      return Object.keys(obj).map((key)=&gt;{ return obj[key]});
   }
  
  ionViewDidLoad(){
    this.getProduct();
  }
  
  }
  </code></pre>
  
  <p><strong>Home.html</strong></p>
  
  <pre><code>&lt;ion-header&gt;
    &lt;ion-navbar&gt;
      &lt;button ion-button menuToggle&gt;
        &lt;ion-icon name="menu"&gt;&lt;/ion-icon&gt;
      &lt;/button&gt;
      &lt;ion-title&gt;Home&lt;/ion-title&gt;
    &lt;/ion-navbar&gt;
  &lt;/ion-header&gt;
  
  &lt;ion-content padding&gt;
    &lt;ion-list inset &gt;
        &lt;ion-item *ngFor="let item of items"&gt;
            &lt;ion-thumbnail item-start&gt;
              &lt;img src="{{item.photo}}"&gt;
            &lt;/ion-thumbnail&gt;
            &lt;h2 text-wrap&gt;{{item.item_name}}&lt;/h2&gt;
            &lt;p *ngFor="let price of generatePriceArray(item)"&gt; {{price.price}}&lt;/p&gt;
        &lt;/ion-item&gt;
    &lt;/ion-list&gt;
  &lt;/ion-content&gt;
  </code></pre>