Securing an iFrame form - html

For our ASP.NET application we have an API which users can use to send data from their website forms (e.g. a sign-up form) directly to our application.
To use this, obviously some programming is required to connect their forms to our API. Some users (or their website developers) find this too difficult. So the idea is to provide a standard webform which can be included in their website using an iFrame. The webform should be unique per user, specified by using an ID or key in the URL or in a hidden field. For example, they can link their iFrame to an URL like https://myapplication.com/webform/CustomerID-1001
My question is how can we secure this webform? For the API we use an API-key, but that is used only serverside. Since the suggested webform is hosted in our application, the user cannot set anything serverside. So how can we prevent a malicious website visitor from copying the entire form (including the complete URL or hidden fields) from a valid user's website and using it in an iFrame on their own malicious website? (or at least stop the form from working in this case)
Do you have any suggestions about securing such a webform?

Related

Structure of a Node.js Application

My name is Alex.
Sorry for my rather bad Englisch because i come from Germany.
I just started programming with Node.js.
Previously i made some small static HTML and CSS websites.
I have some beginner questions (which might be dump).
I think these questions are very general for now and have therefore not included any code examples.
So far I have written a static HTML website which I host locally on my computer using Node.js and Express.
My Questions are:
Which actions within a web application should take place on the client side and which on the server side. For example, I have several buttons on the start page. With the help of which predefined users can log in. When clicking on a button, the user should be redirected to the login page. The user name of the respective user should be entered directly into the username field on the login page.
How do I implement such a transition?
The username would probably have to be passed to the server using a post call. How does the user get to the next page? Should this be a simple link or should I send the new HTML document to the user via app.sendFile()?
For example, how do I change tags in an HTML document using Node.js. The same example as before a user is logged in and redirected to the next page. Now he should be greeted with his name. The name can be read from a database using the UUID.
How do I get this name into a tag?
Do I need a template engine or are there other ways to change a static HTML page.
Thank you in advance for your help.
In my opinion, security-critical parts logic be placed on the server (logging in, checking balance, authorization, etc.).
Traditionally, no code on the client side is required. You click a link/submit a form, which sends a request to a server, the server responds, the client displays the new page.
Using client side code, however, can make your app smoother and reduce the load of the server. For example: the user clicks on the shopping cart button. Instead of reloading the whole page, the user sends an ajax request, and the server responds with the cart data. Then the client updates the document, displaying the formatted cart data.
You can't "change html tags" from nodejs. You can send a response. If you send a html response, you decide how to produce the response. You can just concatenate html strings, but using a template engine is a better solution.

Authenticating in Email HTML Form

I'm building a web service for internal use and one feature I would like to implement is having users be able to fill out HTML forms and submit from email so that they don't necessarily have to go to the web page to use its functionality. The problem is that the web page requires authentication via nginx so a simple redirect won't work. Accessing the email account requires authenticating into Okta which is also the same creds that will get you into nginx, so is it possible to somehow pass along that information to the form?
The web page is running on flask, just in case that's important.
In short the answer is no. In most modern day mailing services such as gmail the mail will be counted as spam because you are trying to gather "sensitive" information(even if its something as simple as a name)
Trying to gather information through email is a security risk and you should do so only through your secure server

Accessing form data inside iframe

Is it possible to access form data with javascript inside iframe from external source?
For example: I have a web store on example.com. If I use payment gateway stripe.com with iframe integration https://stripe.com/checkout is it possible to access input data user inserts in iframe popup on interval 1s?
I would like to be sure that i case one hacks into my website, one cannot access payment details of customers.
Is it possible to access form data with javascript inside iframe from external source?
No. This is prevented by the Same Origin Policy.
If I use payment gateway stripe.com with iframe integration https://stripe.com/checkout is it possible to access input data user inserts
Not in a straightforward JS way, but there have been a number of clickjacking attacks against content in iframes. See for example http://www.contextis.com/documents/5/Context-Clickjacking_white_paper.pdf
However in this case the point is moot, as:
I would like to be sure that i case one hacks into my website, one cannot access payment details of customers.
This is not achievable. If your site is compromised (either at the server or at the client via XSS), the attacker can change the parent page to make it pop up a fake checkout iframe instead of using the real Stripe script, one that leaks entered payment details.
This is a risk with all iframe-based checkouts: the user can't verify the origin and HTTPS details of an iframe, so they have to trust those of the parent page (merchant).

