CODEWITHSUNDEEP
angular
Dilip Solanki
Dilip Solanki

Reputation: 111

How to prevent from clickjacking attack in angular-4 application?

I want to stop my angular application to be open in an IFRAME. I read some article on google and came to know that in order to achieve this we have to set X-Frame-Options. But I did not find the way to give this header.

Can anyone help me that how can I achieve this in angular-4?

Upvotes: 1

Views: 15952

Answers (3)

Thaadikkaaran
Thaadikkaaran

Reputation: 5226

There is nothing to do with angular app. It is a setting in IIS. To set X-Frame-Options in IIS server, do the following,

  1. Open IIS.
  2. Select the site that you want to set the X-Frame-Options.
  3. Double-click the HTTP Response Headers icon in the right middle pane where options are displayed.
  4. Click Add link in the Action panel to add the header. Type X-Frame-Options in the Name field and type SAMEORIGIN in the Value field.
  5. Click OK to save your changes.
  6. After saving your web.config will be updated with
            <customHeaders>
                <add name="X-Frame-Options" value="SAMEORIGIN" />
            </customHeaders>
        </httpProtocol>

More detail about clickjacking attack is here

Hope this solves your problem.

Upvotes: 5

Abhishek Saxena
Abhishek Saxena

Reputation: 81

The correct way of doing this is by using the X-Frame-Options with the same origin. But for the workaround, you can use this document https://cheatsheetseries.owasp.org/cheatsheets/Clickjacking_Defense_Cheat_Sheet.html this tells how you can add the script to your application For using this in angular you can call a function from the constructor of the app.component.ts file

checkAntiClickJacking() {
     if (self !== top) {
       // Redirect to your url
     }
}

Upvotes: 0

Dnyaneshwar Pawar
Dnyaneshwar Pawar

Reputation: 41

Here is the solution for Angular:-

http://taimooradilbadshah.blogspot.com/2014/06/the-clickjacking-attack-and-x-frame.html

I made a web.config file on server(IIS) where I put my build(dist) code.

It also works for Angular routing (ignore using hash tag(#)).

web.config

<?xml version="1.0"?>
<configuration>
    <system.webServer>

        <httpProtocol>
            <customHeaders>
              <add name="X-Frame-Options" value="SAMEORIGIN" />
            </customHeaders>
         </httpProtocol>

        <rewrite>
          <rules>
            <rule name="AngularJS Routes" stopProcessing="true">
              <match url=".*" />
              <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
              </conditions>
              <action type="Rewrite" url="/angularProject/index.html" />
            </rule>
          </rules>
        </rewrite>
     </system.webServer>
 </configuration>

You can check it here your website after putting above code :-

https://www.lookout.net/test/clickjack.html

Thanks

Upvotes: 2

Related Questions