Rails Kann nicht überprüfen, CSRF-Token Authentizität AJAX mit X-CSRF-TOKEN-Header

Question

Ich versuche, einen Service-Worker-Endpunkt in meiner Datenbank zu registrieren, aber wenn ich meine Post-Daten mit Fetch senden die App einen Fehler melden.

Ich möchte die csrf Verifikation behalten. Siehst du etwas falsch?

  var ready; 

      ready = function(){ 
       if ('serviceWorker' in navigator) { 
       console.log('Service Worker is supported'); 
       navigator.serviceWorker.register('/service-worker.js').then(function(reg) { 

       reg.pushManager.subscribe({ 
        userVisibleOnly: true 
       }).then(function(sub) { 
        console.log('endpoint:', sub.endpoint); 
        console.log(sub); 
        var token = $('meta[name=csrf-token]').attr('content') 
      console.log(token); 

        return fetch('/register_endpoint', { 
        method: 'post', 
        headers: { 
         'Content-type': 'application/json', 
         'X-CSRF-TOKEN': token 
        }, 
        body: JSON.stringify({ 
         endpoint: sub.endpoint, 
         authenticity_token: token 

        }) 
        }); 
       }); 


       }).catch(function(err) { 
       console.log('Erreur -> ', err); 
       }); 
       } 

      }; 



      $(document).ready(ready); 
      $(document).on('page:load',ready); 

dank

Answer 1

Statt fetch schlage ich vor, könnte es zu machen wie unten:

$.ajax({ url: '_URL_HERE', 
    type: 'POST', 
    beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))}, 
    data: 'someData=' + someData, 
    success: function(response) { 
    $('#someDiv').html(response); 
    } 
}); 

Answer 2

Dies ist auch nicht für mich arbeiten, so habe ich außer Kraft setzen diese verified_request? Methode CsrfToken

class ApplicationController < ActionController::Base 
    protect_from_forgery 
    skip_before_action :verify_authenticity_token, if: :verified_request? 

    protected 

    def verified_request? 
     return true if request.get? 
     if respond_to?(:valid_authenticity_token?, true) 
     super || valid_authenticity_token?(session, URI.unescape(request.headers['X-CSRF-TOKEN'] || "")) 
     else 
     super || form_authenticity_token == URI.unescape(request.headers['X-CSRF-TOKEN'] || "") 
     end 
    end 
end 

Answer 3

Das Problem ist, dass der Session-Cookie wird nicht gesendet werden, wenn credentials nicht als Option innerhalb fetch angegeben .

credentials hat 3 possible values:

• omit -> keine Cookies senden Hat
• same-origin -> Nur Cookies senden, wenn die URL auf dem gleichen Ursprung wie das aufrufende Skript ist
• include -> Immer sende cookies, auch für crossursprungsrufe

Das sollte also wohl funktionieren:

return fetch('/register_endpoint', { 
method: 'post', 
headers: { 
    'Content-type': 'application/json', 
    'X-CSRF-TOKEN': token 
    }, 
    body: JSON.stringify({endpoint: sub.endpoint}), 
    credentials: 'same-origin' 
}) 

Here weitere informationen über die native fetch api.