08-Flutter移動電商實戰-dio基礎_偽造請求頭獲取數據

在很多時候，后端為了安全都會有一些請求頭的限制，只有請求頭對了，才能正確返回數據。這雖然限制了一些人惡意請求數據，但是對于我們聰明的程序員來說，就是形同虛設。這篇文章就以極客時間 為例，講一下通過偽造請求頭，來獲取極客時間首頁主要數據。（不保證接口和安全措施一直可用哦，趕快練習吧）

查看極客時間的數據端口

如果你是一個前端，這套流程可能已經爛熟于心，先找出掘金的一個端口，來進行分析。

首先在瀏覽器端打開掘金網站（我用的是chrome瀏覽器：:https://time.geekbang.org/，然后按F12打開瀏覽器控制臺，來到NetWork選項卡，再選擇XHR選項卡，這時候刷新頁面就會出現異步請求的數據。我們選擇newAll這個接口來進行查看。

拷貝地址：https://time.geekbang.org/serv/v1/column/newAll

我們就以這個接口為案例，來獲取它的數據。

非法請求的實現

有了接口，我們把上節課的頁面進行一下改造。注意的是，這時候我們并沒有設置請求頭，為的是演示我們不配置請求頭時，是無法獲取數據的,它會返回一個451的錯誤。

451:就是非法請求，你的請求不合法，服務器決絕了請求，也什么都沒給我們返回。

代碼如下：

import?'package:flutter/material.dart';
import?'package:dio/dio.dart';


class?HomePage?extends?StatefulWidget?{
??_HomePageState?createState()?=>?_HomePageState();
}

class?_HomePageState?extends?State<HomePage>?{
??String?showText='還沒有請求數據';
??@override
??Widget?build(BuildContext?context)?{
????return?Container(
???????child:?Scaffold(
?????????appBar:?AppBar(title:?Text('請求遠程數據'),),
?????????body:?SingleChildScrollView(
???????????child:?Column(
?????????????children:?<Widget>[
???????????????RaisedButton(
?????????????????onPressed:?_jike,
?????????????????child:?Text('請求數據'),
???????????????),
???????????????Text(showText)
?????????????],
???????????),
?????????),
???????),
????);
??}

??void?_jike(){
????print('開始向極客時間請求數據..................');
????getHttp().then((val){
??????setState(()?{
???????showText=val['data'].toString();
??????});
????});
??}


??Future?getHttp()async{
????try{
??????Response?response;
??????Dio?dio?=?new?Dio();?
??????response?=await?dio.get("https://time.geekbang.org/serv/v1/column/newAll");
??????print(response);
??????return?response.data;
????}catch(e){
??????return?print(e);
????}
??}

}

這時候我們預覽，會返現控制臺無情的輸出了異常消息。

I/flutter?(?6942):?DioError?[DioErrorType.RESPONSE]:?Http?status?error?[451]
E/flutter?(?6942):?[ERROR:flutter/shell/common/shell.cc(184)]?Dart?Error:?Unhandled?exception

偽造請求頭

新建一個文件夾，起名叫作config，然后在里邊新建一個文件httpHeaders.dart,把請求頭設置好，請求頭可以在瀏覽器中輕松獲得，獲得后需要進行改造。

const?httpHeaders={
??'Accept':?'application/json,?text/plain,?*/*',
'Accept-Encoding':?'gzip,?deflate,?br',
'Accept-Language':?'zh-CN,zh;q=0.9',
'Connection':?'keep-alive',
'Content-Type':?'application/json',
'Cookie':?'_ga=GA1.2.676402787.1548321037;?GCID=9d149c5-11cb3b3-80ad198-04b551d;?_gid=GA1.2.359074521.1550799897;?_gat=1;?Hm_lvt_022f847c4e3acd44d4a2481d9187f1e6=1550106367,1550115714,1550123110,1550799897;?SERVERID=1fa1f330efedec1559b3abbcb6e30f50|1550799909|1550799898;?Hm_lpvt_022f847c4e3acd44d4a2481d9187f1e6=1550799907',
'Host':?'time.geekbang.org',
'Origin':?'https://time.geekbang.org',
'Referer':?'https://time.geekbang.org/',
'User-Agent':?'Mozilla/5.0?(Windows?NT?10.0;?Win64;?x64)?AppleWebKit/537.36?(KHTML,?like?Gecko)?Chrome/70.0.3538.77?Safari/537.36'
};

有了請求頭文件后，可以修改主體文件，修改就是引入請求頭文件，并進行設置，主要代碼就這兩句。

import?'../config/httpHeaders.dart';
dio.options.headers=?httpHeaders;

全部代碼如下：

import?'package:flutter/material.dart';
import?'../service/service_method.dart';

class?HomePage?extends?StatefulWidget?{
??@override
??_HomePageState?createState()?=>?_HomePageState();
}

class?_HomePageState?extends?State<HomePage>?{

??String?homePageContent?=?"正在獲取數據...";

??@override
??void?initState()?{
????getHomePageContent().then((val){
??????setState(()?{
????????homePageContent?=?val.toString();
??????});
????});
????super.initState();
??}

??@override
??Widget?build(BuildContext?context)?{
????return?Container(
??????child:?Scaffold(
????????appBar:?new?AppBar(title:?Text("百姓生活"),),
????????body:?SingleChildScrollView(
??????????child:?Text(homePageContent),
????????),
??????),
????);
??}

}

現在就可以正常獲取數據了。效果圖如下所示：

課程總結：

本節主要學習了Dio中如何通過偽造請求頭來獲取別人接口的數據，學會了這個是非常有用的，以后我們想自己作練習Demo時就不用為后端接口而犯愁了。

posted @ 2019-06-15 22:31 niceyoo 閱讀(...) 評論(...) 編輯 收藏 創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的08-Flutter移动电商实战-dio基础_伪造请求头获取数据的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。