web推送serviceworker未定義的方法錯誤？

Question

每次我嘗試啓動我的服務器我得到這個錯誤...

undefined method `post' for main:Object (NoMethodError) 

application.rb中

post "/push" do 
    Webpush.payload_send(
     endpoint: "https://fcm.googleapis.com/gcm/send/eah7hak....", 
     message: "A message", 
     p256dh: "BO/aG9nYXNkZmFkc2ZmZHNmYWRzZmFl...", 
     auth: "aW1hcmthcmFpa3V6ZQ==", 
     vapid: { 
     subject: "mailto:sender@example.com", 
     public_key: ENV['VAPID_PUBLIC_KEY'], 
     private_key: ENV['VAPID_PRIVATE_KEY'] 
     } 
    ) 
end 

上午我把代碼塊中錯誤的地方？我認爲app.rb是一回事application.rb

截圖是從git的教程：https://github.com/zaru/webpush。

我試圖用VAPID和寶石實現瀏覽器通知webpush & serviceworker-rails。

的application.js

// Register the serviceWorker script at /serviceworker.js from our server if supported 
if (navigator.serviceWorker) { 
    navigator.serviceWorker.register('/serviceworker.js') 
    .then(function(reg) { 
    console.log('Service worker change, registered the service worker'); 
    }); 
} 
// Otherwise, no push notifications :(
else { 
    console.error('Service worker is not supported in this browser'); 
} 

// When serviceWorker is supported, installed, and activated, 
// subscribe the pushManager property with the vapidPublicKey 
navigator.serviceWorker.ready.then((serviceWorkerRegistration) => { 
    serviceWorkerRegistration.pushManager 
    .subscribe({ 
    userVisibleOnly: true, 
    applicationServerKey: window.vapidPublicKey 
    }); 
}); 

$('.webpush-button').on('click', (e) => { 
    navigator.serviceWorker.ready 
    .then((serviceWorkerRegistration) => { 
    serviceWorkerRegistration.pushManager.getSubscription() 
    .then((subscription) => { 
     $.post('/push', { 
     subscription: subscription.toJSON(), 
     message: 'You clicked a button!' 
     }); 
    }); 
    }); 
}); 

// Let's check if the browser supports notifications 
if (!("Notification" in window)) { 
    console.error("This browser does not support desktop notification"); 
} 

// Let's check whether notification permissions have already been granted 
else if (Notification.permission === "granted") { 
    console.log("Permission to receive notifications has been granted"); 
} 

// Otherwise, we need to ask the user for permission 
else if (Notification.permission !== 'denied') { 
    Notification.requestPermission(function (permission) { 
    // If the user accepts, let's create a notification 
    if (permission === "granted") { 
     console.log("Permission to receive notifications has been granted"); 
    } 
    }); 
} 

Answer 1

簡單的例子，將其添加在控制器。

首先，創建與動作的名稱控制器（我將使用push，按照你的例子）：

$ rails g controller Test push 

這將創建一個測試控制器，將更新您的路線：

# app/controllers/test_controller.rb 

class TestController < ApplicationController 
    def push 
    end 
end 

# config/routes.rb 

get 'test/push' 

與代碼下一步更新控制器要添加：

class TestController < ApplicationController 
    def push 
    Webpush.payload_send(
     message: params[:message], 
     endpoint: params[:subscription][:endpoint], 
     p256dh: params[:subscription][:keys][:p256dh], 
     auth: params[:subscription][:keys][:auth], 
     vapid: { 
     subject: "mailto:sender@example.com", 
     public_key: ENV['VAPID_PUBLIC_KEY'], 
     private_key: ENV['VAPID_PRIVATE_KEY'] 
     } 
    ) 
    end 
end 

和最多日期您的航線使用post而不是get：

post 'test/push' 

有了，你將有一個POST yoursite /測試/推可端點（就如同app.rb的例子）。