Cross-Origin Resource Sharing (CORS) DELETE request encounters a 403 status code

After setting up a CORS REST server and modifying some code in my JavaScript pages that connect to its URLs, I ran into an issue with the DELETE ajax request no longer working. The changes included updating the URL from http://localhost/dev to http://dev.local. Although I updated the allowed origin for requests and confirmed that my GET routes are functioning correctly, the DELETE method is now being blocked (403 on the preflight), and I'm struggling to identify my mistake.

Below, you can find the details of the OPTIONS and DELETE interactions:

Request URL:http://localhost:9292/users/101
Request Method:OPTIONS
Status Code:200 OK
...

The response returned as "Forbidden." Here is the DELETE request:

Request URL:http://localhost:9292/users/101
Request Method:DELETE
Status Code:403 Forbidden
...

If anyone has any insights or suggestions on how to troubleshoot this issue, I would greatly appreciate it.

Thank you, Dario.

Answer №1

Following a thorough search and the advice of monsur (who helped me realize that everything was correct on the client side), I decided to increase the log level of the rack to debug mode. To my surprise, I discovered an error message stating that there was an "attack prevented by Rack::Protection::RemoteToken", indicating a misconfiguration issue with rack-protection being used in conjunction with Sinatra.

By default, due to differences in referrer, my application was encountering CSRF protection errors. The solution was to disable it by adding the following line of code:

set :protection, :except => [:remote_token, :frame_options]

After making this change, everything started working smoothly again.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Achieving JSON element sorting in the most effective way

https://i.stack.imgur.com/NQbdN.png Each array contains the following information: {{ id: 39, treaty_number: "qwe", insurant_name: "222", belonging_to_the_holding_company: "test", date_start: "2016-04-15", etc }} Is there a way to sort each array in asc ...

What is the best way to extract a number from a string in JavaScript?

There are instances in HTML files where a <p> tag displays the price of a product, such as ""1,200,000 Dollar"". When a user adds this product to their cart, I want the webpage to show the total price in the cart. In JavaScript, I aim to e ...

Animate in Css3 before the object enters the user's view

Currently, I am utilizing CSS3 animate it from Despite following their instructions, the children within the animation activate prior to entering the viewport. Is this a common issue or is there a specific meta tag required? Your assistance is greatly ap ...

What is the best way to arrange four divs in a row on a mobile device that is responsive?

I am facing an issue with displaying 4 divs of equal size on my website. In desktop view, they appear side by side but in mobile view, they stack on top of each other. I have tried using display: flex; and bootstrap classes like col-3, col-sm-3, col-md-3, ...

Using JSON with PHP to send data and receiving the response back with JavaScript

Despite exploring numerous questions and attempting various methods, I have been unable to find a solution that works. Here is my JavaScript file: function sendData() { var jsondata; var j = {"pub_id":"'+pid+'","a_type":"'+a_t&ap ...

Guide on inserting values into multiple rows with a single user submission using PHP, Angular.js, and MySQL数据库

I am looking to streamline the process of inserting multiple rows with a single user click using Angular.js and PHP. Below is a breakdown of my code. time.html <table class="table table-bordered table-striped table-hover" id="dataTable"> <tr&g ...

I am encountering an error with an Unhandled Promise Rejection, but I am unable to determine the reason behind it

const express = require('express'); const cors = require('cors'); const massive = require('massive'); const bodyParser = require('body-parser'); const config = require('../config'); const app = express(); ...

Ways to send user input to a function within a React component

I am currently working on implementing a simple feature where users can search posts by their tags. To achieve this, I have created the Feed.jsx component with the following code: "use client"; import { useState, useEffect } from "react&quo ...

Utilize node.js to run a local .php file within a polling loop

Here is the purpose of my application in brief. I am using a PHP file to read data via an ODBC connection and then write that data to a local database. This PHP file needs to be executed LOCALLY ON THE SERVER every time a loop is processed in my node.js, ...

An error occurred during the execution of a test case in React JS: Unexpected token

While running my test case in React JS using Jest, I encountered an error. The code in my App.test.js file is as follows: const { React } = require('react'); const { shallow } = require('enzyme'); const { Iconshow } = require('../ ...

Implementing dynamic authorization headers in axios with vue.js

I am currently working on a Vue.js application that heavily relies on API calls, utilizing axios to make these requests. I have implemented a similar pattern found at this link. Essentially, I have created a service that will be shared across all componen ...

Navigating post upload using Laravel 5.1 and ajax

I've been experimenting with Laravel for a few days and I'm attempting to create an upload form that doesn't redirect the user to a different page upon file submission. Instead, I want a message like "Success" to be displayed on the same pag ...

When utilizing Axios to send a POST request with CORS, the $_POST variable appears to

Whenever I try to send a POST request with JSON data from my React app to the PHP server, I keep encountering an issue where $_POST remains empty and even using php://input doesn't seem to solve the problem. In my attempts to resolve this issue, I ex ...

Transferring values from jQuery AJAX to Node.js

Is there a way to successfully pass a variable from jQuery to nodejs without getting the [object Object] response? I want to ensure that nodejs can return a string variable instead. $('.test').click(function(){ var tsId = "Hello World"; ...

Listening for changes in a variable using a YUI event listener

/* Creating an event listener for the submit button */ YAHOO.util.Event.addListener(webserver.result_form, 'submit', webserver.result_submit); In my main.js, I currently have this event listener set up. I was curious to know if in YUI there is ...

Is there a way for me to come back after all child http requests have finished within a parent http request?

I am currently utilizing an API that provides detailed information on kills in a game. The initial endpoint returns an ID for the kill event, followed by a second endpoint to retrieve the names of both the killer and the killed player. Due to the structur ...

Reacting to errors with slice in React JS

Hello, I am facing an issue with the .slice method. The error message reads: ".slice is not a function." I am attempting to display customer commands in a table, but encountering an error. I am fetching commands from my custom API which returns them in ...

I'm having trouble locating my JavaScript files while trying to render a dynamic webpage

My navbar is set up to link to a dynamic web page like this <li class="<%= title == 'Cryptofolio' ? 'navbar-item active' : 'navbar-item' %>"> <a class="nav-link" href="/cryptofolio/< ...

One jQuery plugin was functioning perfectly, while the other one was failing to work as expected

I am working on a simple HTML file that includes a heading and two empty div elements. <h1>Blablabla.</h1> <div id="div1"></div> <div id="div2"></div> These two divs need to be populated with SVG content generated usin ...

Having issues with the jQuery Ajax response not functioning correctly

When utilizing the function rk() to retrieve a random key from an Ajax call, where parameter l represents the length, how can the return value from the Ajax result be assigned to the variable "k"? var k; function getRandKey(l) { //l stands for length ...