聊一聊前端中常说的接口

聊一聊前端中常说的接口

平时总是听到前端中的接口这样的词，接下来简单说一下我对前端接口一些浅见。

1. 接口是前端提供的还是后端提供的

接口是后端提供的，前端负责调用这个接口。

后端提供接口，比如你登录，就把登录的账号，密码发送到后端，后端的程序拿到前端提交的用户名和密码后，拿去和数据库里面的值做比对，并把结果返回给你。

2. 什么是接口

下面的代码发起了一个 Ajax 请求，请求的 url 是 /api/headerList.json，请求类型是 GET，请求的文件是一个 json 文件。

这个 json 文件就是后端提供的一个接口，前端可以通过发起一个请求并获得里面的内容。

export const getList = () => {
  return (dispatch) => {
    axios.get('/api/headerList.json').then((res) => {
	  const data = res.data;
      const action = {  // 新建一个action
        type: 'change_list',
        data: data.data;  
      };
      dispatch(action); // 将新创建的action传给store
    }).catch(() => {
      console.log('error');
    })
  }
};

在真正的开发过程中，当前端需要服务器上的某个文件(数据)时，这个时候就需要和开发后端的小伙伴进行沟通了，我需要从哪里取数据呢？经过一番商量之后，咱们就约定在api文件夹下的headerList.json文件吧。

我(前端)在开发的时候就将 headerList.json 文件放到 api 目录下，你(后端)在开发的时候将处理后的 headerList.json 文件也放到 api 目录下。

愉快地开发完之后，到了上线的时间了，这时候前端把前端项目下的 api 目录删掉，使用后端提供的 api 目录下的 headerList.json 文件就可以了。

3. 总结

1. 接口其实就是一个 url，一般对应服务器上的某个文件，对这个 url 发起请求，经过后端的一些处理后会返回一些数据(格式一般为 json)。
2. 接口由后端提供，前端调用后端接口以获取后端数据。

完
如有不恰当之处，欢迎指正。