通过Python Flask服务器提供服务时,Vue应用无法加载

雪橇车

我有一个简单的“ hello world” VueJS应用程序,我正在尝试开始工作:

<!doctype html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <script type="text/javascript" src="https://unpkg.com/vue"></script>    
</head>
<body>    
  <div id="app">
    Message: {{ message }}
  </div>    
<script>
  var vm = new Vue({
    el: "#app",
    data: {
      message: "Hello, world"
    }
  });
</script>  
</body>
</html>

当我在浏览器中将该文件加载到本地磁盘(即file:///home/user/vue-project/index.html)上时,将加载并显示“ Hello,world”。

但是,如果我尝试获取相同的文件并通过python flask开发服务器或gunicorn提供该文件,则{{message}}会变为空白。

有谁知道可能导致这种情况发生的原因?

乔兰·比斯利(Joran Beasley)

flask使用jinja2呈现其变量,{{ variable }}该解析器用作其解析定界符

render("mytemplate.html",message="Hello"){{ message }}在处理任何JavaScript之前用“ Hello”替换所有块...由于您未定义消息,它只是一个空字符串...您将需要配置vue以使用替代定界符(我使用[[ message ]]

<!doctype html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <script type="text/javascript" src="https://unpkg.com/vue"></script>    
</head>
<body>    
  <div id="app">
    Message: [[ message ]]
  </div>    
<script>
  var vm = new Vue({
    el: "#app",
    delimiters : ['[[', ']]'],
    data: {
      message: "Hello, world"
    }
  });
</script>  
</body>
</html>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

通过Flask-Python服务React生产应用程序(本地服务器)

通过HTTPS服务Flask服务器

如何在 React JS 中通过静态服务器为应用程序提供服务时设置新端口

将带有服务员服务器的 Python Flask 设为 Windows 服务时无法运行

使用Python简单的HTTP服务器时无法加载真棒字体

无法通过Python访问Samba服务器上的文件

Python Socket服务器:无法通过Internet连接

Python Flask:拒绝服务器关闭时出错

通过HTTP服务器提供服务时,jvectormap高度较小

通过NodeJS服务器提供服务时,Angular不更新html模板变量

通过Ajax加载页面时,无法获取服务器值并将其显示在selectmenu下拉列表中

无法通过apache浏览服务器

无法通过 url 访问服务器

无法通过SSH访问服务器

无法通过 ssh 进入服务器

在网络服务器上运行的Flask应用可调用远程服务器python模块

用 python 启动 Flask 服务器

从 Flask 服务器运行 python 脚本

简单的flask应用服务器通过ajax和jquery传递数据

通过子进程运行bokeh服务器时,是否可以访问为其提供的args?

当Flask-migrate通过SSH隧道连接到MySQL服务器时,访问被拒绝

“打开终端时出错:未知。” 通过 Python 在 SSH 服务器中运行命令时出错

当通过npm的serve函数提供服务时,Vue应用程序可以工作,但是通过golang net / http包提供服务时,空白页面

如何通过Android应用在AWS服务器上运行python代码

通过Docker的GUI应用程序-X11-“无法初始化服务器”

Postgresql无法通过PGAdmin4连接应用程序服务器

使用CLI通过HTTPS运行Flask开发服务器

通过代理IP连接到Flask本地服务器

我可以通过哪种方式将发布到我的Flask服务器Webhook上的json传递给运行该服务器的Java应用程序