vue使用python
by Neo Ighodaro
由新Ighodaro
如何使用Python和Vue创建两人游戏 (How to create a two-player game with Python and Vue)
In this tutorial, we will create a realtime tic-tac-toe game using Python and Pusher channels. Here’s a demo of how the game will look and behave upon creation:
在本教程中,我们将使用Python和Pusher通道创建一个实时井字游戏。 以下是游戏制作后的外观和行为演示:
You will need Python 3+, virtualenv, and Flask installed on your machine.The advent of the PC and the internet has redefined the term “entertainment” and the means by which it can be obtained. While a console or some special hardware would have been required to play games in the past, games are only a click away in today’s world of technology.
您将需要在计算机上安装Python 3 +,virtualenv和Flask。PC和Internet的出现重新定义了“娱乐”一词及其获取方式。 尽管过去需要使用控制台或某些特殊的硬件才能玩游戏,但在当今的技术世界中,只需单击一下鼠标即可。
This multiplayer game will allow a player to connect using their preferred username (or generate a random username where a player doesn’t connect with a username) and choose to play with another player from a list of other online players.
这款多人游戏将允许玩家使用其首选用户名进行连接(或在不与用户名建立联系的情况下生成随机用户名),并从其他在线玩家列表中选择与另一位玩家一起玩。
The game itself follows the conventional principles of the popular tic-tac-toe game. The “online player(s)” feature is powered by Pusher presence channels and the realtime updates of a player’s move across multiple windows is powered by Pusher private channels. The source code for this tutorial is available here GitHub.
游戏本身遵循流行的井字游戏的传统原理。 “在线播放器”功能由Pusher存在通道支持 ,而播放器跨多个窗口的移动的实时更新由Pusher专用通道支持。 该教程的源代码可在GitHub上找到 。
Let’s get started.
让我们开始吧。
先决条件 (Prerequisites)
To follow along, a basic knowledge of Python, Flask, JavaScript (ES6 syntax) and Vue is required. You will also need the following installed on your machine:
接下来,需要具备Python,Flask,JavaScript(ES6语法)和Vue的基础知识。 您还将需要在计算机上安装以下软件:
Virtualenv is great for creating isolated Python environments, so we can install dependencies in an isolated environment without polluting our global packages directory.
Virtualenv非常适合创建隔离的Python环境,因此我们可以在隔离的环境中安装依赖项而不会污染我们的全局包目录。
搭建环境 (Setting up the environment)
We will create the project folder and activate a virtual environment within it:
我们将创建项目文件夹并在其中激活虚拟环境:
$ mkdir python-pusher-mutiplayer-game
$ cd python-pusher-mutiplayer-game
$ virtualenv .venv
$ source .venv/bin/activate # Linux based systems
$ \path\to\env\Scripts\activate # Windows users
We will install Flask using this command:
我们将使用以下命令安装Flask :
$ pip install flask
设置推送器 (Setting up Pusher)
To integrate Pusher into the multiplayer game, we need to create a Pusher channels application from the Pusher dashboard. If you don’t already have a Pusher account, head over to the Pusher website and create one.
要将Pusher集成到多人游戏中,我们需要从Pusher仪表板创建Pusher频道应用程序。 如果您还没有Pusher帐户,请转到Pusher网站并创建一个。
After creating an account, create a new channels application and enable client events from the application dashboard. To enable client events, click on App settings and scroll to the bottom of the page then select the option that says Enable client events, and update the App settings.
创建帐户后,创建一个新的渠道应用程序并从应用程序仪表板启用客户端事件。 要启用客户端事件,请单击“ 应用程序设置”并滚动到页面底部,然后选择“ 启用客户端事件 ”选项,然后更新应用程序设置。
构建后端服务器 (Building the backend server)
Back in the project directory, let’s install the Python Pusher library with this command:
回到项目目录,让我们使用以下命令安装Python Pusher库 :
$ pip install pusher
We will create a new file and call it app.py
, this is where we will write all the code for the Flask backend server. We will also create a folder and call it templates
, this folder will hold the markup files for this application.
我们将创建一个新文件并将其app.py
,这是我们将编写Flask后端服务器的所有代码的地方。 我们还将创建一个文件夹并将其称为templates