您的位置：首页 > 理论基础 > 计算机网络

使用UIWebView与html实现网络请求

2015-05-02 12:09 811 查看

1.自带方法的缺点

发送http网络请求在日常开发中是一件很寻常的事，一般最常用的就是使用apple自带的NSURLConnection（使用第三方库的请忽视，因为第三方的包装确实带来了很多方便），使用NSURLConnection需要NSURLRequest来包装请求，发送普通的GET请求还是比较容易的，但是如果是POST请求，就有些繁琐，特别是在传送文件时，在不进行方法封装的情况下，那是一件工程量巨大的事情，总之真是一件繁琐的事。

当你使用过html提交过这些请求之后，你会不禁感叹，为什么事情可以如此得简单。那么我们可不可以用UIWebView也实现网页的提交功能呢？我们可以尝试一下。

2.开始尝试

首先使用Xcode新建一个工程，我们在默认的控制器中添加一个充满屏幕的UIWebView；然后让这个UIWebView成为控制器的一个成员变量，那么在控制器的类扩展部分，应该是这个样子的

@property (weak, nonatomic) IBOutlet UIWebView *webView;


然后我们在viewDidLoad中添加如下内容：

NSString *htmlString = @"<html><head><title>UIWebView与http</title><meta charset='utf-8'></head><body></br></br><br><form action='http://www.baidu.com' method='get'><input type='submit' value='提交'></form></body></html>";
[self.webView loadHTMLString:htmlString baseURL:nil];


运行之后，你会看见有一个提交按钮，点击之后，会打开百度的首页，这就是一个简单的GET请求

3.结合实际场景

似乎我们的代码量还是比较少的，但是结合实际的应用场景，这个请求的问题也是明显的，我们没有看到服务器返回的原始数据（比如说json字符串），为了继续验证我们猜想的可行性，我们需要在本地搭建一个服务器，我使用的是MAMP这个软件，这个软件将服务器的很多东西都集成好了，安装方便。安装好以后，新建一个名为UIWebView.php的文件，将这个文件放到MAMP安装目录下的htdocs内，用文本编辑器打开之后，写入一下内容：

<?php
$result = array();
if(isset($_GET["key_1"])){
$result = array(
"code" => "0",
"message" => "收到了GET参数, 提交上来的参数值为: " . $_GET["key_1"]
);
echo json_encode($result);
return;
}
if(isset($_POST["key_1"])){
if(isset($_FILES["file"])){
$result=array(
"code" => "0",
"message" => "收到了上传的文件, 提交上来的参数为: " . $_POST["key_1"]
);
echo json_encode($result);
return;
}else{
$result=array(
"code" => "0",
"message" => "收到了POST参数, 提交上来的参数值为: " . $_POST["key_1"]
);
echo json_encode($result);
return;
}
}
$result = array(
"code" => "100",
"message" => "参数传递错误"
);
echo json_encode($result);
?>


保存之后，启动mamp即可（我们提交的所有请求的参数名都是key_1，文件的参数名为file）

接下来，我们将我们的工程中的htmlString变为这个样子：

NSString *htmlString = @"<html><head><title>UIWebView与http</title><meta charset='utf-8'></head><body></br></br><br><form action='http://localhost:8888/UIWebView.php' method='get'><inpu
4000
t type='text' name='key_1'><input type='submit' value='提交'></form></body></html>";


运行之后，会看到一个文本输入框，输入几个字，点击提交按钮，稍等片刻，你会看见会出现一串字符，仔细观察，你会发现这就是我们熟悉的json字符串，感觉我们离我们的目标越来越近了，那么我们怎么才能把这些字符串提取出来，转化到我们程序中的变量呢？答案就是使用javascript，UIWebView提供了一个方法，叫做stringByEvaluatingJavaScriptFromString:通过这个方法，我们可以在得到服务器返回的json字符串之后，提取出网页的字符，转化到我们程序中的变量，那么首先我们实现UIWebView的代理方法webViewDidFinishLoad:，在这个方法中添加如下内容

NSString *javascriptString = @"document.getElementsByTagName(\"body\")[0].innerHTML";
NSString *resultString = [webView stringByEvaluatingJavaScriptFromString: javascriptString];
NSLog(@"%@",resultString);


运行提交，你会发现总共打印了两次，一次是UIWebView初次加载页面触发，一次是服务器返回结果后打印，可以看到第二次打印的内容就是一个json字符串，继续在刚才的方法里面添加内容：

NSDictionary *resultDictionary = [NSJSONSerialization JSONObjectWithData:[resultString dataUsingEncoding:NSUTF8StringEncoding] options:NSJSONReadingMutableLeaves error:nil];
NSLog(@"获得的字典是%@",resultDictionary);


同样，运行，提交，你可以看到在第二次的打印结果中我们获得了一个我们日常使用的数据字典。这正是我们期待的结果。至此，发送请求，获取结果我们都已经得到了我们的期望结果。接下来，我们可以试着发送些其他的东西，一般的POST请求与上传文件的POST

4.一般的POST

你只需要将viewDidLoad中的htmlString变成下面这个样子，运行，提交：

@"<html><head><title>UIWebView与http</title><meta charset='utf-8'></head><body></br></br><br><form action='http://localhost:8888/UIWebView.php' method='post'><input type='text' name='key_1'><input type='submit' name='submit' value='提交'></form></body></html>"


实际上也就是将字符串中method后面的get替换成了post，然后一个post请求就完成了

5.上传文件的POST

把htmlString变为下面的样子：

NSString *htmlString = @"<html><head><title>UIWebView与http</title><meta charset='utf-8'></head><body></br></br><br><form action='http://localhost:8888/UIWebView.php' method='post' enctype='multipart/form-data'><input type='file' name='file'><input type='text' name='key_1' value=""><input type='submit' value='FILE'></form></body></html>";


运行，提交，然后你会发现仅仅只是这么点代码，你的文件与参数都上传成功了，因为繁琐的拼接请求体的过程，UIWebView都已经替我们代劳了。

6.最后的一点补充

也许你会对我们的页面不太满意，觉得按钮太丑，但是这些都不是问题，只要通过CSS，你的页面不会逊色于原生的界面，因为我们本身只是在使用一个网页，网页能做成什么样子的，我们页面也是可以做成什么样子的，将UIWebView进行包装，可以实现正常的功能（比如UIWebView在得到返回字符传后，隐藏）。

优点：这样做出来的页面，发送请求确实很方便，我们几乎就是程序的使用者，而不是编写者，而且页面可以是动态的，可以由服务器返回的html字符串来决定，省去了不少本地的代码，

缺点：缺点也是很明显的，请求的自定义就变得有限了，如果用UIWebView的loadRequest方法，似乎和用NSURLConnection在复杂度上没有太大的区别了。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  网络请求 uiwebview 上传文件
相关文章推荐
新的分享
章节导航