The Wiert Corner – irregular stream of stuff

Jeroen W. Pluimers on .NET, C#, Delphi, databases, and personal interests

  • My badges

  • Twitter Updates

  • My Flickr Stream

  • Pages

  • All categories

  • Enter your email address to subscribe to this blog and receive notifications of new posts by email.

    Join 1,860 other subscribers

Archive for the ‘Web Development’ Category

iOS/Android Privacy: InAppBrowser.com – see what JavaScript commands get injected through an in-app browser · Felix Krause

Posted by jpluimers on 2022/08/31

Especially on Archive, but also on Android and other mobile operating systems, mobile apps can have their in-app browsers to circumvent the OS provided wrapper around the system browser.

On iOS, the Safari is the only system browser engine whereas on Android you can have other engines too, so less Android applications have in-app browsers.

Most of those in-app browsers are in social media applications that go to great length to keep their users inside a walled garden.

The site [Wayback/Archive] inAppBrowser.com helps checking how severely information is leaked through the in-app browser as those potentially have a lot of control. TikTok is worst capturing all input including credentials like user names and passwords.

Read the rest of this entry »

Posted in Chrome, Conference Topics, Conferences, Development, Event, Firefox, iOS Development, JavaScript/ECMAScript, Mobile Development, Power User, Privacy, Safari, Scripting, Security, Software Development, Web Browsers, Web Development | Leave a Comment »

For my link archive: Facebook banned me for life because I created the tool Unfollow Everything.

Posted by jpluimers on 2022/08/23

For my link archive: [Wayback/Archive.is] Facebook banned me for life because I created the tool Unfollow Everything.

Via:

Related:

Read the rest of this entry »

Posted in Development, Facebook, Instagram, SocialMedia, Software Development, Web Development | Leave a Comment »

T-Shirt song: “🎶 Never gonna <div> you up … 🎶” / Twitter

Posted by jpluimers on 2022/08/10

I want this on a T-Shirt:

[Archive.is] Tatiana Mac on Twitter: “🎶 Never gonna <div> you, up Never gonna ‘let’ you down, Never gonna pun around and dessert you [sic], Never gonna make you DRY, Never gonna say goodbye, Never gonna tell a <li> and hurt you 🎶” / Twitter.

–jeroen

Read the rest of this entry »

Posted in Development, Fun, HTML, Quotes, Software Development, T-Shirt quotes, Web Development | Leave a Comment »

ropg/ipocalypse: FreeBSD jails with web servers on a single IPv4 address

Posted by jpluimers on 2022/08/04

Rob Gongrijp has this nice repository [Wayback/Archive.is] ropg/ipocalypse: FreeBSD jails with web servers on a single IPv4 address:

