title: 403 forbidden and 400 bad request errors while adding and deleting items to SharePoint list using REST
body: <p>I'm new to SharePoint development. I'm Trying to develop  simple SharePoint App using SharePoint online. I have a List named 'Products' in my site collection. In my app I wrote the following code to add and delete items to that list</p>
  
  <pre><code> function addProduct(product) {
   var executor;
   executor = new SP.RequestExecutor(appwebUrl);
   var url = appwebUrl +"/_api/SP.AppContextSite(@target)/web/lists/getbytitle('Products')/items/?@target='" + hostwebUrl+"'";
   executor.executeAsync({
      url: url,
      method: "POST",
      body: JSON.stringify({__metadata: { type: 'SP.Data.ProductsListItem' },
          Title: product.ProductName(),
          ProductId: product.ProductId(),
          ProductName: product.ProductName(),
          Price:product.Price()
      }),
      headers: {
          "Accept": "application/json; odata=verbose",
          "content-type": "application/json;odata=verbose",
          },
      success: successProductAddHandler,
      error: errorProductAddHandler
  });
  }
  
  
  function successProductAddHandler(data) {alert('added successfully') }
  function errorProductAddHandler(data, errorCode, errorMessage) { alert('cannot perform action') }
  
  
  function deleteProduct(product) {
  var executor;
  executor = new SP.RequestExecutor(appwebUrl);
  var url=appwebUrl+"/_api/SP.AppContextSite(@target)/web/lists/getbytitle('Products')/items('" + product.ID() + "')/?@target='" + hostwebUrl + "'";
  executor.executeAsync({
      url: url,
      method: "POST",
      headers: {
  
          "IF-MATCH": "*",
          "X-HTTP-Method": "DELETE"
      },
      success: successProductAddHandler,
      error: errorProductAddHandler
  });`
  </code></pre>
  
  <p>Im getting <code>403</code> error code when I call <code>addProduct</code>,
  and <code>400</code> error code when I call <code>deleteProduct</code>.
  I'm able to get the list items and display.</p>
  
  <p>I tried adding  <code>X-RequestDigest": $("#__REQUESTDIGEST").val()</code> but it did not work</p>
  
  <p>If I include <code>"Accept": "application/json; odata=verbose"</code> in a request header for <code>deleteProduct()</code>, and when I call <code>deleteProduct</code>, two requests are going to server</p>
  
  <ol>
  <li><code>/sites/productsdev/productsapp/_api/contextinfo</code> (getting digest value)</li>
  <li><code>/sites/ProductsDev/ProductsApp/_api/SP.AppContextSite(@target)/web/lists/getbytitle('Products')/items(itemid)/?@target='mysitecollectionurl'</code>  (using the digest value returned by the above call for <code>X-RequestDigest</code>) </li>
  </ol>