javascript - AMP Authorization failed Error -
this first example on amp , there failed amp page give me error line:
click image see big version
what should ?
<!doctype html> <html amp lang="tr"> <head> <meta charset="utf-8"> <script async src="https://cdn.ampproject.org/v0.js"></script> <title>otel - tur detay sayfaları</title> <!-- canonical url buraya gelecek --> <!-- #href kısmına standart sayfa url'i gelecek--> <link rel="canonical" href="http://anitur.com.tr/otel/otel-detay-normal-version.html"> <!--/canonical url bitti--> <!-- amp için canonical tagi--> <!-- #canonical amp versiyonu için amphtml taginin href özniteliğine sayfanın amp versiyonu yazılacak --> <link rel="amphtml" href="http://anitur.com.tr/otel/otel-detay-amp-version.html" /> <!--/ amp için canonical tagi--> <link rel="apple-touch-icon" sizes="60x60" href="//cdn.anitur.com/web/assets/img/favicon/apple-icon-60x60.png"> <!-- amp components--> <script async custom-element="amp-carousel" src="https://cdn.ampproject.org/v0/amp-carousel-0.1.js"></script> <script async custom-element="amp-selector" src="https://cdn.ampproject.org/v0/amp-selector-0.1.js"></script> <script async custom-element="amp-access" src="https://cdn.ampproject.org/v0/amp-access-0.1.js"></script> <script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script> <script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script> <script async custom-element="amp-accordion" src="https://cdn.ampproject.org/v0/amp-accordion-0.1.js"></script> <script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script> <script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script> <script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.1.js"></script> <!--/ amp components--> <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"> <script id="amp-access" type="application/json"> { "authorization": "authorization?rid=reader_id&url=canonical_url&ref=document_referrer&_=random", "pingback": "pingback?rid=reader_id&ref=document_referrer&url=canonical_url", "login": "/samples_templates/hotel/login?rid=reader_id&url=canonical_url", "authorizationfallbackresponse": { "error": true, "access": false } } </script> <script type="application/ld+json"> { "@context": "http://schema.org", "@type": "newsarticle", "headline": "aurum moon resort", "datepublished": "2015-10-07t12:02:41z", "image": [ "logo.jpg" ] } </script> <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript> <style amp-custom> body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background: #eceaeb; font-size: 100%; font-family: tahoma; box-sizing: border-box; color:#404040; } *{ box-sizing: border-box; } nav#navigation { margin-top: 15px; margin-bottom: 15px; } #navigation li{ float:left; position: relative; } #navigation li:before{ display:block; } #navigation li a{ font-size: 12px; display: block; margin-right: 5px; } #wrapper{ background: #fff; border-radius: 3px; padding: 15px; } .layout{ width:90%; margin:10px auto; } .layout:before, .layout:after { content: ""; display: table; clear: both; } ul,ol{ margin:0; padding:0; list-style-type: none; } a{ text-decoration: none; color:#404040; } #detail-header{ margin-bottom: 5px; } #detail-header:before,#detail-header:after{ content:""; display:table; clear:both; } .col-left{ width:70%; float:left; } .col-right{ width:30%; float:right; } #detail-header h1{ margin: 0 0 2px 0; font-size: 1.1em; } #detail-header ul,#detail-header ol{ margin-bottom: 5px; } #detail-header li{ display: inline-block; background: #eceaeb; border: 1px solid #d2d2d2; color: #333; font-size: 11px; padding: 2px 8px; border-radius: 2px; } .location{ padding: 0; margin:0; font-size: 11px; color: #636363; } .list-details ul, .list-details ol{ margin-top: 10px; } .list-details li,.list-details li a{ font-size: 12px; position: relative; padding-left: 14px; padding-bottom: 2px; margin-left: 5px; } .list-details li:before{ content: ""; width: 5px; height: 5px; color: #000; background: #000; float: left; vertical-align: middle; position: absolute; left:0px; top: 6px; } #stay-input{ border:1px solid #ccc; padding:12px; } .ampstart-btn.caps{ background-color: #efefef; padding: 7px; border: 1px solid #dfdfdf; margin:5px 0; } .ampstart-input{ margin-bottom: 5px; } [name="guests"]{ width:50%; padding: .3em; border-radius: 4px; border: 1px solid #ccc; box-shadow: inset 0 1px 3px #ddd; } .ampstart-input:before, .ampstart-input:after{ content:""; display:table; clear:both; } .ampstart-input label{ float:left; width:50%; } .ampstart-input input{ float:right; width:50%; padding: .3em; border-radius: 4px; border: 1px solid #ccc; box-shadow: inset 0 1px 3px #ddd; } amp-accordion section[expanded] .show-more { display: none; } amp-accordion section:not([expanded]) .show-less { display: none; } amp-accordion section[expanded]{ padding: 10px 4px; } amp-accordion section h4 { font-size: 14px; padding: 10px; background:#f0f0f0; } amp-accordion{ padding:10px 0; } amp-accordion#hidden-header section[expanded] h4 { border: none; } .amptabcontainer { display: flex; flex-wrap: wrap; } .tabbutton[selected] { outline: none; background: #fff; padding:7px; } .tabbutton { list-style: none; flex-grow: 1; text-align: center; cursor: pointer; } .tabcontent { display: none; width: 100%; order: 1; border: 1px solid #ccc; padding:10px;; } .tabbutton[selected]+.tabcontent { display: block; } amp-selector [option][selected]{ outline:1px solid #ccc; background:#f0f0f0; } .itemcustom { border: 1px solid #000; height: 280px; width: 380px; margin: 10px; text-align: center; padding-top: 140px; } amp-selector { margin:1rem 0; } .map{ margin: 10px; } .map h4{ font-size: 16px; margin: 0; border-bottom: 1px solid #ddd; padding-bottom: 5px; margin-bottom: 10px; } .services{ margin:10px 0; } .services h5{ margin: 0; border-bottom: 1px solid #ccc; padding-bottom: 5px; } .services p { font-size: 11px; line-height:18px; } .price{ background: #eceaeb; border: 1px solid #d2d2d2; color: #333; font-weight: 600; } .price span{ color: #8e8e8e; font-size: 10px; font-weight: 400; } .buy{ color:#fff; background:orange; padding:0; display:block; } .price,.buy{ font-size: 12px; padding:3px; margin:0; text-align: center; } .go-links{ margin-left: 9px; } .go-links a{ font-size: 12px; padding: 7px; display: inline-block; } .go-hotel{ border: 1px solid #ccc; background: #f0f0f0; } .go-call{ background: #012770; border:1px solid #012e85; color: #fff; } .call-number{ text-align: center; font-size: 12px; } .call-number h5{ padding: 0; margin: 0 0 5px 0; } .call-number a{ display: block; } #carousel-with-preview amp-img { transition: opacity 1s ease-in-out; } .carousel-preview { display: flex; align-items: center; justify-content: center; } .carousel-preview button { height: 40px; width: 60px; min-width: 60px; margin: 4px; padding: 0; } .carousel-preview .amp-carousel-slide { margin: 4px; padding: 0; } .carousel-preview button:active { opacity: 0.5; } .checkit h5{ margin: 15px 5px 5px 5px; } </style> </head> <body> <!-- header--> <header class="layout"> <!-- logo--> <div class="logo col-left"> <amp-img src="img/logo.png" width="60" height="57" alt="anı tur"></amp-img> </div> <div class="col-right call-number"> <h5>bilgi ve rezervasyon</h5> <a href="tel:08503000264" class="first-number">0850 300 02 64</a> <a href="tel:4440264" class="last-number">444 0 264</a> </div> <!-- logo--> </header> <!--/header --> <!--/navigation--> <main id="wrapper" class="layout"> <!-- detay header--> <div id="detail-header"> <div class="col-left"> <h1>aurum moon resort</h1> <ul> <li>ultra Şey dahil</li> <li>oda kahvaltı</li> </ul> <p class="location">didim,yeşilkent</p> </div> <div class="col-right"> <a href="#" class="buy">satin al</a> <p class="price"> 269.75 tl <span>'den itibaren</span> </p> </div> </div> <!--/ detay header--> <!-- detay body--> <div id="detail-body"> <!-- slider alanı--> <div id="detail-slider"> <amp-carousel id="carousel-with-carousel-preview" width="400" height="250" layout="responsive" type="slides"> <amp-img src="https://ampbyexample.com/img/product_hero2_1024x683.jpg" width="400" height="250" layout="responsive" alt="resim açıklama"></amp-img> <amp-img src="https://ampbyexample.com/img/product_hero3_1024x683.jpg" width="400" height="250" layout="responsive" alt="a sample image"></amp-img> <amp-img src="https://ampbyexample.com/img/product_hero1_1024x683.jpg" width="400" height="250" layout="responsive" alt="a sample image"></amp-img> <amp-img src="https://ampbyexample.com/img/product_hero2_1024x683.jpg" width="400" height="250" layout="responsive" alt="a sample image"></amp-img> <amp-img src="https://ampbyexample.com/img/product_hero3_1024x683.jpg" width="400" height="250" layout="responsive" alt="a sample image"></amp-img> <amp-img src="https://ampbyexample.com/img/product_hero1_1024x683.jpg" width="400" height="250" layout="responsive" alt="a sample image"></amp-img> <amp-img src="https://ampbyexample.com/img/product_hero2_1024x683.jpg" width="400" height="250" layout="responsive" alt="a sample image"></amp-img> </amp-carousel> <amp-carousel class="carousel-preview" width="auto" height="48" layout="fixed-height" type="carousel"> <button on="tap:carousel-with-carousel-preview.gotoslide(index=0)"><amp-img src="https://ampbyexample.com/img/product_hero2_1024x683.jpg" width="60" height="40" layout="responsive" alt="a sample image"></amp-img></button> <button on="tap:carousel-with-carousel-preview.gotoslide(index=1)"><amp-img src="https://ampbyexample.com/img/product_hero3_1024x683.jpg" width="60" height="40" layout="responsive" alt="a sample image"></amp-img></button> <button on="tap:carousel-with-carousel-preview.gotoslide(index=2)"><amp-img src="https://ampbyexample.com/img/product_hero1_1024x683.jpg" width="60" height="40" layout="responsive" alt="a sample image"></amp-img></button> <button on="tap:carousel-with-carousel-preview.gotoslide(index=0)"><amp-img src="https://ampbyexample.com/img/product_hero2_1024x683.jpg" width="60" height="40" layout="responsive" alt="a sample image"></amp-img></button> <button on="tap:carousel-with-carousel-preview.gotoslide(index=1)"><amp-img src="https://ampbyexample.com/img/product_hero3_1024x683.jpg" width="60" height="40" layout="responsive" alt="a sample image"></amp-img></button> <button on="tap:carousel-with-carousel-preview.gotoslide(index=2)"><amp-img src="https://ampbyexample.com/img/product_hero1_1024x683.jpg" width="60" height="40" layout="responsive" alt="a sample image"></amp-img></button> <button on="tap:carousel-with-carousel-preview.gotoslide(index=0)"><amp-img src="https://ampbyexample.com/img/product_hero2_1024x683.jpg" width="60" height="40" layout="responsive" alt="a sample image"></amp-img></button> </amp-carousel> </div> <!--/slider alanı--> <!-- fiyat sorgulama--> <div class="checkit"> <h5>oda fiyatlarını görmek için tarih seç</h5> <form method="get" class="px3 mb4" action="check-available" action-xhr="check-available" target="_top"> <fieldset id="stay-input" class="border-none p0 m0"> <div class="ampstart-input relative m0 p0 mb3"> <label for="checkin">check-in:</label> <input name="checkin" id="checkin" type="date" class="block border-none p0 m0" value="2017-08-15"> </div> <div class="ampstart-input relative m0 p0 mb3"> <label for="checkout">check-out:</label> <input name="checkout" type="date" class="block border-none p0 m0" value="2017-08-16"> </div> <div class="ampstart-input relative m0 p0 mb3 "> <label for="guests">kişi sayı:</label> <select name="guests" class="block border-none p0 m0"> <option value="1">1</option> <option value="2" selected>2</option> <option value="3">3</option> </select> </div> </fieldset> <input type="submit" value="göster" class="ampstart-btn caps"> <div submit-success> <template type="amp-mustache"> bulunan odalar buraya gelecek </template> </div> <div submit-error> <template type="amp-mustache"> müsait oda yok </template> </div> </form> </div> <!--/ fiyat sorgulama--> <amp-selector role="tablist" layout="container" class="amptabcontainer"> <div role="tab" class="tabbutton" selected option="a">yaz sezonu</div> <div role="tabpanel" class="tabcontent"> <!-- oda Özellikleri --> <amp-accordion> <section> <h4>genel Özellikler</h4> <!-- genel Özellikler --> <div class="list-details"> <ol> <li>ana restaurant ( açık )</li> <li>Çocuk oyun alanları *</li> <li>laminant zemin</li> <li>açık havuz</li> </ol> </div> <!--/ genel Özellikler --> </section> <section> <h4>plaj Özellikleri</h4> <!-- genel Özellikler --> <div class="list-details"> <ol> <li>ana restaurant ( açık )</li> <li>Çocuk oyun alanları *</li> <li>laminant zemin</li> <li>açık havuz</li> </ol> </div> <!--/ genel Özellikler --> </section> </amp-accordion> <!--/ oda Özellikleri bitiş--> <!-- hizmetler --> <div class="services"> <h5>konum</h5> <p>tesis, denizyaka mevkiindedir. antalya merkeze 60 km, antalya havaalanına 50 km, belek, side ve manavgat' 30 km mesafededir. toplam 1.000.000 m2 alana kurulmuştur.</p> </div> <!--/ hizmetler --> </div> <div role="tab" class="tabbutton" option="b">kış sezonu</div> <div role="tabpanel" class="tabcontent">kış sezonu </div> </amp-selector> <!-- harita --> <div class="map"> <h4>harİta</h4> <amp-iframe width="600" height="300" layout="responsive" sandbox="allow-scripts allow-same-origin allow-popups" frameborder="0" src="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d12047.436573933934!2d29.098413750000002!3d40.984565100000005!3m2!1i1024!2i768!4f13.1!5e0!3m2!1str!2str!4v1463140023736"> </amp-iframe> </div> <!--/ harita bitiş--> <!--/ detay footer --> </div> <!--/ detay body--> <!-- detay footer --> <div id="detay-footer"> <div class="go-links"> <a href="#" class="go-hotel">otele git</a> <a href="#" class="go-call">sizi arayalım</a> </div> </div> </main> <!-- kapsayıcı --> </body> </html>

Comments
Post a Comment