0

I am trying to achieve the following using Polymer Custom Element.

  • Detect the domain name from where the request is coming for rendering custom element
  • If domain name matches [ basically - if authorized ] then render the custom element template
  • If domain name not matches / not authorized redirect to error page polymer template

I have created a custom HTML element - which i am providing to other sites; if the other site/domain authorize with my site - then only i should display the custom polymer element / otherwise i should display error template.

Is this possible to do ?

or the moment someone adds my-custom-element to their site they can use it without restriction i put in place ? Please let me know if I am missing something obvious here.

The following polymer elements also do not provide me any capabilities to achieve the desired results as well.

<app-route>
<app-route-converter>

For example :

Let's say someone is using my-custom-element.html in their site / HTML pages.

If my-custom-element.html is being used in valid/authorized domain ; then it should serve the custom Polymer element; if my-custom-element.html is being used in invalid / not authorized domain - in that case it should display the error portion of the element template.

Valid uses-cases:

  • xyz.com/
  • subdomain.xyz.com/
  • xyz.com/*

Invalid use-cases :

  • anyotherdomain.com

Please note : I am currently authenticating the domain owners using Oauth providers. But those Oauth tokens would not be passed along with all the requests originating from their respective sites. The way I am authorizing the validity is using the "domain" [If it's registered with my site or not]

Community
  • 1
  • 1
Pranav
  • 167
  • 1
  • 3
  • 16
  • hmm read through your question again... what do you mean by maybe "requester's domain details". Maybe give an example of when it would be valid and when not? – daKmoR Aug 20 '17 at 21:10

1 Answers1

0

So you want to restrict where the custom elements you create are used?

I mean you can do a simple 

constructor() {
  if (!this.location.href.match('https://stackoverflow.com') { 
    return false; 
  }
  super();
}

in of your elements.

But yeah that is as save as preventing right click is going to prevent your pictures from being copied. (e.g. not at all). Still if you goal is to just prevent non techs it might do the trick.

daKmoR
  • 1,774
  • 12
  • 24