Leonard  Paucek

Leonard Paucek


MyOpenVDP: A Vue Application to Securely Disclose Vulnerabilities


A web application to securely disclose vulnerabilities.

Compatible with Quasar UI v2 and Vue 3.



  • /app - Ready-to-use MyOpenVDP application
  • /ui - standalone npm package
  • /app-extension - Quasar app extension

How it works

  • Someone finds a vulnerability or a security bug on your website or product
  • They go to your MyOpenVDP application
  • They describe the vulnerability
  • Their report is encrypted in their browser
  • You receive the report via e-mail
  • The Internet is safer!


Required: SMTP configuration

Nodemailer is used to send the encrypted vulnerability disclosures via e-mail.

You must provide the path to a JSON file that contains the Nodemailer configuration via the BACKEND_MAIL_CONFIG_FILE environment variable.

An example configuration file would be:

  "host": "smtp.example.com",
  "port": 587,
  "secure": false,
  "auth": {
    "user": "username",
    "pass": "password"

See Nodemail SMTP transport for more configuration options.

Required: PGP keys

In order to encrypt vulnerability reports, you must provide the path to a directory that contains at least one file containing a PGP public key via the FRONTEND_FORM_PGP_KEYS_PATH environment variable.

See this excellent example of how to generate a GPG key.

If there are multiple files in the directory, their full name, with extension, will be used to show in a drop-down list in the form. For example, for a directory with the following structure:

 |- Key1
 |- Key2

The drop-down list will display 2 items Key1 and Key2.

If there is only one file in the directory, the drop-down list will no be displayed.

All files in the directory must contain one PGP public key similar to:


[... more data ...]


Docker image


docker run \
    -v $(pwd)/config/backend/nodemailer.json:/config/nodemailer.json \
    -v $(pwd)/config/frontend/pgpkeys:/config/pgpkeys \
    -e BACKEND_MAIL_CONFIG_FILE=/config/nodemailer.json \
    -e FRONTEND_FORM_PGP_KEYS_PATH=/config/pgpkeys \
    -p3000:3000 yeswehack/my-open-vdp

Then go to http://localhost:3000.


docker build -t my-vdp -f docker/Dockerfile .

Customize mail and webpage

Advanced configuration can be achieved by setting the following environment variables:


  • PORT: HTTP port of the application (default: 3000)
  • BACKEND_MAIL_CONFIG_FILE: (required) path to the SMTP configuration file
  • BACKEND_HTTP_ACCESS_CONTROL_ALLOW_ORIGIN: value of the HTTP header Access-Control-Allow-Origin for all api response (default: *)
  • BACKEND_CAPTCHA_ENABLE: boolean (true/false) flag to enable the form captcha (default: true)
  • BACKEND_CAPTCHA_CRYPT_PASSWORD: password for captcha keys encryption (default: random UUID4, changes at every start)
  • BACKEND_CAPTCHA_EXPIRATION_MS: expiration delay of the captchas, in milliseconds (default: 3600000)
  • BACKEND_MAIL_REPORT_TEMPLATE_TEXT_FILE: path to the file containing the template for the HTML version of the e-mails sent when a vulnerability is disclosed (see default)
  • BACKEND_MAIL_REPORT_TEMPLATE_HTML_FILE: path to the file containing the template for the plain-text version of the e-mails sent when a vulnerability is disclosed (see default)
  • BACKEND_MAIL_REPORT_SUBJECT_TEMPLATE: subject of the e-mails sent when a vulnerability is disclosed (default: New Vulnerability Disclosure)
  • BACKEND_MAIL_REPORT_FROM: value of the "from" field of the e-mails sent when a vulnerability is disclosed (default: my-open-vdp@[hostname])
  • BACKEND_MAIL_REPORT_TO: recipient of the e-mails sent when a vulnerability is disclosed (default: security@[hostname])


  • FRONTEND_FORM_PGP_KEYS_PATH: (required) path to the directory containing the PGP public keys used for encrypting the vulnerability disclosures
  • FRONTEND_VUE_URL_JS: url of Vue.js global JavaScript build file (default: https://cdn.jsdelivr.net/npm/vue@3.2.39/dist/vue.global.prod.js)
  • FRONTEND_QUASAR_URL_JS: url of Quasar global JavaScript build file (default: https://cdn.jsdelivr.net/npm/quasar@2.8.4/dist/quasar.umd.prod.js)
  • FRONTEND_QUASAR_URL_CSS: url of Quasar global CSS build file (default: https://cdn.jsdelivr.net/npm/quasar@2.8.4/dist/quasar.prod.css)
  • FRONTEND_MAIN_TITLE: HTML title of the index/form page (default: VDP)
  • FRONTEND_FORM_ATTACHMENT_MAX_SIZE_BYTES: maximum size of individual uploadable attachments in the form, in bytes (default: 2097152)
  • FRONTEND_FORM_ATTACHMENT_ALLOWED_EXTENSIONS: allowed attachment files extensions list, separated by spaces (default: txt jpeg jpg png gif tiff bmp)
  • FRONTEND_FORM_LOGS_AUTO_SCROLL: boolean (true/false) flag to enable autoscrolling of the logs when submitting a vulnerability (default: true)
  • FRONTEND_FORM_TIMESTAMP_FORMAT: format of the timestamp of the submission logs, see dateformat (default: yyyy/mm/dd HH:MM:ss.l)
  • FRONTEND_FORM_NOTIFICATIONS_POSITION: default position of the notifications (default: top ; allowed values: top-left, top-right, bottom-left, bottom-right, top, bottom, left, right, center)
  • FRONTEND_FORM_SUCCESS_NOTIFICATION_POSITION: position of the notification shown when a report has been successfully submitted
  • FRONTEND_FORM_ERRORS_NOTIFICATION_POSITION: position of the notifications shown when an error occurs
  • FRONTEND_FORM_DISCLOSURE_POLICY_NOTIFICATION_POSITION: position of the notification shown when the user click on the "Disclosure policy" link
  • FRONTEND_PARTIAL_HEAD: path to an HTML file that will be rendered in the <head/> element of the form page
  • FRONTEND_PARTIAL_BODY_BEFORE_FORM: path to an HTML file that will be rendered in the <body/> element of the form page, just before the form
  • FRONTEND_PARTIAL_BODY_AFTER_FORM: path to an HTML file that will be rendered in the <body/> element of the form page, just after the form
  • FRONTEND_PARTIAL_BODY_AFTER_SCRIPT: path to an HTML file that will be rendered in the <body/> element of the form page, after the form initialization script

Download details:

Author: yeswehack
Source code: https://github.com/yeswehack/myopenvdp

License: MIT license


What is GEEK

Buddha Community

MyOpenVDP: A Vue Application to Securely Disclose Vulnerabilities
Wilford  Pagac

Wilford Pagac


Best Custom Web & Mobile App Development Company

Everything around us has become smart, like smart infrastructures, smart cities, autonomous vehicles, to name a few. The innovation of smart devices makes it possible to achieve these heights in science and technology. But, data is vulnerable, there is a risk of attack by cybercriminals. To get started, let’s know about IoT devices.

What are IoT devices?

The Internet Of Things(IoT) is a system that interrelates computer devices like sensors, software, and actuators, digital machines, etc. They are linked together with particular objects that work through the internet and transfer data over devices without humans interference.

Famous examples are Amazon Alexa, Apple SIRI, Interconnected baby monitors, video doorbells, and smart thermostats.

How could your IoT devices be vulnerable?

When technologies grow and evolve, risks are also on the high stakes. Ransomware attacks are on the continuous increase; securing data has become the top priority.

When you think your smart home won’t fudge a thing against cybercriminals, you should also know that they are vulnerable. When cybercriminals access our smart voice speakers like Amazon Alexa or Apple Siri, it becomes easy for them to steal your data.

Cybersecurity report 2020 says popular hacking forums expose 770 million email addresses and 21 million unique passwords, 620 million accounts have been compromised from 16 hacked websites.

The attacks are likely to increase every year. To help you secure your data of IoT devices, here are some best tips you can implement.

Tips to secure your IoT devices

1. Change Default Router Name

Your router has the default name of make and model. When we stick with the manufacturer name, attackers can quickly identify our make and model. So give the router name different from your addresses, without giving away personal information.

2. Know your connected network and connected devices

If your devices are connected to the internet, these connections are vulnerable to cyber attacks when your devices don’t have the proper security. Almost every web interface is equipped with multiple devices, so it’s hard to track the device. But, it’s crucial to stay aware of them.

3. Change default usernames and passwords

When we use the default usernames and passwords, it is attackable. Because the cybercriminals possibly know the default passwords come with IoT devices. So use strong passwords to access our IoT devices.

4. Manage strong, Unique passwords for your IoT devices and accounts

Use strong or unique passwords that are easily assumed, such as ‘123456’ or ‘password1234’ to protect your accounts. Give strong and complex passwords formed by combinations of alphabets, numeric, and not easily bypassed symbols.

Also, change passwords for multiple accounts and change them regularly to avoid attacks. We can also set several attempts to wrong passwords to set locking the account to safeguard from the hackers.

5. Do not use Public WI-FI Networks

Are you try to keep an eye on your IoT devices through your mobile devices in different locations. I recommend you not to use the public WI-FI network to access them. Because they are easily accessible through for everyone, you are still in a hurry to access, use VPN that gives them protection against cyber-attacks, giving them privacy and security features, for example, using Express VPN.

6. Establish firewalls to discover the vulnerabilities

There are software and firewalls like intrusion detection system/intrusion prevention system in the market. This will be useful to screen and analyze the wire traffic of a network. You can identify the security weakness by the firewall scanners within the network structure. Use these firewalls to get rid of unwanted security issues and vulnerabilities.

7. Reconfigure your device settings

Every smart device comes with the insecure default settings, and sometimes we are not able to change these default settings configurations. These conditions need to be assessed and need to reconfigure the default settings.

8. Authenticate the IoT applications

Nowadays, every smart app offers authentication to secure the accounts. There are many types of authentication methods like single-factor authentication, two-step authentication, and multi-factor authentication. Use any one of these to send a one time password (OTP) to verify the user who logs in the smart device to keep our accounts from falling into the wrong hands.

9. Update the device software up to date

Every smart device manufacturer releases updates to fix bugs in their software. These security patches help us to improve our protection of the device. Also, update the software on the smartphone, which we are used to monitoring the IoT devices to avoid vulnerabilities.

10. Track the smartphones and keep them safe

When we connect the smart home to the smartphone and control them via smartphone, you need to keep them safe. If you miss the phone almost, every personal information is at risk to the cybercriminals. But sometimes it happens by accident, makes sure that you can clear all the data remotely.

However, securing smart devices is essential in the world of data. There are still cybercriminals bypassing the securities. So make sure to do the safety measures to avoid our accounts falling out into the wrong hands. I hope these steps will help you all to secure your IoT devices.

If you have any, feel free to share them in the comments! I’d love to know them.

Are you looking for more? Subscribe to weekly newsletters that can help your stay updated IoT application developments.

#iot #enterprise iot security #how iot can be used to enhance security #how to improve iot security #how to protect iot devices from hackers #how to secure iot devices #iot security #iot security devices #iot security offerings #iot security technologies iot security plus #iot vulnerable devices #risk based iot security program

Luna  Mosciski

Luna Mosciski


8 Popular Websites That Use The Vue.JS Framework

In this article, we are going to list out the most popular websites using Vue JS as their frontend framework.

Vue JS is one of those elite progressive JavaScript frameworks that has huge demand in the web development industry. Many popular websites are developed using Vue in their frontend development because of its imperative features.

This framework was created by Evan You and still it is maintained by his private team members. Vue is of course an open-source framework which is based on MVVM concept (Model-view view-Model) and used extensively in building sublime user-interfaces and also considered a prime choice for developing single-page heavy applications.

Released in February 2014, Vue JS has gained 64,828 stars on Github, making it very popular in recent times.

Evan used Angular JS on many operations while working for Google and integrated many features in Vue to cover the flaws of Angular.

“I figured, what if I could just extract the part that I really liked about Angular and build something really lightweight." - Evan You

#vuejs #vue #vue-with-laravel #vue-top-story #vue-3 #build-vue-frontend #vue-in-laravel #vue.js

Houston  Sipes

Houston Sipes


Grindr's Bug Bounty Pledge Doesn't Translate to Security

SAS@Home 2020– After a Grindr security flaw was disclosed this week, the dating site promised it would launch a bug-bounty program in an effort to “[keep its] service secure.” But Katie Moussouris, CEO of Luta Security and a bug bounty program expert, warned at this week’s SAS@home virtual event that simply launching a bug-bounty program won’t result in better security.

The Grindr bug, which allowed attackers to launch password resets without accessing a user’s email inbox, made news headlines as it was extremely trivial to exploit. Speaking during a Tuesday virtual session, Moussouris said that if organizations have that level of “low-hanging fruit” when it comes to vulnerabilities, bug-bounty programs can sometimes pose more problems than they solve.

“We have a lot of hope for bug-bounty programs, but they’re not the ‘easy button’ we thought they were,” she said, speaking on Tuesday at SAS@Home, which is Kaspersky’s virtual Security Analyst Summit conference.

Grindr isn’t alone – many companies are looking to adopt, or have already adopted, bug-bounty programs or vulnerability-disclosure programs (VDPs). It’s important to distinguish the two: A bug-bounty program offers cash rewards for finding flaws (which in theory should then be fixed by the organization), while a VDP covers when a vulnerability is reported by a third party to an organization. Ideally, those involved would follow the ISO standards for vulnerability disclosure (ISO 29147) and vulnerability handling (ISO 30111) processes.

Katie Moussouris talks about the separate definitions of VDPs, bug-bounty programs and pentesting during SAS@Home.

But companies are rushing in to adopt bug-bounty programs and VDPs without first fleshing out important issues — whether that’s defining what’s in scope, looking at how an organization can handle an influx of vulnerabilities being reported, or properly training triage teams.

In December, for instance, a CISA directive was proposed that would require all U.S. agencies to develop and implement vulnerability disclosure processes for their internet-connected systems. While CISA recommended that agencies consider guidance around what’s in-scope and who to contact, Moussouris noted that holes remained in terms of setting up the back-end processes to receive reports, or gaining the resources that are necessary to fix the bugs reported.

#government #hacks #security analyst summit #vulnerabilities #web security #bounty hunter #bug bounty #bugcrowd #cisa #grindr #hackerone #katie moussouris #luta security #pentesting #security vulnerability #vdp #vulnerability disclosure program #zoom

Ron  Cartwright

Ron Cartwright


October Patch Tuesday: Microsoft Patches Critical, Wormable RCE Bug

Microsoft has pushed out fixes for 87 security vulnerabilities in October – 11 of them critical – and one of those is potentially wormable.

There are also six bugs that were previously unpatched but publicly disclosed, which could give cybercriminals a leg up — and in fact at least one public exploit is already circulating for this group.

This month’s Patch Tuesday overall includes fixes for bugs in Microsoft Windows, Office and Office Services and Web Apps, Azure Functions, Open Source Software, Exchange Server, Visual Studio, .NET Framework, Microsoft Dynamics, and the Windows Codecs Library.

A full 75 are listed as important, and just one is listed as moderate in severity. None are listed as being under active attack, but the group does include six issues that were known but unpatched before this month’s regularly scheduled updates.

“As usual, whenever possible, it’s better to prioritize updates against the Windows operating system,” Richard Tsang, senior software engineer at Rapid7, told Threatpost. “Coming in at 53 of the 87 vulnerabilities, patching the OS knocks out 60 percent of the vulnerabilities listed, along with over half of the critical RCE vulnerabilities resolved today.”

11 Critical Bugs

One of the most notable critical bugs, according to researchers, is a remote code-execution (RCE) problem in the TCP/IP stack. That issue (CVE-2020-16898) allows attackers to execute arbitrary code with elevated privileges using a specially crafted ICMPv6 router advertisement.

Microsoft gives this bug its highest exploitability rating, meaning attacks in the wild are extremely likely – and as such, it carries a severity rating of 9.8 out of 10 on the CvSS vulnerability scale. True to the season, it could be an administrator’s horror show.

“If you’re running an IPv6 network, you know that filtering router advertisements is not a practical workaround,” said Dustin Childs, researcher at Trend Micro’s Zero-Day Initiative (ZDI), in his Patch Tuesday analysis. “You should definitely test and deploy this patch as soon as possible.”

Bharat Jogi, senior manager of vulnerability and threat research at Qualys, said that an exploit for the bug could be self-propagating, worming through infrastructure without user interaction.

“An attacker can exploit this vulnerability without any authentication, and it is potentially wormable,” he said. “We expect a proof-of-concept (PoC) for this exploit would be dropped soon, and we highly encourage everyone to fix this vulnerability as soon as possible.”

Threatpost has reached out for more technical details on the wormable aspect of the bug.

#cloud security #vulnerabilities #web security #critical #cve-2020-16898 #microsoft #october 2020 #patch tuesday #patches #publicly disclosed #remote code execution #router advertisements #security bug #security vulnerabilities #tcp/ip #unpatched bugs #wormable

Teresa  Bosco

Teresa Bosco


Vue File Upload Using vue-dropzone Tutorial

In this tutorial, I will show you how to upload a file in Vue using vue-dropzone library. For this example, I am using Vue.js 3.0. First, we will install the Vue.js using Vue CLI, and then we install the vue-dropzone library. Then configure it, and we are ready to accept the file. DropzoneJS is an open source library that provides drag and drops file uploads with image previews. DropzoneJS is lightweight doesn’t depend on any other library (like jQuery) and is  highly customizable. The  vue-dropzone is a vue component implemented on top of Dropzone.js. Let us start Vue File Upload Using vue-dropzone Tutorial.

Dropzone.js is an open-source library providing drag-and-drop file uploads with image previews. DropzoneJS is lightweight, doesn’t depend on any other library (like jQuery), and is highly customizable.

The vue-dropzone is a vue component implemented on top of Dropzone.js.

First, install the Vue using Vue CLI.

Step 1: Install Vue.js using Vue CLI.

Go to your terminal and hit the following command.

npm install -g @vue/cli
yarn global add @vue/cli

If you face any error, try running the command as an administrator.

Now, we need to generate the necessary scaffold. So type the following command.

vue create vuedropzone

It will install the scaffold.

Open the project in your favorite editor. Mine is Visual Studio Code.

cd vuedropzone
code .

Step 2: Install vue-dropzone.

I am using the Yarn package manager. So let’s install using Yarn. You can use NPM, also. It does not matter.

yarn add vue2-dropzone


npm install vue2-dropzone

Okay, now we need to add one css file with the above package. Now, vue cli uses css loader, so we can directly import in the src >>  main.js entry file.

import Vue from 'vue'
import App from './App.vue'

Vue.config.productionTip = false

new Vue({
  render: h => h(App)

import 'vue2-dropzone/dist/vue2Dropzone.css'

If importing css is not working for you, then you need to install that CSS file manually.

Copy this vue2Dropzone.css file’s content.

Create one file inside the src  >>  assets folder, create one css file called vuedropzone.css and paste the content there.

Import this css file inside src  >>  App.vue file.

<style lang="css">
  @import './assets/vuedropzone.css';

Now, it should include in our application.

Step 3: Upload an Image.

Our primary boilerplate has one ready-made component called HelloWorld.vue inside src  >>  components folder. Now, create one more file called FileUpload.vue.

Add the following code to FileUpload.vue file.

// FileUpload.vue

  <div id="app">
    <vue-dropzone id="upload" :options="config"></vue-dropzone>

import vueDropzone from "vue2-dropzone";

export default {
  data: () => ({
    config: {
      url: "https://appdividend.com"
  components: {

Here, our API endpoint is https://appdividend.com. It is the point where we will hit the POST route and store our image, but it is my blog’s homepage, so it will not work anyway. But let me import this file into App.vue component and see what happens.

// App.vue

  <div id="app">
    <FileUpload />

import FileUpload from './components/FileUpload.vue'

export default {
  name: 'app',
  components: {

<style lang="css">
  @import './assets/vuedropzone.css';

Now, start the development server using the following command. It will open up URL: http://localhost:8080.

npm run serve

Now, after uploading the image, we can see that the image upload is failed due to the wrong POST request endpoint.

Step 4: Create Laravel API for the endpoint.

Install the Laravel.

After that, we configure the database in the .env file and use MySQL database.

We need to create one model and migration file to store the image. So let us install the following command inside the Laravel project.

php artisan make:model Image -m

It will create both the Image model and create_images_table.php migrations file.

Now, open the migrations file and add the schema to it.

// create_images_table.php

public function up()
        Schema::create('images', function (Blueprint $table) {

Now, migrate the database table using the following command.

php artisan migrate

It creates the table in the database.

Now, we need to add a laravel-cors package to prevent cross-site-allow-origin errors. Go to the Laravel root and enter the following command to install it.

composer require barryvdh/laravel-cors

Configure it in the config  >>  app.php file.


Add the middleware inside app >>  Http  >>  Kernel.php file.

// Kernel.php

protected $middleware = [

Step 5: Define the API route and method to store the image.

First, create an ImageController.php file using the following command.

php artisan make:controller ImageController

Define the store method. Also, create one images folder inside the public directory because we will store an image inside it.

Right now, I have written the store function that handles one image at a time. So do not upload multiple photos at a time; otherwise, it will break.

// ImageController.php


namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Image;

class ImageController extends Controller
    public function store(Request $request)
          $image = $request->file('file');
          $name = time().$image->getClientOriginalName();
          $image->move(public_path().'/images/', $name); 

       $image= new Image();
       $image->image_name = $name;

       return response()->json(['success' => 'You have successfully uploaded an image'], 200);

Go to the routes   >>  api.php file and add the following route.

// api.php

Route::post('image', 'ImageController@store');

Step 6: Edit FileUpload.vue component.

We need to add the correct Post request API endpoint in FileUpload.vue component.

// FileUpload.vue

  <div id="app">
    <vue-dropzone id="drop1" :options="config" @vdropzone-complete="afterComplete"></vue-dropzone>

import vueDropzone from "vue2-dropzone";

export default {
  data: () => ({
    config: {
      url: "http://localhost:8000/api/image",
  components: {
  methods: {
    afterComplete(file) {

Now, save the file and try to upload an image. If everything is okay, then you will be able to save the image on the Laravel web server as well as save the name in the database as well.

You can also verify on the server side by checking the database entry and the images folder in which we have saved the image.

Step 7: More vue-dropzone configuration.

The only required options are url, but there are many more you can use.

For example, let’s say you want:

  • A maximum of 4 files
  • 2 MB max file size
  • Sent in chunks of 500 bytes
  • Set a custom thumbnail size of 150px
  • Make the uploaded items cancelable and removable (by default, they’re not)
export default {
  data: () => ({
    dropOptions: {
      url: "https://httpbin.org/post",
      maxFilesize: 5, // MB
      maxFiles: 5,
      chunking: true,
      chunkSize: 400, // Bytes
      thumbnailWidth: 100, // px
      thumbnailHeight: 100,
      addRemoveLinks: true
  // ...

Happy Coding !!!

Originally published at https://appdividend.com 

#vue #vue-dropzone #vue.js #dropzone.js #dropzonejs #vue cli