Front-end application and database to explain

1, mysql database (to know)

What is the database: storage of data warehouse
database language: mysql sqlServer oracle ----> relational database, the number of non-relational database: mongoDB
data are stored in the database is structured data

Data in the database is stored in a table

A database can be stored in multiple data table
a table of rows and columns, the column header called the field

2, create a database of

create database database name

3. Create a table

Data Type: int length integer values necessary to provide
the string length needs to provide
char string char (100)
VARCHAR string varchar (100) variable length

Syntax to create tables:

create table  tablename
(
    字段名  数据类型,
    字段名    数据类型,
    ............
)

E.g:

create table teacher
(
        tid int,
        tname varchar(10),
        salary int
)

3, add or delete operation data in the table change search

adding data:

insert into  表名(字段名1,字段名2,...) values(值1,值2,....)

Returns the number of rows affected after adding operations performed

Delete the data:
delete from table name in the data with caution empty table
will return the number of rows affected after delete from table where condition to perform deletions
represent conditions Keywords:
and and age> 20 and sex = 'male'
or age or > 20 or sex = 'F'
= equal

Modify data:
Update the table name = value set field 1, field name = value 2 where operation is performed and modified condition will return the number of rows affected

Data query :
select
select * from table name look-up table all the data
select field name 1, field name 2 from table to query a specific field
select * from table where conditions query by the conditions

4, the primary key

Primary Key: ensure the uniqueness of the data in Table (data integrity) primary key
Primary Key features:
not repeat can not be empty
ships as a primary key table number of the column
is generally set to the primary key column will automatically increase

The number increment column as the primary key when you create the table:

create table products
(
    pid int primary key auto_increment,  主键自增
    pname varchar(100),
    price int,
    paddr varchar(100)
)

5, php mysql how

Additions and deletions [Case] student achievement tables change search operation php mysql
create the database: create database db1901
create two tables - Login and Registration

  create table user
    (
        uid int primary key auto_increment,
        uname varchar(100),
        upwd varchar(100)
)

Student achievement table

   create table score
    (
        sid int primary key auto_increment,
        sname varchar(100),
        h5 int,
        js int
)

// submit registration information through a form, and added to the database inside
 php operation mysql, increased data
// submit the login information via forms, queries the database to match the inside information
 php operation mysql, query, validate the data and complete the registration function
// transcripts submitted information through a form, and added to the database inside
Form submission data
 php operation mysql, increased data
// display the data in the database
Retrieved data in the database and displayed on the page
/ / php operation mysql, delete data, and update the database
 php operation mysql, delete data
php operation mysql, the database is updated

6, php Output Statement

echo
Print
print_r specifically for printing arrays

7, the value transmitted from the client to the server

Way: the value of the name attribute of the form pass
way: href Crossing hyperlink values
Three ways: using the data transfer ajax

8, what is ajax?

当从客户端向服务器端提交少量的数据、常见特效、验证用户名的唯一性、商品搜索、登录、注册等
ajax作用 : 页面无刷新 提高用户体检,减少带宽 ,提高程序的执行效率
异步的javaScript and xml,主要用于服务器和客户端的数据交互传值问题

9、ajax 工作流程(代码在服务器环境下进行)

10、同步和异步

异步 :同时分开执行 非阻塞模式 (前面的代码不会影响后面代码的执行)
同步 :同时按顺序执行  阻塞模式 (前面代码会影响后面代码的执行)

11\ajax操作步骤

1、创建ajax对象
var xhr = null;
if( XMLHttpRequest ){
xhr = new XMLHttpRequest();
}else{
xhr = new ActiveXObject(“Microsoft.XMLHTTP”);
}
2、建立和服务器的连接
open( “get/post” , 请求文件路径 url , 布尔值 )
第三个参数 : 表示同步 / 异步 true默认
xhr.open( “GOT”, “data.txt”)

get和post区别 :
get路径传值数据对用户是可见的传递的数据量少安全性低便于调试
post 非路径传值,数据对用户是不可见的,传递的数据量大安全性高

3、发送请求
Xhr.send()

4、服务器响应客户端的结果 (返回结果)
使用状态改变事件 onreadystatechange
处理服务器返回的结果 状态值 readyState
0 请求还没有初始化还没有open()
1 请求已发送服务器还没有开始处理
2 服务器接收请求后 没有处理数据
3 开始处理请求 部分请求已完成
4 所有请求全部完成

