i create a little react application where i want to caught some date from the api.
Fetch Data:
try { const response = await fetch(uri, { method: 'POST', credentials: 'include', headers: {'Content-Type': 'application/json','X-WP-Nonce': window.studio_w_obj.nonce, }, body: JSON.stringify(formData), }) if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`) } onCreateEvent(await response.json())} catch (error) { setError(error.message)}
Route:
register_rest_route($this->namespace, '/schedules', ['methods' => \WP_REST_Server::READABLE,'callback' => [$this, 'get_schedules'],'permission_callback' => '__return_true',]);function get_schedules(\WP_REST_Request $request) { $nonce = $request->get_header('X-WP-Nonce'); if (!wp_verify_nonce($nonce, 'wp_rest')) { return new WP_Error('rest_cookie_invalid_nonce', __('Invalid Nonce'), array('status' => 403)); } $results = $this->wpdb->get_results("SELECT * FROM $this->table_name", OBJECT); return new \WP_REST_Response($results, 200);}
If I start the build and test the application directly in the WordPress backend, I receive all the data. However, if I try to retrieve the data via Thunder Client (or Postman), I always receive the following message:
{"code": "rest_cookie_invalid_nonce","message": "Cookie check failed","data": {"status": 403 }}
This are my settings in Thunderclient:
I noticed that if I want to output the header $nonce = $request->get_header('X-WP-Nonce'); it remains empty in Thunder Client. In WordPress I get my value.
Which setting do I have to pay attention to in Thunder Client?
What I have already added:
- .htaccess
<IfModule mod_headers.c> Header set Access-Control-Allow-Origin "*" Header set Access-Control-Allow-Methods "POST, GET, OPTIONS, PUT, DELETE" Header set Access-Control-Allow-Headers "X-WP-Nonce, Content-Type, Authorization"</IfModule>
- PHP
function add_cors_http_header() { header("Access-Control-Allow-Origin: http://localhost:3000"); header("Access-Control-Allow-Methods: GET, POST, OPTIONS, DELETE, PUT"); header("Access-Control-Allow-Headers: Content-Type, Authorization");}add_action('init', 'add_cors_http_header');
- WP_DEUP
define('WP_DEBUG', true);define('WP_DEBUG_LOG', true);define('WP_DEBUG_DISPLAY', false);
I don't get any error messages.
My application run on http://localhost:3000. Did anyone knows which setting is missing?