To deal with web servers (which all need to be reached at ports 80 (http) and 443 (https), I describe a convenient Apache reverse proxy setup in its own jail, and the management script I wrote to make things super-easy.

Via [Archive.is] ᖇ⦿ᖘ Gonggrijp on Twitter: “HOWTO for setting up a FreeBSD host with multiple jails running web servers on a single IPv4 address. (No rocket science: just a general HOWTO plus an easy certificate management / reverse proxy script which also works on other systems with adaptation.) … “

With an interesting response [Archive.is] corbosman on Twitter: “I use kubernetes/traefik pretty much like that, and before that docker/traefik. It’s getting more and more difficult to get IP space at all.… “

–jeroen

Posted in *nix, BSD, Development, Power User, Software Development, Web Development | Leave a Comment »

OWASP WebGoat repositories: Deliberately insecure JavaEE application to teach application security

Posted by jpluimers on 2022/08/02

Last year in OWASP top rated security “feature” A01:2021 – Broken Access Control, I promised to write more about how learn about OWASP documented and rated security vulnerabilities.

Today is the day you should start learning from [Wayback/Archive.is] Github: OWASP WebGoat:

Deliberately insecure JavaEE application to teach application security

It is a Java backend with a JavaScript/HTML frontend, but the vulnerabilities just as easily apply to other back-end stacks.

Repositories:

  1. [Wayback/Archive.is] WebGoat/WebGoat: WebGoat is a deliberately insecure application

    WebGoat is a deliberately insecure web application maintained by OWASP designed to teach web application security lessons.

    This program is a demonstration of common server-side application flaws. The exercises are intended to be used by people to learn about application security and penetration testing techniques.

    WARNING 1: While running this program your machine will be extremely vulnerable to attack. You should disconnect from the Internet while using this program. WebGoat’s default configuration binds to localhost to minimize the exposure.

    WARNING 2: This program is for educational purposes only. If you attempt these techniques without authorization, you are very likely to get caught. If you are caught engaging in unauthorized hacking, most companies will fire you. Claiming that you were doing security research will not work as that is the first thing that all hackers claim.

  2. [Wayback/Archive.is] WebGoat/WebGoat-Lessons: 7.x – The WebGoat STABLE lessons supplied by the WebGoat team.

    This repository contains all the lessons for the WebGoat container. Every lesson is packaged as a separate jar file which can be placed into a running WebGoat server.

  3. [Wayback/Archive.is] WebGoat/WebWolf (Can’t have a goat without a wolf, but I wonder where the cabbage is)
  4. [Wayback/Archive.is] WebGoat/WebGoat-Legacy: Legacy WebGoat 6.0 – Deliberately insecure JavaEE application
    This is the WebGoat Legacy version which is essentially the WebGoat 5 with a new UI.
    This program is a demonstration of common server-side application flaws. The exercises are intended to be used by people to learn about application penetration testing techniques.
  5. [Wayback/Archive.is] WebGoat/WebGoat-Archived-Releases: WebGoat 5.4 releases and older

    WebGoat 5.4 releases and older

  6. [Wayback/Archive.is] WebGoat/groovygoat: POC for dynamic groovy/thymeleaf based lesson system

    POC to demonstrate dynamic lessons with groovy controller/thymeleaf templates

They are by OWASP:

The Open Web Application Security Project (OWASP) is an online community that produces freely-available articles, methodologies, documentation, tools, and technologies in the field of web application security.[4][5]The Open Web Application Security Project (OWASP) provides free and open resources. It is led by a non-profit called The OWASP Foundation. The OWASP Top 10 – 2021 is the published result of recent research based on comprehensive data compiled from over 40 partner organizations.

Very important is the [Wayback/Archive.is] OWASP Top Ten Web Application Security Risks | OWASP:

The OWASP Top 10 is a standard awareness document for developers and web application security. It represents a broad consensus about the most critical security risks to web applications.

Globally recognized by developers as the first step towards more secure coding.

Companies should adopt this document and start the process of ensuring that their web applications minimize these risks. Using the OWASP Top 10 is perhaps the most effective first step towards changing the software development culture within your organization into one that produces more secure code.
Changes in the OWASP Top 10 between 2017 and 2021:

More OWASP repositories (including the [Wayback/Archive.is] OWASP/Top10: Official OWASP Top 10 Document Repository and [Wayback/Archive.is] OWASP/www-project-top-ten: OWASP Foundation Web Respository which seem to be at a 4-year update interval got updated in 2021) are at [Wayback/Archive.is] Github: OWASP.

Related: [Archive.is] Jeroen Wiert Pluimers on Twitter: “This so much sounds like German government IT-projects: …”

Via:

–jeroen

Posted in Authentication, CSS, Development, Encryption, HTML, Java Platform, JavaScript/ECMAScript, Pen Testing, Scripting, Security, Software Development, Web Development | Leave a Comment »

eidam/cf-workers-status-page: Monitor your websites, showcase status including daily history, and get Slack/Telegram/Discord notification whenever your website status changes. Using Cloudflare Workers, CRON Triggers, and KV storage.

Posted by jpluimers on 2022/07/26

Cool: [Wayback/Archive.is] eidam/cf-workers-status-page:

Monitor your websites, showcase status including daily history, and get Slack/Telegram/Discord notification whenever your website status changes. Using Cloudflare Workers, CRON Triggers, and KV storage

Will try this out in a while, hopefully before this actually reaches the front of the blog article queue (:

Via: [Wayback/Archive.is] Status Page – Scott Helme (via [Archive.is] Scott Helme on Twitter: “And yes, I’m also nervously watching my own status page 😅 …”).

Related blog post: One of the Let’s Encrypt’s Root Certificates expired today (and their corresponding intermediate yesterday); how is your infrastructure doing?

–jeroen

Posted in CSS, Development, JavaScript/ECMAScript, Scripting, Software Development, Web Development | Leave a Comment »

Converting inline svg xml to png

Posted by jpluimers on 2022/07/19

A while ago, I had a web page showing the logo as inline svg xml code.

Edit 20231209: [Wayback/Archive] Render SVG to PNG: Edit fiddle – JSFiddle – Code Playground (explained in [Wayback/Archive] html – Convert embedded SVG to PNG in-place – Stack Overflow by [Wayback/Archive] User anatoly techtonik – Stack Overflow) works way better than the InfoHeap link:

  1. Replace the svg element in it (but keep the id="inputSvg" attribute!),
  2. Run the fiddle,
  3. Save the rendered PNG file by right-clicking the “PNG (Save link as..)” link then saving the file.

Original content

It took a while to find a place to convert that on-line: [Wayback/Archive.is] inline svg xml to png – online html sandbox – InfoHeap (via [Wayback/Archive.is] Convert svg xml text to png image using canvas – InfoHeap):

The solution is a bit of JavaScript (quoted below) that you can run-online: modify the svg bit in it, then run it, scroll down in the result and verify if the canvas fits (when not: adapt the canvas side, then re-run).

The svg xml code needs to be all on one line, so remove any line breaks in it before running.

I have tested it in Chrome, but it should work in non-Chromium browsers like Firefox as well.

The inner workings of the JavaScript conversion code is explained in [Wayback/Archive.is] html – Convert embedded SVG to PNG in-place – Stack Overflow with more demo code at [Archive.is] Rasterizing In-Document SVG (thanks [Wayback] Phrogz!).

Related: [Archive.is] Jeroen Wiert Pluimers on Twitter: “Nieuwe logo, oude logo. Vrijwel alle werknemers werden een halve dag naar huis gestuurd om ruimte te maken voor de genodigden voor de zodat die de introductie van naam en logo konden bijwonen. Heel goed om verbinding te verliezen met je echte doelgroep. … “

Provalu logo

MareGroep logo

--jeroen



<div id="diagram_image">
<svg id="inputSvg" xmlns="http://www.w3.org/2000/svg&quot; xmlns:inkspace="http://www.inkscape.org/namespaces/inkscape&quot; xmlns:xlink="http://www.w3.org/1999/xlink&quot; viewBox="0 0 640 120">
<defs id="defs_block">
<filter height="1.504" id="filter_blur" inkspace:collect="always" width="1.1575" x="-0.07875" y="-0.252">
<feGaussianBlur id="feGaussianBlur3780" inkspace:collect="always" stdDeviation="4.2" />
</filter>
</defs>
<title>blockdiag</title>
<desc/>
<rect fill="rgb(0,0,0)" height="40" stroke="rgb(0,0,0)" style="filter:url(#filter_blur);opacity:0.7;fill-opacity:1" width="128" x="67" y="46" />
<rect fill="rgb(0,0,0)" height="40" stroke="rgb(0,0,0)" style="filter:url(#filter_blur);opacity:0.7;fill-opacity:1" width="128" x="259" y="46" />
<rect fill="rgb(0,0,0)" height="40" stroke="rgb(0,0,0)" style="filter:url(#filter_blur);opacity:0.7;fill-opacity:1" width="128" x="451" y="46" />
<rect fill="rgb(255,255,255)" height="40" stroke="rgb(0,0,0)" width="128" x="64" y="40" />
<text fill="rgb(0,0,0)" font-family="sans-serif" font-size="11" font-style="normal" font-weight="normal" text-anchor="middle" textLength="55" x="128" y="66">discovery</text>
<rect fill="rgb(255,255,255)" height="40" stroke="rgb(0,0,0)" width="128" x="256" y="40" />
<text fill="rgb(0,0,0)" font-family="sans-serif" font-size="11" font-style="normal" font-weight="normal" text-anchor="middle" textLength="55" x="320" y="66">execution</text>
<rect fill="rgb(255,255,255)" height="40" stroke="rgb(0,0,0)" width="128" x="448" y="40" />
<text fill="rgb(0,0,0)" font-family="sans-serif" font-size="11" font-style="normal" font-weight="normal" text-anchor="middle" textLength="55" x="512" y="66">reporting</text>
<path d="M 192 60 L 248 60" fill="none" stroke="rgb(0,0,0)" />
<polygon fill="rgb(0,0,0)" points="255,60 248,56 248,64 255,60" stroke="rgb(0,0,0)" />
<path d="M 384 60 L 440 60" fill="none" stroke="rgb(0,0,0)" />
<polygon fill="rgb(0,0,0)" points="447,60 440,56 440,64 447,60" stroke="rgb(0,0,0)" />
</svg>
</div>
<img id="outputPngImage" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4
//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="/>
<span id="outputPngLinkSpan">
<a href="">PNG (Save link as..)</a>
</span>

view raw

page-body.html

hosted with ❤ by GitHub


class SVGtoPNGDataURL {
constructor() {
this.canvas = document.createElement('canvas'); // Not shown on page
this.canvas2DContext = this.canvas.getContext('2d');
this.loaderImage = new Image; // Not shown on page
}
// Generate PNG data URL from SVG and send it to callback function when ready
go(svgElement, dataUrlCallback) {
var svgAsXML = (new XMLSerializer).serializeToString( svgElement );
this.loaderImage.width = this.canvas.width = svgElement.clientWidth;
this.loaderImage.height = this.canvas.height = svgElement.clientHeight;
var self = this;
this.loaderImage.onload = function() {
self.canvas2DContext.drawImage( self.loaderImage, 0, 0, self.loaderImage.width, self.loaderImage.height );
dataUrlCallback(self.canvas.toDataURL());
};
this.loaderImage.src = 'data:image/svg+xml,' + encodeURIComponent( svgAsXML );
}
};
var converter = new SVGtoPNGDataURL();
var inputSvgElement = document.querySelector('#inputSvg'), // Inline SVG element
outputPngImage = document.querySelector('#outputPngImage'), // Where to draw the result
outputPngLink = document.querySelector('#outputPngLinkSpan a');
converter.go(inputSvgElement, dataUrlCallback=function(dataURL) {
outputPngImage.src = dataURL;
outputPngLink.href = dataURL;
});

Posted in Chrome, Development, Firefox, JavaScript/ECMAScript, Power User, Scripting, Software Development, Web Browsers, Web Development | Leave a Comment »

Automatically reload page in Chrome without plugin – Super User

Posted by jpluimers on 2022/07/14

Below is a cool solution to refresh a page using a bookmarklet is to embed it into an iframe, then automatically reload it every interval.

It for instance works for the [Wayback/Archive.is] Woonveilig and often in Fritz!Box environments.

[Wayback] Jon described the below method as a solution for his own question, 6 years after asking it in [Wayback/Archive.is] Automatically reload page in Chrome without plugin – Super User.

So I made this a bookmark:


javascript:document.getElementsByTagName("body")[0].innerHTML = "<iframe id=\"testFrame\" src=\""+window.location.toString()+"\" style=\"position: absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%;\"><\/iframe>";reloadTimer = setInterval(function(){ document.getElementById("testFrame").src=document.getElementById("testFrame").src },5*60*1000)

(it is in a gist as the WordPress editors keep killing the embedded html code, despite it being escaped within <code> tags.

–jeroen

Posted in Bookmarklet, Chrome, Chrome, Development, Firefox, Google, HTML, JavaScript/ECMAScript, Power User, Scripting, Software Development, Web Browsers, Web Development | Leave a Comment »

GitKon Sept 22 – 23, 2021 – Virtual Git Conference | Presented by GitKraken

Posted by jpluimers on 2022/07/12

GitKon was a cool virtual conference about git and the git ecosystem: [Wayback/Archive.is] GitKon Sept 22 – 23, 2021 – Virtual Git Conference | Presented by GitKraken

Navigation was a bit hard because of the visual overload on the site (look at the various Archive.is archivals), so here is the outlined list of sessions with the rough timestamps in the below live recordings:

Global sitemap:

Live recordings are below. Hopefully they will last and per session splits will have become available.

None of them are at listed at [Wayback/Archive.is] www.youtube.com/c/Gitkraken/videos.

Via: [Wayback/Archive.is] Attendee Registration Thank You – GitKon 2021

–jeroen


Day 1 live recordings

Day 2 live recordings

Posted in Development, DVCS - Distributed Version Control, git, Mobile Development, Software Development, Source Code Management, Web Development | Leave a Comment »

Getting meta data from an image URL – JSFiddle – Code Playground (not sure why it fails on the Chrome console)

Posted by jpluimers on 2022/06/28

It works as a [Wayback/Archive.is] Edit fiddle – JSFiddle – Code Playground.

And it fails on the Google Chrome console:

GET https://anniversary.archive.org/files/2021/07/October-2001-Google-Drive-7-19-2021-3-24-49-PM-768x276.png net::ERR_FAILED

The code is from [Wayback/Archive.is] javascript – Get width height of remote image from url – Stack Overflow (which has many more sync and async code examples that all fail in the same way, not sure why).

Glad the JSFiddle one works.

Via: [Wayback] get image dimensions from url – Google Search

–jeroen

Posted in Development, JavaScript/ECMAScript, JSFiddle, Scripting, Software Development, Web Development | Leave a Comment »