IOS使用WebView内嵌H5页面,使用a标签点击跳转无效问题解决

在使用WKWebView加载H5时,给文字添加超链接,使其可以点击跳转到某个地址。发现在 IOS 的app内,a标签点击跳转没有作用,无法跳转到正确地址,decidePolicyForNavigationAction也无法抓取到点击事件。但安卓是可以正常跳转。

iOS的用户长按链接也是可以打开链接的,不过是打开了个菜单,可以跳转到了浏览器。

WKWebView 加载完链接后点击内部链接无法跳转,是因为<a href = "xxx" target = "_black"> 中的target = "_black" 是打开新的页面,所以无法在当前页面打开,需要在当前页重新加载url。

a 超连接中target:

  • _blank -- 在新窗口中打开链接
  • _parent -- 在父窗体中打开链接
  • _self -- 在当前窗体打开链接,此为默认值
  • _top -- 在当前窗体打开链接,并替换当前的整个窗体(框架页)

解决方案01:

将a标签中的target="_blank"删除,或改为target="_self"

解决方案02:

给a标签添加点击事件,如:

html 复制代码
<a @click="jumpToUrl" target="_blank"  />

jumpToUrl(){
	window.location.href = this.url
}

解决方案03:

objectivec 复制代码
// WKWebView调用window.open(url, "_blank");没有反应的问题
- (WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(nonnull WKWebViewConfiguration *)configuration forNavigationAction:(nonnull WKNavigationAction *)navigationAction windowFeatures:(nonnull WKWindowFeatures *)windowFeatures {
    if (!navigationAction.targetFrame.isMainFrame) {
//        这里是直接跳转
//        [webView loadRequest:navigationAction.request];
		// 以下是去浏览器中打开URL
        NSURL *url = navigationAction.request.URL;
        if (url) {
            // iOS 10及以后版本使用此方法
            UIApplication *application = [UIApplication sharedApplication];
            [application openURL:url options:@{} completionHandler:^(BOOL success) {
                if (success) {
                    // URL成功打开
                    NSLog(@"URL opened successfully");
                } else {
                    // URL打开失败,可能是URL无效或应用没有权限
                    NSLog(@"Failed to open URL");
                }
            }];
        } else {
            // URL字符串无效
            NSLog(@"Invalid URL string");
        }
    }
    return nil;
}

解决方案04:

objectivec 复制代码
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
{
    if (@available(iOS 11.0, *)) {
        WKHTTPCookieStore *cookieStore = webView.configuration.websiteDataStore.httpCookieStore;
        //get cookies
        //                [cookieStore getAllCookies:^(NSArray<NSHTTPCookie *> * _Nonnull cookies) {
        NSArray *cookies = [[NSHTTPCookieStorage sharedHTTPCookieStorage] cookies];
        for (id cookie in cookies) {
            [cookieStore setCookie:(NSHTTPCookie *)cookie completionHandler:nil];
        }
        //                }];
    } else {
        // Fallback on earlier versions
    }
    
    //如果是跳转一个新页面
    if (navigationAction.targetFrame == nil) {
//        这里是直接跳转
//        [webView loadRequest:navigationAction.request];
		// 以下是去浏览器中打开URL
        NSURL *url = navigationAction.request.URL;
        if (url) {
            // iOS 10及以后版本使用此方法
            UIApplication *application = [UIApplication sharedApplication];
            [application openURL:url options:@{} completionHandler:^(BOOL success) {
                if (success) {
                    // URL成功打开
                    NSLog(@"URL opened successfully");
                } else {
                    // URL打开失败,可能是URL无效或应用没有权限
                    NSLog(@"Failed to open URL");
                }
            }];
        } else {
            // URL字符串无效
            NSLog(@"Invalid URL string");
        }
    }
    decisionHandler(WKNavigationActionPolicyAllow);
}
相关推荐
前端老石人29 分钟前
前端开发中的 URL 完全指南
开发语言·前端·javascript·css·html
懋学的前端攻城狮2 小时前
iOS 列表性能优化实战:从 45fps 到 60fps 的蜕变
ios·性能优化·ui kit
jingqingdai32 小时前
别用正则格式化 HTML!我用 DOM 遍历实现零风险本地格式化,老项目重构效率直接拉满
前端·重构·html
斯班奇的好朋友阿法法2 小时前
鸿蒙 vs iOS vs 微信小程序:开发平台全面对比
ios·微信小程序·harmonyos
a1117764 小时前
“像风之翼“无人机巡检平台仪表盘
前端·javascript·开源·html·无人机
a1117764 小时前
QQ 宠物(怀旧 开源)前端electron项目
前端·开源·html
ZC跨境爬虫4 小时前
跟着 MDN 学 HTML day_8:(高级文本语义标签+适配核心功底)
前端·css·笔记·ui·html
Dxy12393102164 小时前
HTML中的伪类详解:从基础到高级应用的全面指南
前端·html
Dxy12393102164 小时前
HTML中如何设置元素样式:从基础到进阶的完整指南
前端·html
@大迁世界17 小时前
14个你现在必须关闭的 iOS 26 设置,不然手机很快被它榨干
macos·ios·智能手机·objective-c·cocoa