Requirements
More secure Basic WebApi Example
In this example, we'll ensure that calls to your API only come from users who are visiting your website. This is to protect agains CSRF attacks, where another website gets your users to interact with your API. That could be dangerous, because maybe your API has things only a logged in user should see - and without the CSRF protection, the other website could get access to that because the user is logged in.
Click to see the result of a WebApi call with the shared code:
Output
Source Code of this file
Below you'll see the source code of the file. Note that we're just showing the main part, and hiding some parts of the file which are not relevant for understanding the essentials. Click to expand the code
@inherits Custom.Hybrid.Razor14 <!-- unimportant stuff, hidden --> <div @Sys.PageParts.InfoWrapper()> @Html.Partial("../shared/DefaultInfoSection.cshtml") <div @Sys.PageParts.InfoIntro()> <h2>More secure Basic WebApi Example</h2> <p> In this example, we'll ensure that calls to your API only come from users who are visiting your website. This is to protect agains <a href="https://en.wikipedia.org/wiki/Cross-site_request_forgery" target="_blank">CSRF</a> attacks, where another website gets your users to interact with your API. That could be dangerous, because maybe your API has things only a logged in user should see - and without the CSRF protection, the other website could get access to that because the user is logged in. </p> <p> Click to see the result of a WebApi call with the shared code: </p> </div> </div> <button type="button" class="btn btn-primary" onclick="apiWithVerification(this)"> Call WebApi </button> @* 2sxclint:disable:no-inline-script *@ <script> function apiWithVerification(moduleContext) { $2sxc(moduleContext).webApi.fetchJson('verified/hello') .then(data => alert(data)); } </script> @* Footer *@ @Html.Partial("../Shared/Layout/FooterWithSource.cshtml", new { Sys = Sys })