- 前端 - HTML/CSS
html
游戏商城
<script src="game_shop.js"></script>
2. 前端 - JavaScript (AJAX请求) javascript // game_shop.js document.addEventListener('DOMContentLoaded', function() { fetch('/games') .then(response => response.json()) .then(games => { const gameList = document.getElementById('gameList'); games.forEach(game => { const li = document.createElement('li'); li.classList.add('game-item'); li.textContent = `${game.name} - ${game.price}`; gameList.appendChild(li); }); }) .catch(error => console.error('Error:', error)); }); 3. 后端 - Python Flask python # game_shop.py from flask import Flask, jsonify, request import sqlite3
app = Flask(name)
连接到SQLite数据库(这里假设已经有一个名为game_shop.db的数据库和games表)
conn = sqlite3.connect(‘game_shop.db’)
cursor = conn.cursor()
@app.route(‘/games’, methods=[‘GET’])
def get_games():
cursor.execute(“SELECT name, price FROM games”)
games = cursor.fetchall()
return jsonify([{‘name’: game[0], ‘price’: game[1]} for game in games])
if name == ‘main’:
app.run(debug=True)
4. 数据库 - SQLite
SQLite数据库可以通过命令行或图形界面工具(如DB Browser for SQLite)来创建和管理。以下是一个简单的SQL命令来创建games表:
sql
CREATE TABLE games (
id INTEGER PRIMARY KEY AUTOINCREMENT,
name TEXT NOT NULL,
price REAL NOT NULL
);
– 插入一些示例数据
INSERT INTO games (name, price) VALUES (‘游戏1’, 99.99);
INSERT INTO games (name, price) VALUES (‘游戏2’, 49.99);
请注意,这只是一个非常基础的示例,一个真实的游戏商城应用将需要更多的功能,如用户认证、购物车、订单处理、支付集成等。此外,为了安全起见,您应该使用更安全的数据库连接方法(如参数化查询)来防止SQL注入攻击,并在生产环境中禁用Flask的调试模式。由于“游戏商城”的代码涉及多个部分(前端、后端、数据库等),且由于篇幅限制,我将为您提供各个部分的简化示例,分别使用HTML/CSS(前端)、JavaScript(前端逻辑和AJAX请求)、Python的Flask框架(后端)和SQLite(数据库)。
- 前端 - HTML/CSS
html
游戏商城
<script src="game_shop.js"></script>
2. 前端 - JavaScript (AJAX请求) javascript // game_shop.js document.addEventListener('DOMContentLoaded', function() { fetch('/games') .then(response => response.json()) .then(games => { const gameList = document.getElementById('gameList'); games.forEach(game => { const li = document.createElement('li'); li.classList.add('game-item'); li.textContent = `${game.name} - ${game.price}`; gameList.appendChild(li); }); }) .catch(error => console.error('Error:', error)); }); 3. 后端 - Python Flask python # game_shop.py from flask import Flask, jsonify, request import sqlite3
app = Flask(name)
连接到SQLite数据库(这里假设已经有一个名为game_shop.db的数据库和games表)
conn = sqlite3.connect(‘game_shop.db’)
cursor = conn.cursor()
@app.route(‘/games’, methods=[‘GET’])
def get_games():
cursor.execute(“SELECT name, price FROM games”)
games = cursor.fetchall()
return jsonify([{‘name’: game[0], ‘price’: game[1]} for game in games])
if name == ‘main’:
app.run(debug=True)
4. 数据库 - SQLite
SQLite数据库可以通过命令行或图形界面工具(如DB Browser for SQLite)来创建和管理。以下是一个简单的SQL命令来创建games表:
sql
CREATE TABLE games (
id INTEGER PRIMARY KEY AUTOINCREMENT,
name TEXT NOT NULL,
price REAL NOT NULL
);
– 插入一些示例数据
INSERT INTO games (name, price) VALUES (‘游戏1’, 99.99);
INSERT INTO games (name, price) VALUES (‘游戏2’, 49.99);
请注意,这只是一个非常基础的示例,一个真实的游戏商城应用将需要更多的功能,如用户认证、购物车、订单处理、支付集成等。此外,为了安全起见,您应该使用更安全的数据库连接方法(如参数化查询)来防止SQL注入攻击,并在生产环境中禁用Flask的调试模式。