diff --git a/packages/compiler/src/schema/dom_security_schema.ts b/packages/compiler/src/schema/dom_security_schema.ts
index 1acc4ede7df7..72e0360a850a 100644
--- a/packages/compiler/src/schema/dom_security_schema.ts
+++ b/packages/compiler/src/schema/dom_security_schema.ts
@@ -59,8 +59,8 @@ export function SECURITY_SCHEMA(): {[k: string]: SecurityContext} {
     // NB: no SCRIPT contexts here, they are never allowed due to the parser stripping them.
     registerContext(SecurityContext.URL, /** Namespace */ undefined, [
       ['*', ['formAction']],
-      ['area', ['href']],
-      ['a', ['href', 'xlink:href']],
+      ['area', ['href', 'protocol']],
+      ['a', ['href', 'xlink:href', 'protocol']],
       ['form', ['action']],
 
       // The below two items are safe and should be removed but they require a G3 clean-up as a small number of tests fail.
diff --git a/packages/compiler/test/schema/dom_element_schema_registry_spec.ts b/packages/compiler/test/schema/dom_element_schema_registry_spec.ts
index 839a206c5082..cc02dc237c75 100644
--- a/packages/compiler/test/schema/dom_element_schema_registry_spec.ts
+++ b/packages/compiler/test/schema/dom_element_schema_registry_spec.ts
@@ -152,7 +152,10 @@ If 'onAnything' is a directive input, make sure the directive is imported by the
     expect(registry.securityContext('iframe', 'srcdoc', false)).toBe(SecurityContext.HTML);
     expect(registry.securityContext('p', 'innerHTML', false)).toBe(SecurityContext.HTML);
     expect(registry.securityContext('a', 'href', false)).toBe(SecurityContext.URL);
+    expect(registry.securityContext('a', 'protocol', false)).toBe(SecurityContext.URL);
     expect(registry.securityContext('a', 'style', false)).toBe(SecurityContext.STYLE);
+    expect(registry.securityContext('area', 'href', false)).toBe(SecurityContext.URL);
+    expect(registry.securityContext('area', 'protocol', false)).toBe(SecurityContext.URL);
     expect(registry.securityContext('base', 'href', false)).toBe(SecurityContext.RESOURCE_URL);
 
     // SVG animate and set attributes
diff --git a/packages/core/src/sanitization/dom_security_schema.ts b/packages/core/src/sanitization/dom_security_schema.ts
index 1acc4ede7df7..72e0360a850a 100644
--- a/packages/core/src/sanitization/dom_security_schema.ts
+++ b/packages/core/src/sanitization/dom_security_schema.ts
@@ -59,8 +59,8 @@ export function SECURITY_SCHEMA(): {[k: string]: SecurityContext} {
     // NB: no SCRIPT contexts here, they are never allowed due to the parser stripping them.
     registerContext(SecurityContext.URL, /** Namespace */ undefined, [
       ['*', ['formAction']],
-      ['area', ['href']],
-      ['a', ['href', 'xlink:href']],
+      ['area', ['href', 'protocol']],
+      ['a', ['href', 'xlink:href', 'protocol']],
       ['form', ['action']],
 
       // The below two items are safe and should be removed but they require a G3 clean-up as a small number of tests fail.
diff --git a/packages/core/test/acceptance/security_spec.ts b/packages/core/test/acceptance/security_spec.ts
index 5035c85f55cc..0483b0035bcc 100644
--- a/packages/core/test/acceptance/security_spec.ts
+++ b/packages/core/test/acceptance/security_spec.ts
@@ -933,6 +933,69 @@ describe('SVG <script> bindings', () => {
   });
 });
 
+describe('HTML URL component sanitization', () => {
+  function expectNonExecutableUrl(element: HTMLAnchorElement | HTMLAreaElement) {
+    expect(element.protocol).not.toBe('javascript:');
+    expect(element.href.startsWith('javascript:')).toBeFalse();
+  }
+
+  it('should sanitize protocol setters after sanitized href writes on <a>', async () => {
+    @Component({
+      template: '<a [href]="url" [protocol]="protocol">link</a>',
+    })
+    class TestCmp {
+      url = 'javascript://%0Aalert(1)';
+      protocol = 'javascript:';
+    }
+
+    const fixture = TestBed.createComponent(TestCmp);
+    await fixture.whenStable();
+
+    const link = fixture.nativeElement.querySelector('a');
+    expect(link.href).toContain('unsafe');
+    expectNonExecutableUrl(link);
+  });
+
+  it('should sanitize split URL protocol setters on <a>', async () => {
+    @Component({
+      template: '<a [href]="baseHref" [protocol]="protocol" [pathname]="pathname">link</a>',
+    })
+    class TestCmp {
+      baseHref = 'foo://example.test/';
+      protocol = 'javascript:';
+      pathname = '/%0Aalert(2)';
+    }
+
+    const fixture = TestBed.createComponent(TestCmp);
+    await fixture.whenStable();
+
+    const link = fixture.nativeElement.querySelector('a');
+    expect(link.href).toContain('example.test');
+    expectNonExecutableUrl(link);
+  });
+
+  it('should sanitize protocol setters after sanitized href writes on <area>', async () => {
+    @Component({
+      template: `
+        <map name="pov">
+          <area shape="rect" coords="0,0,320,80" [href]="href" [protocol]="protocol" />
+        </map>
+      `,
+    })
+    class TestCmp {
+      href = 'javascript://%0Aalert(3)';
+      protocol = 'javascript:';
+    }
+
+    const fixture = TestBed.createComponent(TestCmp);
+    await fixture.whenStable();
+
+    const area = fixture.nativeElement.querySelector('area');
+    expect(area.href).toContain('unsafe');
+    expectNonExecutableUrl(area);
+  });
+});
+
 describe('SVG <a> link sanitization', () => {
   it('should sanitize dynamic `href` bindings on <svg:a>', () => {
     @Component({