状态码 :status
200 交易成功
404 文件路径错误
500 服务器错误
400 服务器语法错误

服务器响应客户端请求时需要注意的两个问题 :
1、状态值判断
2、状态码的判断

Using ajax request data
2、缓存
当ajax多次请求同一个服务器路径数据时,第一次请求服务器时会将服务器文件的路径缓存到浏览器上,后面的多次请求如果路径不发生变化,直接从浏览器的缓存上获取数据
就会导致当服务器数据发生变化时,不能及时获取服务器更新后的数据

解决缓存问题 :
更改请求路径在请求路径上加一个参数,值为一个随机值可以使用 Math.random() 或 new Date().getTime()

扩展 :
更改文件最后的操作时间:
ajax.setRequestHeader( “If-Modified-Since”,“0” );

If-Modified-Since是标准的HTTP请求头标签,在发送HTTP请求时,把浏览器端缓存页面的最后修改时间一起发到服务器去,服务器会把这个时间与服务器上实际文件的最后修改时间进行比较。

如果时间一致,那么返回HTTP状态码304(不返回文件内容),客户端接到之后,就直接把本地缓存文件显示到浏览器中。

如果时间不一致,就返回HTTP状态码200和新的文件内容,客户端接到之后,会丢弃旧文件,把新文件缓存起来,并显示到浏览器中。

3、字符串和对象之间的转换

字符串转对象 :JSON.parse()
对象转字符串 : JSON.stringify()

4、接口
后端程序员为前端提供的路径url 就称为 接口
接口参数 :
接口路径url
接口返回值
接口是否含有参数

2、ajax的post方式(了解) 需要在apache服务器下运行
post 可以从服务器获取数据 同get
向服务器发送数据时 需要设置请求头
ajax.setRequestHeader( “content-type”,“application/x-www-form-urlencoded” );

3、同源策略
同源 : 同一个来源 协议、域名、端口号
http://localhost:80
http://127.0.0.1:80
http://localhost:8080
https://localhost:80 和上面的路径访问地址不一样跨域现象

同源策略: 是浏览器的一个安全机制 ,要保证用户数据的安全
当使用ajax访问服务器数据时,必须要保证访问路径的协议、域名、端口号和 ajax请求的路径保持一致

ajax 不能够跨域的原因是受同源策略的影响

4、如何解决前端跨域问题?? jsonp
什jsonp(json with padding) :利用script标签的src属性实现
jsonp如何实现跨域请求服务器数据 原理 :
1、动态创建一个script标签添加到body中
2、设置script标签的src值这个值一般是一个接口路径(服务器路径)该接口路径上会有一个参数代表一个回调函数
3、服务器通过对回调函数的调用完成数据的请求并将结果通过函数的参数返回

jsonp的接口和ajax接口区别 :
1、如果接口上有类似callback字样的参数就是jsonp接口,否则就是ajax接口
2、jsonp接口返回的数据是对象 原生ajax接口返回数据是字符串
3、jsonp只支持get方式请求数据 (路径传值)

服务器请求数据方式 :get post [ put delete ]

5、后端跨域 xhr2 CORS简称 xhr2(使用服务器解决的跨域) 后端(服务器)代理
跨域实现 : header(“Access-Control-Allow-Origin:*”); 表示在任何域下都可以访问该接口 这样的接口ajax就可以访问

Summary:
cross-domain way: jsonp xhr2 backend agent
front-end implementation across domains: jsonp
back-end implementation across domains: jsonp xhr2 (cors) backend agent

Learn several protocols
TCP (Transmission Control Protocol Transmission Control Protocol) is a connection-oriented, reliable transport layer protocol is byte-

A non-transport layer protocol UDP connections, providing transaction-oriented messaging service simply unreliable

HTTP is an application layer protocol, the main pack data address how a web server http protocol is the default protocol
http protocol features: https secure protocol
is a stateless protocol
-based protocol request response transmission path get request value of the amount of body data of the lower safety post request large high security
can not record the browser status
can transfer image files text sound

HTTP (hypertext transfer protocol) TCP protocol to transmit information between the two computers (typically a Web server and client) is utilized. Clients use a Web browser sends an HTTP request to the Web server, Web server sends the requested information to the client.

Server and client

Server: provides clients with services of a computer server software
server language: php --apache java - tomcat c # asp ---- iis
client language: javascript browser directly run

Guess you like

Origin blog.csdn.net/ZHANGJIN9546/article/details/93185304