Xamarin iOS WebView用HTML5Player播本地视频：file://协议无效

我之前在做Xamarin跨平台项目时，也碰到过iOS端WebView加载本地视频的坑——确实直接用file://路径会被WKWebView的安全策略拦住。下面给你一套结合TypeScript前端代码和Xamarin iOS原生配置的解决方案，亲测有效：

前端TypeScript代码 #

首先在WebView的前端代码里，我们不用file://，而是用自定义的URL协议（比如app-local://）来指向本地视频，这样可以绕过iOS的安全限制：

// 生成自定义协议的本地视频URL
function getLocalVideoUrl(relativeFilePath: string): string {
    // 把本地相对路径转成自定义协议格式，注意替换反斜杠为正斜杠
    return `app-local://${relativeFilePath.replace(/\\/g, '/')}`;
}

// 初始化HTML5视频播放器
function setupLocalVideoPlayer() {
    const videoElement = document.getElementById('local-video') as HTMLVideoElement;
    if (!videoElement) return;

    // 这里填你的视频相对路径（相对于iOS的Documents目录）
    const localVideoPath = "videos/demo.mp4";
    videoElement.src = getLocalVideoUrl(localVideoPath);
    videoElement.controls = true;
    videoElement.load();
}

// 页面加载完成后初始化播放器
document.addEventListener('DOMContentLoaded', setupLocalVideoPlayer);

对应的HTML部分（如果需要）：

<video id="local-video" width="100%" height="auto"></video>

Xamarin iOS原生配置（必须配合） #

iOS的WKWebView不会自动处理我们自定义的app-local://协议，所以需要在原生代码里添加一个URL Scheme Handler，拦截这个协议的请求，读取本地文件并返回给WebView：

// 在创建WKWebView时配置自定义Scheme Handler
var webViewConfig = new WKWebViewConfiguration();
// 注册处理"app-local"协议的Handler
webViewConfig.SetURLSchemeHandler(new LocalFileSchemeHandler(), "app-local");

// 创建WKWebView并添加到视图
var webView = new WKWebView(View.Bounds, webViewConfig);
View.AddSubview(webView);

// 自定义Scheme Handler的实现类
public class LocalFileSchemeHandler : NSObject, IWKURLSchemeHandler
{
    public void StartURLSchemeTask(WKWebView webView, IWKURLSchemeTask task)
    {
        var requestUrl = task.Request.Url;
        // 提取协议后的相对路径（去掉开头的"/"）
        var relativePath = requestUrl.Path.Substring(1);
        
        // 获取iOS设备上的Documents目录路径
        var documentsDir = Environment.GetFolderPath(Environment.SpecialFolder.MyDocuments);
        var fullFilePath = Path.Combine(documentsDir, relativePath);

        if (File.Exists(fullFilePath))
        {
            // 读取视频文件数据
            var fileBytes = File.ReadAllBytes(fullFilePath);
            var nsData = NSData.FromArray(fileBytes);
            
            // 构造响应，指定正确的MIME类型
            var mimeType = GetVideoMimeType(fullFilePath);
            var response = new WKURLResponse(requestUrl.AbsoluteString, mimeType, fileBytes.Length, null);
            
            // 把数据返回给WebView
            task.DidReceiveResponse(response);
            task.DidReceiveData(nsData);
            task.DidFinish();
        }
        else
        {
            // 文件不存在时返回错误
            var error = new NSError(new NSString("FileNotFound"), 404);
            task.DidFailWithError(error);
        }
    }

    public void StopURLSchemeTask(WKWebView webView, IWKURLSchemeTask task)
    {
        // 可选：任务取消时做一些清理工作
    }

    // 根据文件扩展名返回对应的MIME类型
    private string GetVideoMimeType(string filePath)
    {
        var extension = Path.GetExtension(filePath).ToLower();
        return extension switch
        {
            ".mp4" => "video/mp4",
            ".mov" => "video/quicktime",
            ".m4v" => "video/x-m4v",
            ".avi" => "video/x-msvideo",
            _ => "application/octet-stream"
        };
    }
}

关键注意事项 #

• 文件路径一致性：确保你的视频文件已经复制到iOS的Documents目录（或者你指定的其他目录），比如可以在Xamarin项目启动时把嵌入的视频文件复制到Documents下的videos文件夹。
• Scheme名称统一：前端和原生端的自定义Scheme名称要完全一致（比如例子里的app-local），不能有拼写错误。
• MIME类型正确：一定要返回对应视频格式的MIME类型，否则HTML5视频播放器可能无法识别并播放。

内容的提问来源于stack exchange，提问作者Daniel Hanke