detect if site is being accessed via iframe? embed widget with shopping cart
ajax, e-commerce, iframe
Solution
If you could provide a bit more information, maybe I could offer you an even better option. For starters, what have you built this application with (languages/framework)? Also, would you say your application's functionality is similar to Shopify's in that you allow users to host e-commerce sites through your service? If not, tell us a bit more about your application.
Here's a quick response to the options you provided.
option 1: the only real option as I see it. Whether you're embedding the shopping cart in specifically an iframe or rendering it onto the user's page as part of a template, you should be navigating the customer away to your main site to complete the checkout process. Or at least give them a lot of screen real-estate to work with (a sizable modal for example).
option 2: is messy. You can tell if a request is coming from a remote form (like an iframe) by appending url parameters. But taking the approach you're suggesting with this doesn't make too much sense.
option 3: too heavy unless you take a modal-approach like what I mentioned in response to option 1.
That being said, if you are building an application like Shopify, you should be able to build a template for each user's website that has a section dedicated to displaying a shopping cart pertaining to the current customer's session. No iframes or widgets necessary with this approach. But again, it all depends on the use cases of your application.
Problem
I have a shopping cart I want to embed in a widget/iframe on other users sites, I see three ways of doing this each with drawbacks. Here are options from estimated most to least work. Recreate interactive shopping cart UI in javascript widget then pass values to server script with AJAX, variables are passed to the main site, when user clicks "checkout" the user is then redirected to main shopping cart site with variables populated from what the entered in the widget. - pros: complete experience - cons: most work to complete creating UI and AJAX request. Somehow detect if user is coming to shopping cart via iframe, if this is the case have alternate code that opens new window when user clicks "checkout" redirecting user to secure page and getting variables from cart via AJAX to populate final checkout. - pros: mid amount of work, must do AJAX request to get variables from shopping cart to populate final checkout - cons: can we easily detect if site is being accessed from a user within an iframe on another site? complete entire checkout process inside iframe/widget. - pros: least ammount of work, just embed cart in iframe - cons: will not show https in browser user may be reluctant to purchase What is the best option?