I'm not using Facebook Messenger's payment API. I am integrating with Visa Checkout manually.
I am able to integrate with Visa Checkout with no issues on a top-level test page. What I mean by top-level is that I am loading it directly as a test outside an iframe.
When I load such a payment page in an iframe, which is something that I have to do when using Facebook Messenger web view, Visa Checkout fails because the iframe doesn't have the allowpaymentrequest attribute. I don't have access to the iframe since it is generated by Messenger automatically when the webview with my payment page is opened.
I don't think I can just access this parent iFrame and call some "setAttribute" method?
So what can I do?
EDIT: This is the error message that Visa Checkout sdk throws, this is a standard PaymentRequest API thing.
Error creating payment request DOMException: Failed to construct 'PaymentRequest': Must be in a top-level browsing context or an iframe needs to specify 'allowpaymentrequest' explicitly
Related
I have an ecommerce that lives inside an iframe.
At a certain point I need to redirect the user to the checkout page, and my checkout provider is on another domain.
for example: my website is www.a.example and the provider is on payments.b.example.
I get blocked in doing this inside an iframe. How can I achieve my objective?
I am trying to implement custom facebook login flow with some custom 3rd party backend system that requires the code that's returned by facebook's web dialog login via the callback's URL parameter -
e.g. https://calbackurl.com/?code=AsdadqwdDAWDASDwdACASdASd)
to be sent over to their end (the 3rd party backend system use the term "auth code" to describe this). But I have to use mobile facebook SDK (iOS), which does not have response_type option nor the code parameter.
How do I get this code without using the web dialog login?
I followed the guide over here and here.
Here are the things that I have tried:
1) I setup facebook login on my ios app. Trigger the login flow, and once I get the access token from the mobile SDK, I send this access token to my own API server which then call this endpoint -
https://graph.facebook.com/oauth/client_code?access_token=...&client_id=...&client_secret=...&redirect_uri=...
to get the code, which I am not sure if it is the same as the code URL parameter provided by the web dialog login flow. After that, I send this code over to the 3rd party backend system. But it says the code is invalid.
2) However, when I setup the web dialog login flow for testing purpose, and manually copy the code from the callback's URL parameter and send it over to the 3rd party backend system, it does not return such error. And the 3rd party vendor verified that, this "code" is correct. But why it fails on 1.?
Is there a way to display the FB login :
https://www.facebook.com/login.phpskip_api_login=1&next=https%3A%2F%2Fwww.facebook.com%2Fdialog%2Foauth%3Fclient_id%3D199667856843796%26redirect_uri%3Dhttps%253A%252F%252Flocalhost%252FShoppingCart%252FLogin%252FExternalLoginCallback%253F__provider__%253Dfacebook%2526__sid__%253Dc750cc60beac497fbad2dfd340921f7e%26scope%3Demail%26from_login%3D1&cancel_uri=https%3A%2F%2Flocalhost%2FShoppingCart%2FLogin%2FExternalLoginCallbac...
in an IFrame?
I am using the MVC 4 OAuthWebSecurity.RegisterFacebookClient for FB login and the page is hosted in an iframe
Thanks
Is there a way to display the FB login […] in an IFrame?
No, there isn’t (apart from calling the FB.login method of the JS SDK creating an onverlay inside a canvas/page tab app) – for obvious security reasons:
Inside an iframe, I could easily copy Facebook’s login dialog, but send all user input (their Facebook username and password, if I can convince them they need to login first) to my own server.
So that this kind of “phishing” can not easily occur, it is mandatory for the user to be able to see https://www.facebook.com/… in the address bar of their browser whenever they login to Facebook – and therefor, since an iframe does not show its documents address anywhere, calling the Facebook Auth dialog within an iframe is not possible.
You can try open new window for facebook login and then return to your iframe
I have a facebook app and i want to increase the login conversions so i want my users to land on my app's home page to see what i'm offering and then once they clicked they will get the auth dialog.
How do i do this?
Thanks
There's no guarantee that adding a landing page will increase conversions. In fact, it may hurt by adding additional clicks to the funnel. However, if you want to try it, here's what you need to do.
Facebook does not prompt for auth until you tell it to. In order to allow your users to see a landing page before prompting for auth, make sure you do the following:
1) Ensure "Authenticated referrals" are turned off. This can be done in the Developer App under Settings > Auth Dialog
2) If using the JS SDK, make sure you are calling FB.getLoginStatus() so you can redirect users that have already authorized your app to the appropriate page. (You can also do this server side, using the PHP SDK or equivalent, to avoid the client side redirect).
3) If using the JS SDK, don't call FB.login() until you are ready to prompt for auth. For instance, you can call this in response to a user clicking a login button on your landing page. If not using the JS SDK, don't redirect to the auth dialog until after the user clicks your login button.
Please read this carefully:
http://developers.facebook.com/docs/reference/androidsdk/dialog/
void dialog(Context context, String action, DialogListener listener)
Generate a Facebook UI dialog for the request action in the given
Android context.
Parameters
context - The Android context in which we will generate this dialog.
action - The type of dialog to call. Currently supported methods are
feed and oauth.
listener - Callback interface to notify the application when the
dialog has completed.
Return Value
None, the callback interface will be notified when the request has
completed.
Note
This method is asynchronous and the callback will be invoked in the
original calling thread (not in a background thread).
I'm building a Page Tab application that will allow Facebook users to make purchases through our client's FB page directly. In order to do that, once the user arrives at checkout, it must be authenticated and the user must be logged in in order to obtain their e-mail address.
However, when I try to authenticate the user via the URL:
https://www.facebook.com/dialog/oauth?client_id=APP_ID&redirect_uri=REDIRECT&scope=manage_pages%2Cemail
Instead of staying within the iframe, it redirects the entire Facebook page, making it impossible to easily authenticate the customer and continue on to checkout.
I'm referencing a similar app that does exactly what I need, but they seem to be using FBML which, to my knowledge, is being deprecated in 2012. If using this URL is an incorrect way to authenticate a customer in a Page Tab app, what would be the proper way to do this without the use of FBML?
Why are you using authentication dialog via that URL? How about using javascript SDK function, FB.login() instead?
http://developers.facebook.com/docs/reference/javascript/FB.login/