API封裝和token設定

2021-10-10 04:08:25 字數 2053 閱讀 1164

三、如何封裝?

總結在日常做專案請求介面時,在不同的元件都有不同的介面,要修改更換介面的時候要乙個個找,太不方便了,這時候我們就需要封裝api。

封裝api就相當於搞乙個的檔案或資料夾來統一管理你的介面路徑,在你修改查詢介面時更方便,也可以減少元件裡的**操作,是專案結構內容更加清晰。

token是服務端生成的一長串字串。相當於乙個通行令牌或是身份證,客戶端想要請求到服務端資料時要通過這個令牌才能拿到,是對使用者資訊的一種保護 (主要是登入註冊用得到)

token 完全由應用管理,所以它可以避開同源策略

token 可以避免 csrf 攻擊

token 可以是無狀態的,可以在多個服務間共享

在接下來初步封裝api 中會有具體**操作

現在src資料夾下建立乙個utils資料夾,在裡面建立乙個request.js檔案(檔案/資料夾名任取)

裡面**如下(示例):

//先引入axios

import axios from 'axios'

// 建立乙個axios例項,在這裡設定你的共用位址,超時時間

const server = axios.

create()

// 請求***

// 這裡可以設定請求頭,token,loading

server.interceptors.request.

use(

(config)

=>

return config})

//響應***

// 設定token過時,結束loading等

server.interceptors.response.

use(

(res)

=>

return res})

// 匯出

export default server

這時候直接在main.js中引入該檔案,再在要請求介面的元件中使用就可以了,具體使用如下

main.js中:

vue.prototype.$http = http元件中:

}}在建立乙個檔案,這裡主要是用來封裝請求資料的方法(get,post為例)和獲取資料的方法

**如下:

import request from

"./request"

// get請求方式

export

function

gets

(url,data))}

// post請求方式

export

function

posts

(url,data)

export

function

getlist()

使用方法(還是獲取之前的資料,效果一樣):

封裝api 就是為了讓你更好的管理你的介面請求,而token也能通過一種類似安全碼的方式減輕伺服器壓力,提高開發效率

最後:以上是我對於ap封裝和token的一些理解,如有不妥之處,還望不吝賜教。

Token和API封裝的理解

示例 token,就是令牌,最大的特點就是隨機性,不可 使用token的流程 使用基於 token 的身份驗證方法,在服務端不需要儲存使用者的登入記錄。大概的流程是這樣的 客戶端使用使用者名稱 密碼請求登入 服務端收到請求,去驗證使用者名稱 密碼 驗證成功後,服務端會簽發乙個 token,再把這個 ...

關於API封裝搭建,註冊登入和Token的理解

簡化使用成本。封裝是針對專案來說的,我們可以給定請求的主網域名稱 請求頭等預設值 減少使用請求時的需要傳的引數和其他配置等 現在根目錄中的src檔案中設定api檔案,在api檔案中設定以下檔案 在這裡可以設定請求攔截 響應攔截 如下 示例 import axios from axios import...

api封裝 搭建,註冊登入關於token的一些理解

作用 為了以後修改介面方便,如果專案很大,在每乙個頁面裡修改介面的話,很麻煩,所以封裝在乙個檔案裡,找起來也很方便 在 src 中新建乙個資料夾 util,util中新建兩個js檔案,乙個叫request.js,乙個叫api.js 在request中引入axios,然後穿件乙個axios的例項,在這...