oauth for html5 enabled devices

I'm building a webapp specifically for iOS and Android devices which requires user to sign in with their Facebook or Twitter accounts. I have it setup so that initially they're redirected to the appropriate login page and upon successful completion my provided calllback url is triggered.
Because I want to implement a single sign on, I will be storing on the user's device the access token that I received so they can easily access the webapp without having to sign in again next time.
My question is this: is it better to store it as an html4 cookie from the server side? Or is it better to insert it as a hidden input in the home page and have javascript on the client grab it and store it with the new local/sessionStorage? And if the latter, which type of storage would be better for this type of data that I would like to save?

Add application to Fb Page from outside Fb, add tab for it and configure if with specific data?

I have a simple product catalogue for businesses. There is a catalogue's management interface for adding products. Each business has a unique domain name where all its products are listed.
I would like to extend catagloue's functionality and allow businesses to have their products listed on facebook.
Functionality of the facebook application:
- Each business can install application from catalogue's management interface (I would like to have a button that opens facebook in a new window and prompts user to authorize access to one of user's existing Facebook Pages)
- installing application adds a Tab on selected Facebook Page,
- by clicking on a Tab visitor of the Facebook Page is presented with a list of products specific for this business. Data for that page is dynamic and can be accessed with a REST call and presented as json or html.
We would like each business that have a product catalogue with us to install application and have it automatically configured to use specific domain name when requesting product data.
Is it all technically possible? Could you point me into the right direction on how to
- install application from external website
- configure that application with a parameter (perhaps passed in url when requesting application installation)
- automatically add Page Tab for this application
Cheers,
Michal
Yes it is possible. But it'll be a little different from what you are thinking, i guess.
I recently implemented code to add a tab to a page programmatically, it is as follows(in PHP) :
$tabAdded=$facebook->api("/".$id."/tabs","post", array("access_token" => $access,
"app_id" => $fbconfig['appid']));
From the code we see that we need an app id, an access token, and the page id($id). $facebook is an instance of the FacebookPHPSDK.
So here's how we can get the three things in question:
First app id, you'll need to create a Facebook page tab app, select Page Tab in the app's Basic settings (where you can mention the page tab url. This url will have the content for a page tab.) You'll also need to enable website because you need to ask the user for necessary permissions (namely manage_pages). For your specific requirement you have to give the domain of the catalogue management app.
Second page id and access token, once you have manage_pages permission you can query the graph api to get the pages of the user using : api('me/accounts') this returns data with page name, page category, page id, page access token for all the user's pages.
#thaddeusmt has already mentioned that you can't create new applications, and need to use the same app, you have to read the signed request and get the page id, and serve content. All that will be left to do is link your customer domains to the correct page ids.
Hope this was useful.
You can install/uninstall (add/remove) application tabs to/from Pages using the Facebook API:
http://developers.facebook.com/docs/reference/api/page/#tabs
You cannot create new applications, however. So you will need to use the same application for each Page.
The way you can show different content for each Page in the Tab (using the same application) is by checking the Signed Request. This contains the ID of the Facebook Page. The code that serves up your application Tab can look at the Page ID and serve up the appropriate content for that Page.
I hope this helps get you on the trail. Good luck!
Yes it is possible.
It's a two way process
First you have to get page_access_token through graphAPI.
www.facebook.com/?fields=access_token
This will return Page_access_token.
Use page access token and use post method
www.facebook.com/yourpageid/tabs/
Post Parameters:
app_id= 'YourAppID'
access_token = 'access_token'
That way you can add your facebook app into facebookPage.