Subscription error - "Invalid raw ECDSA P-256 public key."

MkLHX commented 3 years ago

Hello! I'm facing issue about subscription step. On Firefox

Subscription error. 
Arguments

0: DOMException: Invalid raw ECDSA P-256 public key.

On chrome

Subscription error. Arguments [DOMException: Failed to execute 'subscribe' on 'PushManager': The provided applicationServerKey is …, callee: ƒ, Symbol(Symbol.iterator): ƒ]

I generate vapid keys by using python package py-vapid==1.7.1

by using command vapid --gen for public and private keys my settings.py contains:

INSTALLED_APPS = [
 # /../
     'webpush',
 # /../
]
privk = (
    open(os.path.join(BASE_DIR, "private_key.pem"), "r+")
    .read()
    .strip()
    .split("\n")[1:][:-1]
)
WEBPUSH_VAPID_PRIVATE_KEY = "".join(privk)
pubk = (
    open(os.path.join(BASE_DIR, "public_key.pem"), "r+")
    .read()
    .strip()
    .split("\n")[1:][:-1]
)
WEBPUSH_VAPID_PUBLIC_KEY = "".join(pubk)
WEBPUSH_SETTINGS = {
    "VAPID_PUBLIC_KEY": WEBPUSH_VAPID_PUBLIC_KEY,
    "VAPID_PRIVATE_KEY": WEBPUSH_VAPID_PRIVATE_KEY,
    "VAPID_ADMIN_EMAIL": "test@gmail.com",
}

I wrote a view to render django template tags:

from django.views.decorators.http import require_http_methods
from django.shortcuts import render, redirect

@require_http_methods(["GET"])
def index(request):
    webpush = {
        "group": "my_group"
    }  # The group_name should be the name you would define.

    return render(request, "push_notification/index.html", {"webpush": webpush})

my template:

{% extends "gui/base.html" %}

{% load webpush_notifications %}

{% block head %}
    <!-- # For django templating engine -->
    {% webpush_header %}
{% endblock %}

{% block body %}
<p> Hello World! </p>
<!-- # For django templating engine -->
{% webpush_button %}
{% endblock %}

in browser: firefox

chrome

My public key is:

-----BEGIN PUBLIC KEY-----
MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEONKLXu1hkjwHIYxgERnucAfOjunh
h7ZGtgxNi7kXUU/+jyhHeC6YkTSzpwIkn2q6ibguVmJL5j9BriKgaqst1Q==
-----END PUBLIC KEY-----

My private key is:

in the template:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
    <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible" />
    <meta content="width=device-width, initial-scale=1, minimum-scale=1.0, shrink-to-fit=no" name="viewport" />

    <!-- # For django templating engine -->
   <script id="webpush-js" type="text/javascript" src="/static/webpush/webpush.js"></script>

  <meta name="service-worker-js" content="/webpush/service-worker.js">
  <meta name="django-webpush-vapid-key" content="MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEONKLXu1hkjwHIYxgERnucAfOjunhh7ZGtgxNi7kXUU/+jyhHeC6YkTSzpwIkn2q6ibguVmJL5j9BriKgaqst1Q==">
 </head>
 <body>
<p> Hello World! </p>
<!-- # For django templating engine -->

  <button id="webpush-subscribe-button"  data-group="my_group" data-url="/webpush/save_information">
    Subscribe to Push Messaging
  </button>
  <div id="webpush-message" hidden></div>
</body>
 </html>

i don't now how to better investigage on this issue.

MkLHX commented 3 years ago

Ok i find the good way.

In the documentation we have to put public vapid key in settings.

But when i do this i'm facing issue, when i use vapid --applicationServerKey instead that works!

So i think there is a misunderstand in the doc about private key, public key and server key....

safwanrahman commented 3 years ago

@MkLHX Thanks. It would be nice if you can update the documentation

MkLHX commented 3 years ago

@safwanrahman yeah why not, but the true question is this is normal you wrote the code with public key use and today i can use it only with the server key?

Maybe i doing mistake.

I'm ok to PR but if do it, for me we have to change every variable name about vapid_public_key to vapid_public_server_key.

safwanrahman / django-webpush

Subscription error - "Invalid raw ECDSA P-256 public key." #95