小编Ker*_*mit的帖子

Firebase Auth - createUserWithEmailAndPassword() - 在验证电子邮件之前阻止登录

我希望使用 createUserWithEmailAndPassword() 在 Firebase Auth 中创建一个用户帐户 - 无需登录用户。我希望用户首先验证电子邮件地址。直接登录用户会导致许多不需要的副作用。

/signup 页面有以下代码 - 我希望用户在注册后停留在 /signup 页面上,以便能够看到注册消息。

firebase.auth().createUserWithEmailAndPassword(data.email, data.password)
.then((user)=> {
  //Send email verification link
  user.sendEmailVerification()
  //Show message - "Your account was created - please verify using link in email"
  handleStatusMessage(AUTH_SUCCESS)
})
.catch((error)=>{...})
Run Code Online (Sandbox Code Playgroud)

app.js 具有以下登录和重定向处理程序

//handle login and redirect
firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    if(!user.emailVerified){
      //Exit if email is not verified
      console.log('auth.js exit')
      //Line 7
    }
    store.dispatch(setInitialStore()).then(() => {
      renderApp()
      //Brings user to start page
      if (history.location.pathname === '/login') { …
Run Code Online (Sandbox Code Playgroud)

javascript firebase firebase-authentication

20
推荐指数
2
解决办法
5563
查看次数

如何在 JavaScript 中将动态数据 (HTML) 插入 SendGrid 模板

我希望使用SendGrid模板发送电子邮件。我使用标准 v3 api 和简单的 axios 调用。

我希望使用模板发送电子邮件。邮件应包含许多行和列。我不知道创建模板时会有多少行/列。行/列数将取决于仅在撰写电子邮件时已知的数据。

在我的代码中我希望:

  1. 使用 HTML 或其他推荐的方法收集数据并组成任意数量的行/列。
  2. 使用模板撰写消息,并使用“个性化/动态_模板_数据”或任何其他推荐的方法将 (1) 中的 HTML 插入到模板中。
  3. 发送电子邮件。
  4. 我希望电子邮件将我的 HTML 行/列视为 HTML。

我的代码(不起作用 - HTML 被视为文本):

  //Coompose HTML
  let alertHtml = ''
  noteObjArray.forEach((nototObj)=>{
    ...
    alertHtml += (myDate !== '') ? `- ${someText} ${myDate } ` : ''
    ...
    alertHtml += '<br/>'
  })

  //Send mail using SendGrid  
  const mailSender = firebaseFunctionsConfig.sendgrid.sender
  const msg = {
    personalizations: [{
      to: [{email, name}],
      dynamic_template_data: {userName:name, amount, alertHtml}
    }],
    from: {email: mailSender.email, name: mailSender.name},
    reply_to: …
Run Code Online (Sandbox Code Playgroud)

javascript sendgrid-api-v3 sendgrid-templates

10
推荐指数
1
解决办法
1万
查看次数

Lighthouse 开发工具 - 带有身份验证的站点

我正在尝试使用 Lighthouse DevTools 执行审计。我的网站需要身份验证。当我运行测试时,灯塔将我注销,只分析 /login。

如何使用 Lighthouse DevTools 来分析我的站点?我可以提供登录凭据吗?

lighthouse google-chrome-devtools

9
推荐指数
2
解决办法
5166
查看次数

为什么 React 组件在 props 没有改变的情况下会重新渲染?

我在 ReactJS 16.8.5 和 React-Redux 3.7.2 上构建了一个应用程序。当应用程序加载应用程序安装时,将设置初始存储并针对 Firebase 实时数据库设置数据库订阅。该应用程序包含侧边栏、标题和内容部分。通过使用 React Developer Tools 分析应用程序,我可以看到该应用程序Sidebar被渲染了多次 - 触发了子组件的重新渲染。我已经实现了React.memo以避免 props 更改时重新渲染。据我所知,道具没有改变,但Sidebar仍然重新渲染,这让我感到困惑。

app.js

//Imports etc...
const jsx = (
  <React.StrictMode>
    <Provider store={store}>
      <AppRouter />
    </Provider>
  </React.StrictMode>
)

let hasRendered = false
const renderApp = () => {
  if (!hasRendered) { //make sure app only renders one time
    ReactDOM.render(jsx, document.getElementById('app'))
    hasRendered = true
  }
}

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // Set initial store and db subscriptions
    renderApp()
  } …
Run Code Online (Sandbox Code Playgroud)

rerender reactjs redux

8
推荐指数
1
解决办法
4402
查看次数

Express 4.17 获取一个端点的原始正文

我正在尝试在我的 Web API 中实现 Stripe,并且需要读取请求的原始正文。我的应用程序中已经有不需要原始主体的现有 API 路径。

\n

我实现的代码基于 Stripe 文档示例,请参见下文。

\n
const stripe = require('stripe')('apikey...');\nconst endpointSecret = 'whsec_...';\n\nconst express = require('express');\nconst app = express();\napp.post('/webhook', express.raw({type: 'application/json'}), (request, response) => {\n  let event = request.body;\n  console.log('body', event);\n  const headers = JSON.stringify(request.headers);\n  console.log('Headers', headers);\n  // Only verify the event if you have an endpoint secret defined.\n  // Otherwise use the basic event deserialized with JSON.parse\n  if (endpointSecret) {\n    // Get the signature sent by Stripe\n    const signature = request.headers['stripe-signature'];\n    try {\n …
Run Code Online (Sandbox Code Playgroud)

javascript parsing express stripe-payments

8
推荐指数
1
解决办法
4980
查看次数

ES6箭头函数和array.map

我试图了解编写ES6的一些简写方法.我在下面的例子中无法完全理解的是最后一个简写"({length})" - 我理解它确实有效,并且它获取了数组的长度属性,但不是为什么.如何在另一个场景中应用此语法,而不涉及数组?

//Declare array
var materials = [
  'Hydrogen',
  'Helium',
  'Lithium',
  'Beryllium'
];

//Long version - ok
materials.map(function(material) { 
  return material.length; 
});

//Arrow function - ok
materials.map((material) => {
  return material.length;
});

//Shorthand arrow function - ok
materials.map(str => str.length);

//What? :)
materials.map(({length}) => length));
Run Code Online (Sandbox Code Playgroud)

上面的例子来自箭头函数的mozilla文档. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

javascript arrays ecmascript-6 arrow-functions

7
推荐指数
1
解决办法
2万
查看次数

Workbox 在新版本上更新缓存

我已经实现了 Workbox 来使用 webpack 生成我的 Service Worker。这工作得很好 - 我可以确认revision运行时生成的服务工作线程中已更新yarn run generate-sw(package.json "generate-sw": "workbox inject:manifest":)。

问题是 - 我注意到我的客户在新版本发布后没有更新缓存。即使在更新服务工作线程数天后,我的客户端仍在缓存旧代码,而新代码仅在多次刷新和/或取消注册服务工作线程后才会缓存。对于每个版本const CACHE_DYNAMIC_NAME = 'dynamic-v1.1.0'都会更新。

如何确保客户端在新版本发布后立即更新缓存?

serviceWorker-base.js

importScripts('workbox-sw.prod.v2.1.3.js')

const CACHE_DYNAMIC_NAME = 'dynamic-v1.1.0'
const workboxSW = new self.WorkboxSW()

// Cache then network for fonts
workboxSW.router.registerRoute(
  /.*(?:googleapis)\.com.*$/, 
  workboxSW.strategies.staleWhileRevalidate({
    cacheName: 'google-font',
    cacheExpiration: {
      maxEntries: 1, 
      maxAgeSeconds: 60 * 60 * 24 * 28
    }
  })
)

// Cache then network for css
workboxSW.router.registerRoute(
  '/dist/main.css',
  workboxSW.strategies.staleWhileRevalidate({
    cacheName: 'css'
  })
)

// Cache …
Run Code Online (Sandbox Code Playgroud)

javascript caching service-worker workbox

5
推荐指数
1
解决办法
8852
查看次数

PWA 通知分组

我创建了一个 PWA 并实现了推送通知。据我了解,可以使用 替换通知tag并使用 控制行为renotify谷歌文档在这里。

这可能是减少显示通知数量的好方法,但是有没有办法在 PWA 中对通知进行分组?

在本机应用程序中,我注意到,如果通知数量超过一定数量,通知就会“分组”或“堆叠”到一个通知中。这可以在 PWA 中实现吗?

显示推送通知的代码:

self.addEventListener('push', function (event){
  console.log('Push Notification received', event)
  const defaultData = {title: 'New!', content: 'Something new happened!', openUrl: '/'}
  const data = (event.data) ? JSON.parse(event.data.text()) : defaultData

  var options = {
    body: data.content,
    icon: '/img/ico/manifest-512.png', 
    badge: '/img/ico/badge96.png', 
    // tag: 'myTag', 
    // renotify: true,
    data: {
      url: data.openUrl
    }
  }

  event.waitUntil(
    self.registration.showNotification(data.title, options)
  )
})
Run Code Online (Sandbox Code Playgroud)

亲切的问候/K

push-notification progressive-web-apps

5
推荐指数
0
解决办法
856
查看次数

Ansible 剧本 - 权限被拒绝

我正在尝试从 Ansible 2.3.1.0 运行一本剧本。我的远程计算机是 RHEL7,Python 安装在 /usr/bin/python 中。

我的剧本是这样的:

---
- hosts: my-test
  remote_user: myuser
  become: true
  become_method: sudo

  tasks:
#Extend /opt to 1GB
  - name: Extend /opt 2048m.
    lvol:
      vg: rootvg
      lv: rootvg-opt
      size: 1024m
Run Code Online (Sandbox Code Playgroud)

我收到的错误:

fatal: [my-test.host.nu]: FAILED! => {"changed": false, "failed": true, "module_stderr": "Shared connection to my-test.host.nu closed.\r\n", "module_stdout": "/usr/bin/python: can't open file '/home/myuser/.ansible/tmp/ansible-tmp-1523204435.39-113929450187838/setup.py': [Errno 13] Permission denied\r\n", "msg": "MODULE FAILURE", "rc": 1}
Run Code Online (Sandbox Code Playgroud)

由 Ansible 创建的文件“setup.py”具有权限“700 myuser myuser”,我猜这是一个问题?

如何让 Ansible 允许 root 运行脚本?我什至不确定这是否是问题所在?

file-permissions ansible

4
推荐指数
1
解决办法
3万
查看次数

Firebase Auth - 设置会话过期

如何设置 Firebase 身份验证会话的会话过期时间?默认情况下,会话永不过期。

我希望会话在 8 小时不活动后过期。

我已阅读文档,但不知道如何设置会话过期。

我用于登录用户并在登录和注销时执行任务的代码

firebase.auth().signInWithEmailAndPassword(data.email, data.password)

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    //Signed in
  }else{
    //Signed out
  }
}
Run Code Online (Sandbox Code Playgroud)

感谢所有回复!我已经尝试过,但似乎无法让 Firebase-admin 工作。

Firebase-db.js

const admin = require('firebase-admin')

const databaseConnection = {
  serviceAccountFile: './serviceAccount.json',
  databaseURL: 'https://myProject.firebaseio.com/'
}

const serviceAccount = require(databaseConnection.serviceAccountFile)

const app = admin.initializeApp({
  credential: admin.credential.cert(serviceAccount),
  databaseURL: databaseConnection.databaseURL
}, 'test')

const database = admin.database(app)

module.exports = database
Run Code Online (Sandbox Code Playgroud)

sessionSignout.js

const functions = require('firebase-functions')   
const database = require('../../firebase-db')
const admin = database.admin

exports.sessionSignout = functions
.region('europe-west1') …
Run Code Online (Sandbox Code Playgroud)

javascript firebase-authentication

4
推荐指数
1
解决办法
4039
查看次数

React Hook - 只监听窗口 *宽度* 大小的变化

我有一个监听事件的钩子window.resize。我希望只在变化时听取并更新window.innerWidth。我希望忽略更改,window.innerHeight因为打开软键盘时会触发此更改。问题是 mediaSize 存储在我的 Redux Store 中,导致应用程序在软键盘打开时重新渲染。

我的代码同时触发window.innerWidthwindow.innerHeight更改,我该如何改变这种行为?

我的钩子

import { useState, useEffect } from 'react';

// Hook
export const useWindowSize = () => {
  const isClient = typeof window === 'object'; //Object represents browser window
  function getSize() {
    return {
      width: isClient ? window.innerWidth : undefined
    }
  }

  const [windowSize, setWindowSize] = useState(getSize)

  useEffect(() => {
    if (!isClient) { return false } //Exit if not user/browser

    function handleResize() {
      setWindowSize(getSize()) …
Run Code Online (Sandbox Code Playgroud)

javascript dom-events reactjs react-hooks

2
推荐指数
1
解决办法
3543
查看次数