Ajax简单应用之个人简历页面搭建
1.搭建HTTP静态Web服务器。
代码实现:
# 1.导入socket模块
import socket
import threading # 创建服务器类
class HttpServerSocket(object):
# 给服务器类的对象设置属性
def __init__(self):
# 2.创建Socket对象
self.server_socket = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
# 3.设置端口复用
self.server_socket.setsockopt(socket.SOL_SOCKET, socket.SO_REUSEADDR, True)
# 4.绑定端口
self.server_socket.bind(('', 8000))
# 5.设置监听
self.server_socket.listen(128) def start(self):
while True:
# 6.等待客户端连接
client_socket, ip_port = self.server_socket.accept()
# gevent.spawn(self.task, client_socket, ip_port)
print("上线了", ip_port)
threading.Thread(target=self.task, args=(client_socket, ip_port), daemon=True).start() def task(self, client_socket, ip_port):
# 7.接收数据
recv_data = client_socket.recv(1024).decode('utf-8')
print(recv_data)
if not recv_data:
print("客户端:%s下线了,端口号为:%s" % ip_port) # 8.发送数据
# 判断请求资源是否包含参数
# 请求行格式:GET /index.html HTTP/1.1
recv_path = recv_data.split()[1]
# print("第一次分割",recv_path)
# 如果有参数则以?分割
if '?' in recv_path:
real_recv_path = recv_path.split('?')[0]
# print("?分割",real_recv_path)
else:
# 如果没有参数,则保持请求路径不变
real_recv_path = recv_path
# print("无?分割",real_recv_path) # 设置没指定资源路径,默认返回index.html
if real_recv_path == '/':
real_recv_path = '/index.html' # 判断请求的资源路径是否存在
try:
with open(f"static{real_recv_path}", "rb") as file:
response_body = file.read()
except Exception as e:
# 如果不存在则返回404
response_line = 'HTTP/1.1 404 NOT FOUND\r\n'
response_header = 'Server: PWS/1.0\r\n'
response_body = 'sorry nor found page!\r\n'.capitalize()
send_data = (response_line + response_header + '\r\n' + response_body).encode('utf-8')
client_socket.send(send_data)
else:
# 如果存在则换回请求的页面信息
response_line = 'HTTP/1.1 200 OK\r\n'
response_header = 'Server: PWS/1.0\r\n'
send_data = (response_line + response_header + '\r\n').encode('utf-8') + response_body
client_socket.send(send_data)
finally:
# 断开与客户端连接
client_socket.close() def __del__(self):
# 当服务端程序结束时停止服务器服务
self.server_socket.close() def main():
http_socket = HttpServerSocket()
http_socket.start() if __name__ == '__main__':
main()
2.编写HTML页面:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Alax练习</title>
<script src="js/jquery-1.12.4.min.js"></script>
<script src="js/ajax.js"></script> </head>
<body>
<div id="div" style="text-align: center;"><h1>个人简历信息</h1></div>
<hr> <table>
<tr><td>个人照片:</td><td id="photo">无</td></tr>
<tr><td>姓名:</td><td id="name">无</td></tr>
<tr><td>年龄:</td><td id="age">无</td></tr>
<tr><td>毕业院校:</td><td id="school">无</td></tr>
<tr><td>专业:</td><td id="vocational">无</td></tr>
<tr><td>专攻语言:</td><td id="langage">无</td></tr>
<tr><td>开发经验:</td><td id="empiric">无</td></tr>
<tr><td>个人技能:</td><td id="habby">无</td></tr>
<tr><td>获奖信息:</td><td id="reward">无</td></tr>
</table>
<hr>
</body>
</html>
3.编写Ajax.js文件:
$(function(){
$.get('resume.json',{},function(response){
$('#photo').html("<img src='"+response[0]+"'>");
$('#name').html(response[1]);
$('#age').html(response[2]);
$('#school').html(response[3]);
$('#langage').html(response[4]);
$('#empiric').html(response[5]);
$('#habby').html(response[6]);
$('#reward').html(response[7]);
},'JSON').error(function(){
$('#div').html('<h1>对不起,请求错误!</h1>')
});
});
4.启动HTTP静态Web服务器,
访问http://127.0.0.1:8000/Ajax.html,
Ajax简单应用之个人简历页面搭建的更多相关文章
- 扩展auth_user字段、BBS需求分析、创建BBS数据库、注册页面搭建与用户头像展示及Ajax提交数据
昨日内容回顾 csrf跨站请求 1. SQL注入 2. xss攻击 3. csrf跨站请求 4. 密码加密(加盐) '''django中默认有一个中间件来验证csrf''' # 只针对post请求才验 ...
- ajax简单后台交互
ajax简单后台交互 1,扯淡 单身的生活,大部分时间享受自由,小部分时间忍受寂寞. 生活有时候,其实蛮苦涩,让人难以下咽.那些用岁月积累起来的苦闷,无处宣泄,在自己的脑海里蔓延成一片片荆棘,让你每每 ...
- AJAX载入外部JS文件到页面并让其执行的方法(附源码)
一. 向HTML页面中动态添加JS文件(从外部载入)并让其执行的两种方法 1.只适用于IE浏览器的简单方法: 先在文档中放置一张JS"空床"并添加ID:<script id= ...
- 和我一起打造个简单搜索之ElasticSearch集群搭建
我们所常见的电商搜索如京东,搜索页面都会提供各种各样的筛选条件,比如品牌.尺寸.适用季节.价格区间等,同时提供排序,比如价格排序,信誉排序,销量排序等,方便了用户去找到自己心里理想的商品. 站内搜索对 ...
- AJAX简单介绍
什么是AJAX Ajax 是 AsynchronousJavaScript and XML(以及 DHTML 等)的缩写. HTML 用于建立 Web表单并确定应用程序其它部分使用的字段. ·J ...
- ajax简单手写了一个猜拳游戏
使用ajax简单写一个猜拳游戏 HTML代码 <!DOCTYPE HTML> <html lang="en-US"> <head> <me ...
- javascript AJAX简单原理及什么是ajax
AJAX简单原理供初学者理解 AJAX的原理: Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用javascript来操作DOM而更新页面.这其 ...
- 仿联想商城laravel实战---3、前端页面搭建(什么情况下需要路由接参数)
仿联想商城laravel实战---3.前端页面搭建(什么情况下需要路由接参数) 一.总结 一句话总结: 比如访问课程的时候,不同的课程(比如云知梦),比如访问不同的商品,比如访问不同的分类 //商品详 ...
- BBS 页面搭建知识点整理
表关系图及建表 from django.db import models # Create your models here. from django.contrib.auth.models impo ...
随机推荐
- Xcode 7中http通信出现如下错误
Xcode 7中http通信出现如下错误:Application Transport Security has blocked a cleartext HTTP (http://) resource ...
- Grok Debugger安装配置
前言:由于使用ELK对日志进行集中管理,grok表达式无法验证是否正确,所以使用Grok Debugger进行调试,但是由于国外网站上不去(http://grokdebug.herokuapp.com ...
- 《Windows内核安全与驱动开发》 2.3 重要的数据结构
<Windows内核安全与驱动开发>阅读笔记 -- 索引目录 <Windows内核安全与驱动开发> 2.3 重要的数据结构 一.驱动对象 Windows内核采用__的编程方式 ...
- 微信小程序——动态修改页面数据(和样式)及参数传递
1.1.1动态修改页面数据 在小程序中我们经常要动态渲染数据,对于新手而言我们常常遇到修改的数据在控制台显示和页面显示不一致,因为我们用“=”修改数据的,这种是可以修改,但无法改变页面的状态的,还会造 ...
- shell du sh 文件大小输出
按照文件大小升序输出结果: du -sh * | sort -h 如果要逆序输出,则: du -sh * | sort -hr
- CNN卷积神经网络的构建
1.卷积神经网络由输入层,卷积层,激活函数,池化层,全连接层组成. input(输入层)--conv(卷积层)--relu(激活函数)--pool(池化层)--fc(全连接层) 2.卷积层: 主要用来 ...
- JMeter 实用插件配置
插件下载地址:链接 观察实时TPS,TRT,多用户负载图. 将 jpgc-graphs-dist-2.0.zip 解压缩至jmeter下的lib目录下,重启jmeter Transactions pe ...
- Java修炼——Set的子接口Vector的方法使用
Vector的方法和ArrayList相似 package com.bjsxt.Array; import java.util.Iterator; import java.util.List; imp ...
- Go语言学习之路
我关于Go语言的博客原本发布于我的个人网站:wwww.liwenzhouu.com.但是被某些人抄怕了,没办法只好搬运到博客园. 我的Go语言学习之路 2015年底我因为工作原因接触到了Go语言,那时 ...
- 机器学习预测时label错位对未来数据做预测
前言 这篇文章时承继上一篇机器学习经典模型使用归一化的影响.这次又有了新的任务,通过将label错位来对未来数据做预测. 实验过程 使用不同的归一化方法,不同得模型将测试集label错位,计算出MSE ...