个人中心
gpt4 book ai didi

javascript - 照片库适用于 gae appspot，但不适用于 127.0.0.1

转载 作者：行者123 更新时间：2023-12-02 19:42:05 24 4
gpt4 key购买 nike

当我在应用程序引擎上部署应用程序时，库可以工作 ( http://mark-smith-app.appspot.com/projects/ )，但无法离线工作。

我想让我的画廊使用以下命令:

C:\Python27\python.exe "C:/Program Files/Google/google_appengine/dev_appserver.py" .

当我打开 Chrome 并转到 127.0.0.1/projects/时，它会显示图库，但仅显示第一张图像，图库中的其余图像都是“黑色”。

我从http://www.awkwardgroup.com/sandbox/awkward-showcase-a-jquery-plugin/下载了图库

我下载的图库附带了一个示例 index4.html，当我用 Chrome 打开它时，它就可以工作。

我将index4.html中的所有内容复制到我的Google应用程序引擎projects.html中，并更改为css、js和图像创建了一个静态目录。

这里是app.yaml:

application: mark-smith-app
version: 1
runtime: python27
api_version: 1
threadsafe: true

handlers:
- url: /stylesheets
  static_dir: stylesheets

- url: /images
  static_dir: images

- url: /.*
  script: main.app

libraries:
- name: jinja2
  version: latest

我还访问了 127.0.0.1/projects 并“查看源代码”并将其复制到 html1.txt

我还将“查看源代码”从index4.html复制到html2.txt

我从以下 python 不同脚本中得到了以下结果:

f1 = open('html1.txt')
f2 = open('html2.txt')

from difflib import ndiff,IS_CHARACTER_JUNK



delta = ndiff([i.strip()+"\n" for i in f1],[i.strip()+"\n" for i in f2])

for line in delta:
    print line,

输出:

*** Python 2.7.2 (default, Jun 12 2011, 15:08:59) [MSC v.1500 32 bit (Intel)] on win32. ***
>>> 

  <!DOCTYPE html>
  <html>
  <head>
  <title>Awkward Showcase - Demo #4</title>
- <link rel="stylesheet" href="/stylesheets/style.css" />
?                              ^ ---------
+ <link rel="stylesheet" href="css/style.css" />
?                              ^
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
- <script type="text/javascript" src="/stylesheets/jquery.aw-showcase.js"></script>
?                                     -------------
+ <script type="text/javascript" src="jquery.aw-showcase.js"></script>
  <script type="text/javascript">

  $(window).ready(function()
  {
  $("#showcase").awShowcase(
  {
  content_width:            700,
  fit_to_parent:            false,
  auto:                 true,
  interval:             3000,
  continuous:               false,
  loading:              true,
  tooltip_width:            200,
  tooltip_icon_width:       32,
  tooltip_icon_height:  32,
  tooltip_offsetx:      18,
  tooltip_offsety:      0,
  arrows:                   true,
  buttons:              true,
  btn_numbers:          false,
  keybord_keys:         true,
  mousetrace:               false, /* Trace x and y coordinates for the mouse */
  pauseonover:          true,
  stoponclick:          true,
  transition:               'fade', /* hslide/vslide/fade */
  transition_speed:     500,
  transition_delay:     300,
  show_caption:         'onhover', /* onload/onhover/show */
  thumbnails:               true,
  thumbnails_position:  'outside-last', /* outside-last/outside-first/inside-last/inside-first */
  thumbnails_direction: 'horizontal', /* vertical/horizontal */
  thumbnails_slidex:        0, /* 0 = auto / 1 = slide one thumbnail / 2 = slide two thumbnails / etc. */
  dynamic_height:           true, /* For dynamic height to work in webkit you need to set the width and height of images in the source. Usually works to only set the dimension of the first slide in the showcase. */
  speed_change:         false, /* Set to true to prevent users from swithing more then one slide at once. */
  viewline:             false /* If set to true content_width, thumbnails, transition and dynamic_height will be disabled. As for dynamic height you need to set the width and height of images in the source. */
  });
  });

  </script>
  </head>
  <body>

  <div class="menu"><a href="index.html">Demo #1</a> (Normal) | <a href="index2.html">Demo #2</a> (Vertical thumnbails) | <a href="index3.html">Demo #3</a> (Horizontal thumbnails) | <a href="index4.html" class="active">Demo #4</a> (Dynamic height) | <a href="index5.html">Demo #5</a> (Hundred percent) | <a href="index6.html">Demo #6</a> (Viewline)</div>
  <div id="error"></div>
  <div style="width: 700px; margin: auto;">

  <!-- This is the button used to switch between One Page and Slideshow. -->
  <p><a id="awOnePageButton" href="#"><span class="view-page">View As One Page</span><span class="view-slide">View As Slideshow</span></a></p>

  <div id="showcase" class="showcase">
  <!-- Each child div in #showcase represents a slide -->
  <div class="showcase-slide">
  <div class="showcase-content">
  <!-- For dynamic height to work in webkit you need to set the width and height of images in the source.
  Usually works to only set the dimension of the first slide in the showcase. -->
- <img src="/images/05.jpg" alt="05" width="700px" height="600px" />
?           -
+ <img src="images/05.jpg" alt="05" width="700px" height="600px" />
  </div>
  <div class="showcase-thumbnail">
- <img src="/images/05.jpg" alt="05" width="140px" />
?           -
+ <img src="images/05.jpg" alt="05" width="140px" />
  <!-- The div below with the class .showcase-thumbnail-cover is used for the thumbnails active state. -->
  <div class="showcase-thumbnail-cover"></div>
  </div>
  </div>
  <!-- Each child div in #showcase represents a slide -->
  <div class="showcase-slide">
  <!-- Put the slide content in a div with the class .showcase-content. -->
  <div class="showcase-content">
- <img src="/images/01.jpg" alt="01" />
?           -
+ <img src="images/01.jpg" alt="01" />
  </div>
  <!-- Put the thumbnail content in a div with the class .showcase-thumbnail -->
  <div class="showcase-thumbnail">
- <img src="/images/01.jpg" alt="01" width="140px" />
?           -
+ <img src="images/01.jpg" alt="01" width="140px" />
  <div class="showcase-thumbnail-cover"></div>
  </div>
  <!-- Put the caption content in a div with the class .showcase-caption -->
  <div class="showcase-caption">
  <h2>Be creative. Get Noticed!</h2>
  </div>
  </div>
  <!-- Each child div in #showcase represents a slide -->
  <div class="showcase-slide">
  <div class="showcase-content">
- <img src="/images/04.jpg" alt="04" />
?           -
+ <img src="images/04.jpg" alt="04" />
  </div>
  <div class="showcase-thumbnail">
- <img src="/images/04.jpg" alt="04" width="140px" />
?           -
+ <img src="images/04.jpg" alt="04" width="140px" />
  <div class="showcase-thumbnail-cover"></div>
  </div>
  </div>
  <!-- Each child div in #showcase represents a slide -->
  <div class="showcase-slide">
  <div class="showcase-content">
- <img src="/images/03.jpg" alt="03" />
?           -
+ <img src="images/03.jpg" alt="03" />
  </div>
  <div class="showcase-thumbnail">
- <img src="/images/03.jpg" alt="01" width="140px" />
?           -
+ <img src="images/03.jpg" alt="01" width="140px" />
  <div class="showcase-thumbnail-cover"></div>
  </div>
  </div>
  <!-- Each child div in #showcase represents a slide -->
  <div class="showcase-slide">
  <div class="showcase-content">
- <img src="/images/02.jpg" alt="02" />
?           -
+ <img src="images/02.jpg" alt="02" />
  </div>
  <div class="showcase-thumbnail">
- <img src="/images/02.jpg" alt="01" width="140px" />
?           -
+ <img src="images/02.jpg" alt="01" width="140px" />
  <div class="showcase-thumbnail-cover"></div>
  </div>
  <!-- Put the tooltips in a div with the class .showcase-tooltips. -->
  <div class="showcase-tooltips">
  <!-- Each anchor in .showcase-tooltips represents a tooltip. The coords attribute represents the position of the tooltip. -->
  <a href="http://www.awkward.se" coords="634,130">
  <!-- The content of the anchor-tag is displayed in the tooltip. -->
  This is a tooltip that displays the anchor html in a nice way.
  </a>
  <a href="http://www.awkward.se" coords="200,440">
  This is a tooltip that displays the anchor html in a nice way.
  </a>
  <a href="http://www.awkward.se" coords="600,440">
  This is a tooltip that displays the anchor html in a nice way.
  </a>
  <a href="http://www.awkward.se" coords="356, 172">
  <!-- You can add multiple elements to the anchor-tag which are display in the tooltip. -->
- <img src="/images/glasses.png" />
?           -
+ <img src="images/glasses.png" />
  <span style="display: block; font-weight: bold; padding: 3px 0 3px 0; text-align: center;">
  White Glasses: 500$
  </span>
  </a>
  </div>
  </div>
  </div>

  </div>

  <div style="text-align: center; margin-top: 50px;">
  <a href="http://www.awkwardgroup.com/sandbox/awkward-showcase-a-jquery-plugin">
  Click here to download and learn more about this jQuery plugin.
  </a>
  </div>

  </body>
  </html>
>>>

日志如下:我运行应用程序，单击项目链接转到/projects/页面，其中图库正确显示 05.jpg 然后您可以看到我单击到 01 和 04.jpg，然后返回到05.jpg(05.jpg 是唯一没有被涂黑的)。不过缩略图可以使用。

C:\Python27\python.exe "C:/Program Files/Google/google_appengine/dev_appserver.py" .
WARNING  2012-04-22 23:50:20,888 rdbms_mysqldb.py:74] The rdbms API is not available because the MySQLdb library could not be loaded.
INFO     2012-04-22 23:50:21,914 appengine_rpc.py:160] Server: appengine.google.com
INFO     2012-04-22 23:50:21,921 appcfg.py:581] Checking for updates to the SDK.
INFO     2012-04-22 23:50:23,601 appcfg.py:599] The SDK is up to date.
INFO     2012-04-22 23:50:23,891 dev_appserver_multiprocess.py:650] Running application dev~mark-smith-app on port 8080: http://localhost:8080
INFO     2012-04-22 23:50:23,891 dev_appserver_multiprocess.py:652] Admin console is available at: http://localhost:8080/_ah/admin
WARNING  2012-04-22 23:50:24,252 py_zipimport.py:139] Can't open zipfile C:\Python27\lib\site-packages\pyfacebook-1.0a2-py2.7.egg: IOError: [Errno 13] file not accessible: 'C:\\Python27\\lib\\site-packages\\pyfacebook-1.0a2-py2.7.egg'
INFO     2012-04-22 23:50:25,663 dev_appserver.py:2865] "GET / HTTP/1.1" 200 -
INFO     2012-04-22 23:50:25,744 dev_appserver.py:2865] "GET /stylesheets/main.css HTTP/1.1" 200 -
INFO     2012-04-22 23:50:25,825 dev_appserver.py:2865] "GET /images/home.jpg HTTP/1.1" 200 -
INFO     2012-04-22 23:50:25,960 dev_appserver.py:2865] "GET /favicon.ico HTTP/1.1" 404 -
INFO     2012-04-22 23:50:32,076 dev_appserver.py:2865] "GET /projects/ HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,164 dev_appserver.py:2865] "GET /stylesheets/style.css HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,257 dev_appserver.py:2865] "GET /stylesheets/jquery.aw-showcase.js HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,414 dev_appserver.py:2865] "GET /images/05.jpg HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,499 dev_appserver.py:2865] "GET /images/black-opacity-40.png HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,572 dev_appserver.py:2865] "GET /images/01.jpg HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,651 dev_appserver.py:2865] "GET /images/white-opacity-80.png HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,730 dev_appserver.py:2865] "GET /images/04.jpg HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,811 dev_appserver.py:2865] "GET /images/03.jpg HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,891 dev_appserver.py:2865] "GET /images/02.jpg HTTP/1.1" 200 -
INFO     2012-04-22 23:50:32,973 dev_appserver.py:2865] "GET /images/glasses.png HTTP/1.1" 200 -
INFO     2012-04-22 23:50:33,045 dev_appserver.py:2865] "GET /images/arrows-small.png HTTP/1.1" 200 -
INFO     2012-04-22 23:50:33,122 dev_appserver.py:2865] "GET /images/arrows.png HTTP/1.1" 200 -
INFO     2012-04-22 23:50:33,220 dev_appserver.py:2865] "GET /favicon.ico HTTP/1.1" 404 -
INFO     2012-04-22 23:50:38,493 dev_appserver.py:2865] "GET /images/01.jpg HTTP/1.1" 304 -
INFO     2012-04-22 23:50:44,198 dev_appserver.py:2865] "GET /images/04.jpg HTTP/1.1" 304 -
INFO     2012-04-22 23:50:46,536 dev_appserver.py:2865] "GET /images/03.jpg HTTP/1.1" 304 -
INFO     2012-04-22 23:50:52,927 dev_appserver.py:2865] "GET /images/04.jpg HTTP/1.1" 304 -
INFO     2012-04-22 23:50:54,806 dev_appserver.py:2865] "GET /images/01.jpg HTTP/1.1" 304 -
INFO     2012-04-22 23:50:57,243 dev_appserver.py:2865] "GET /images/05.jpg HTTP/1.1" 304 -

最佳答案

从给出的信息中几乎不可能判断出确切的原因是什么，但是开发服务器和生产服务器之间有一个很大的区别:开发服务器是单线程的，因此如果无法请求在图像请求到来之前完成，最终浏览器将超时并且不再尝试渲染图像。

查看开发服务器写出的日志会很有用。

关于javascript - 照片库适用于 gae appspot，但不适用于 127.0.0.1，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10273017/

24 4 0
文章推荐： javascript - 如何从浏览器控制台访问存储在函数闭包中的javascript变量？
文章推荐： javascript - 如何自动将JS文件放入AJAX调用的页面中？
文章推荐： javascript - 如何连续多次获取Ajax成功消息事件
文章推荐： javascript - setInterval 只是不会随着clearInterval 停止
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com