Unknown Error on embeding Stripe Pricing Table - html

I have an error when I try to embed a stripe princing table on a web page.
When I copy the code provided by stripe during the cration of the pricing table and refresh the page it gives me unknown error. I used the HTML method to embed the pricing table.
Here my code :
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
</head>
<body>
<script async src="https://js.stripe.com/v3/pricing-table.js">
</script>
<stripe-pricing-table pricing-table-id="{{PRICING_TABLE_ID}}"
publishable-key="{{PUBLISHABLE_KEY}}">
</stripe-pricing-table>
</body>
</html>
Do you guys have any solution ?

In order to test the pricing table in your local environment, you need to have have a local HTTP Server(e.g. Nginx, Apache).
The pricing table requires a website domain to render. You need to run a local HTTP server and host your website’s index.html file over the localhost domain.
More details can be found here [1].
[1] https://stripe.com/docs/payments/checkout/pricing-table#limitations:~:text=Testing%20the%20pricing,server%20npm%20module.

Related

How to access non-home page in Amplify

I'm trying to learn to use AWS Amplify. When I just use the index.html file it runs fine.
But when I try to access a non-home page via a link from the main Amplify page (on AWS) I get an error (below). All the code is just html. (I'm trying to keep it simple while I attempt to learn how to work with AWS Amplify.)
This file runs just fine.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AWS Amplify Test</title>
</head>
<body>
</body>
</html>
But I cannot run the next file.
<html>
<head>
<meta charset="UTF-8">
<title>AWS Amplify Test: About</title>
</head>
<body>
</body>
</html>
The following file does not run. Instead I get this error message:
This XML file does not appear to have any style information associated with it. The document tree is shown below.
<Error>
<Code>AccessDenied</Code>
<Message>Access Denied</Message>
<RequestId>9AE4WZ4KDMAXGAF0</RequestId>
<HostId>+Jk4OYPdxus7Nd/wT1vQ5Oi4bNRCUr56nzVjFiSlHxixpvJiFboB74A7258PCv4RUrSD8JIQPak=</HostId>
</Error>
I followed (I think) the same steps I used with the Index.html file: Run WinZip and copy it into the Amplify screen.
TWO QUESTIONS:
Why does this error occur and how can I fix it?
How, in general, can I have a simple html file with several files linked to it via menu options?
Thanks for any help. It will be much appreciated, while I stumble around as a beginner.

Twitter Card fails validation - why is this not picking up any tags

I have a bare bones html page created for testing sharing via twitter. When I test this out in twitter card validator it says:
INFO: Page fetched successfully
WARN: No metatags found
Here is the complete webpage:
<!doctype html>
<html>
<head>
<meta content="text/html; charset=UTF-8" name="Content-Type">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Title for this page">
<meta name="twitter:description" content="115 character description">
<meta name="twitter:image" content="https://urlToAzure/thatends/withjpgfilename.jpg">
<title>Page Title</title>
</head>
<body bgcolor="#CCCCCC">
<div id="allContentInBody">
Test page.
</div>
</body>
</html>
Here is the public link of this webpage:
https://www.privatebox.com/casa/test.html
I've updated robots.txt to allow is all.
EDIT 2: I made some progress and have additional information.
My setup is a NGINX acting as reverse proxy to node.js for all traffic, no static pages.
I setup a static page that will be served by NGINX itself. And now Twitter card validator works. I see the image and other information in the card.
So the problem is that somehow when NGINX is forwarding the request to node.js - the page served seems to be failing twitter's card validation. In that it is not able to see the metatags.
I'm certain that NGINX is not stripping the meta tags. so there is something else that twitter tries to do which my node server does not get to see and is thus failing.
Any advice on NGINX as reverse proxy with node.js and how to get twitter to work is appreciated.
I figured out the problem. It was on the node Server, I was serving the file with
res.write(<contents>)
res.end().
I changed it to
res.send(<contents>)
and that fixed the issue. The metatags are now seen by twitter card validator and the image gets picked up too.

Creating page API (through Graph) does not work

I'm trying to create pages using the beta API for OneNote (through Graph). Even though I've completely emptied out my OneNote (no notebooks), I still get 20117 - An item with this name already exists in this location. I've tested and I can create a Notebook just fine through this, but pages just refuse to be created (oddly enough, a default Notebook and Section will be created, but the page won't)
The URL I'm sending the POST to is: https://graph.microsoft.com/beta/me/notes/pages?sectionName=Quick%20Notes
The HTML content for the page I'm providing is:
<!DOCTYPE html>
<html>
<head>
<title>Testing Page</title>
<meta name="created" content="2015-07-22T09:00:00-08:00" />
</head>
<body>
yeaaaah
</body>
</html>

Share an image on Facebook and redirect to Fan Page

I am trying to share an image on Facebook via Email Marketing but I am having trouble to redirect after the share.
The code I insert in the email is:
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>My Title</title>
</head>
<body bgcolor='#eaeaea' style='font-family:Verdana'>
<div>
<a href='http://www.facebook.com/dialog/share?app_id=MY_APP_ID&href=URL_IMAGE&redirect_uri=https://www.facebook.com/FAN_PAGE&display=page'><div>Please share this image with your friends on Facebook:</div><BR><div><IMG SRC='URL_IMAGE'></a>
</div>
</body>
</html>
I get the error that I can't redirect to that URL.
I have configured in the APP the url of the website where is stored the image, but I am not able to redirect to the fan page on facebook.
I assume it is this error:
Can't Load URL: The domain of this URL isn't included in the app's domains. To be able to load this URL, add all domains and subdomains of your app to the App Domains field in your app settings.
It seems that you can´t redirect directly to a facebook.com URL, you have to redirect to your own external website instead - and you have to add that URL/domain in your App settings. You could just implement a simple redirection from your external website to the fan page, as a workaround.

DNS prefetching of subdomains

Do I have to prefetch a subdomain separately?
E.g. when I have <link rel="dns-prefetch" href="//example.com"> do I need an additional tag for //static.example.com as well?
I've made the following test: first created simple HTML page
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="dns-prefetch" href="//example.com/">
</head>
<body>
Test link
Test link 2
</body>
</html>
For the domain and subdomain for which I own dns nameserver. Then I cleaned dns cache and opened this page in firefox private window. I observed in the logs of my dns nameserver that only request for "example.com" was made and no requests for subdomains.
Then I changed the page as follows:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="dns-prefetch" href="//example.com/">
<link rel="dns-prefetch" href="//sub.example.com/">
</head>
<body>
Test link
Test link 2
</body>
</html>
Again cleared dns cache and opened this page in firefox private window. Now I observed that dns requests we made for both domain and it's subdomain.
So I can conclude that yes - you have to prefetch subdomains separately.
You have to prefetch every subdomain separately.
It is how DNS works. You ask for name, it answers back, it knows nothing about "subdomains" it's just a name.
nslookup google.com gives you answers for google.com only, no subdomains.
nslookup www.google.com gives www.google.com only, no top-level domains.