title: Paypal Checkout | 403 Forbidden Error
body: <p>My issue is every time I click the paypal button on my page, it pops up briefly then gives a 403 forbidden error. This question is the closest to my issue <a href="https://stackoverflow.com/questions/26013941/why-do-i-keep-getting-a-403-forbidden-with-paypal">Why do I keep getting a 403 forbidden with PayPal?</a> but different because I'm using angular.</p>
  
  <p>This is the relevant part of my angular code:</p>
  
  <pre><code>import { Component, OnInit, AfterViewChecked } from '@angular/core';
  import { AngularFireDatabase } from 'angularfire2/database';
  import { ShoppingCartService} from '../shopping-cart.service';
  import { PaymentsService } from '../payments.service';
  import { environment } from '../../environments/environment';
  import { StripeToken } from 'stripe-angular';
  
  declare let paypal: any;
  
  @Component({
    selector: 'app-cartpage',
    templateUrl: './cartpage.component.html',
    styleUrls: ['./cartpage.component.css']
  })
  export class CartpageComponent implements OnInit, AfterViewChecked {
  
  cartItems;
  id = localStorage.getItem('cartId');
  storage: any = [];
  addToCart = [];
  parents: any = [];
  total = 0;
  number: any = 0;
  handler: any;
  amount: 500;
  addScript: boolean = false;
  finalAmount: number = this.total;
  
  paypalConfig = {
    env: 'sandbox',
    client: {
      sandbox: 'my-key',
      production: 'my-key'
    },
    commit: true,
    payment : (data, actions) =&gt; {
      return actions.payment.create({
        payment: {
          transactions: [
            { amount: {total: this.finalAmount, currency: 'USD' } }
          ]
        }
      })
    },
    onAuthorize: (data, actions) =&gt; {
      return actions.payment.execute().then((payment)=&gt;{
        //do something when payment is successful
      })
    }
  };
  
  ngAfterViewChecked() : void {
    if(!this.addScript) {
      this.addPaypalScript().then(() =&gt; {
        paypal.Button.render(this.paypalConfig, '#paypal-checkout-button')
      })
    }
  }
  
  addPaypalScript() {
    this.addScript = true;
    return new Promise((resolve, reject) =&gt; {
      let scriptTagElement = document.createElement('script');
      scriptTagElement.src = "https://www.paypalobjects.com/api/checkout.js";
      scriptTagElement.onload = resolve;
      document.body.appendChild(scriptTagElement);
    })
  }
  </code></pre>
  
  <p>this is my error in the console:</p>
  
  <blockquote>
    <p>POST <a href="https://www.sandbox.paypal.com/v1/payments/payment" rel="nofollow noreferrer">https://www.sandbox.paypal.com/v1/payments/payment</a> 403
    (Forbidden)</p>
    
    <p>Uncaught Error: Error: Request to post
    <a href="https://www.sandbox.paypal.com/v1/payments/payment" rel="nofollow noreferrer">https://www.sandbox.paypal.com/v1/payments/payment</a> failed with 403
    error. Correlation id: 3ef24e19eb852, 3ef24e19eb852</p>
  </blockquote>
  
  <pre><code>{
       "name": "PERMISSION_DENIED",
       "message": "No permission for the requested operation",
       "information_link": https://developer.paypal.com/docs/api/payments/#errors",
       "debug_id": "3ef24e19eb852" 
  }
  </code></pre>
  
  <p>any help or useful posts/articles to read would be appreciated, Thanks </p>
  
  <p><strong>UPDATE 5/05/2018</strong>
  Paypal still hasn't fixed this issue. But if you want to check that you have everything set up correctly you can use paypal's sandbox credentials to test it. <a href="https://developer.paypal.com/demo/checkout/#/pattern/client" rel="nofollow noreferrer">https://developer.paypal.com/demo/checkout/#/pattern/client</a></p>