34

この問題についてここで多くの投稿を見てきましたが、この問題に対する完璧な答えはまだ見つかりませんでした.

テーブルビューがあり、各セルには再生ボタンがあります。ユーザーが再生ボタンをタップすると、UIWebViewこのセルに a が追加され、YouTube ビデオが再生されます。 

static NSString *youTubeVideoHTML = @"<html>\
    <body style=\"margin:0;\">\
        <iframe class=\"youtube-player\" type=\"text/html\" width=\"%0.0f\" height=\"%0.0f\" src=\"http://www.youtube.com/embed/%@\" frameborder=\"0\">\
        </iframe>\
    </body>\
    </html>";


- (void)playVideoWithId:(NSString *)videoId {
    NSString *html = [NSString stringWithFormat:youTubeVideoHTML, self.frame.size.width, self.frame.size.height, videoId];

    [self loadHTMLString:html baseURL:nil];
}

問題：

このコードは、実際には私が望むようにビデオを再生しません。YouTube プレーヤーを開始して、YouTube の赤い再生ボタンで表示するだけです。ユーザーが赤いボタンをタップした場合にのみ、ビデオの再生が開始されます。
そのため、ユーザーはビデオが始まるまで 2 つのボタンをタップする必要があります。これは最高のユーザー エクスペリエンスではありません...

私が言ったように、この問題に関する多くの投稿を見ましたが、まったく機能しないものもあれば、機能するものもありますが、私を悩ませている問題があります。

私が見つけた有効な解決策の 1 つは、@ilias によるこの投稿にありました。彼は、(私のように文字列ではなく) ファイルから HTML をロードしてこれを機能させる方法を示しています。このアプローチの問題は、私が再生するすべてのビデオに対して私がする必要があるのは:
htm ファイルをロードする -> ビデオ ID を埋め込む -> ファイルをディスクに書き込む -> ビデオを再生できるようになるのは今だけです。

奇妙なことに、このソリューションは、ファイルのコンテンツに等しい文字列からリクエストをロードしようとすると、ファイルから Web ビュー リクエストをロードした場合にのみ機能しますが、機能しません。

4

5 に答える 5

49

どうやら問題は nil ベース URL にあったようです。それを resourceURL に変更すると、自動再生が機能しました。

[self loadHTMLString:html baseURL:[[NSBundle mainBundle] resourceURL]];

YouTube動画を自動再生するための完全なコード（このコードも主にこの投稿に基づいています。ファイルではなく文字列からロードするように変更しました）： 

static NSString *youTubeVideoHTML = @"<!DOCTYPE html><html><head><style>body{margin:0px 0px 0px 0px;}</style></head> <body> <div id=\"player\"></div> <script> var tag = document.createElement('script'); tag.src = \"http://www.youtube.com/player_api\"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); var player; function onYouTubePlayerAPIReady() { player = new YT.Player('player', { width:'%0.0f', height:'%0.0f', videoId:'%@', events: { 'onReady': onPlayerReady, } }); } function onPlayerReady(event) { event.target.playVideo(); } </script> </body> </html>";  

- (void)playVideoWithId:(NSString *)videoId {
    NSString *html = [NSString stringWithFormat:youTubeVideoHTML, self.frame.size.width, self.frame.size.height, videoId];

    [self loadHTMLString:html baseURL:[[NSBundle mainBundle] resourceURL]];
}
于 2013-03-30T18:04:29.937 に答える
8

完全な解決策は次のとおりです。

//
//  S6ViewController.m
//  
//
//  Created by Ökkeş Emin BALÇİÇEK on 11/30/13.
//  Copyright (c) 2013 Ökkeş Emin BALÇİÇEK. All rights reserved.
//

#import "S6ViewController.h"

@interface S6ViewController ()

@end

@implementation S6ViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.

    [self playVideoWithId:@"sLVGweQU7rQ"];

}




- (void)playVideoWithId:(NSString *)videoId {

     NSString *youTubeVideoHTML = @"<html><head><style>body{margin:0px 0px 0px 0px;}</style></head> <body> <div id=\"player\"></div> <script> var tag = document.createElement('script'); tag.src = 'http://www.youtube.com/player_api'; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); var player; function onYouTubePlayerAPIReady() { player = new YT.Player('player', { width:'768', height:'1024', videoId:'sLVGweQU7rQ', events: { 'onReady': onPlayerReady } }); } function onPlayerReady(event) { event.target.playVideo(); } </script> </body> </html>";

    NSString *html = [NSString stringWithFormat:youTubeVideoHTML, videoId];

    UIWebView *videoView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, 768, 1024)];
    videoView.backgroundColor = [UIColor clearColor];
    videoView.opaque = NO;
    //videoView.delegate = self;
    [self.view addSubview:videoView];

    videoView.mediaPlaybackRequiresUserAction = NO;

    [videoView loadHTMLString:youTubeVideoHTML baseURL:[[NSBundle mainBundle] resourceURL]];
}

@end
于 2013-11-30T18:29:46.603 に答える
2

次のコードを使用して、YouTube ビデオをUIWebView

ここでは「埋め込みリンク」が必要です:

  • ブラウザでYouTubeリンクを開くだけです
  • 動画を右クリック
  • オプション「埋め込みコードを取得」を選択します

  • 次のような出力が得られます-

    <iframe width="640" height="390" src="https://www.youtube.com/embed/xtNXZA4XMBY" frameborder="0" allowfullscreen></iframe>

  • 「src」フィールドにリンクをコピーします。これが埋め込みリンクです

    この埋め込みリンクを、次のコードの「YOU_TUBE LINK」の場所に配置します。

    NSString *htmlString = [NSString stringWithFormat:@"<html><head><meta name = \"viewport\" content = \"initial-scale = 1.0, user-scalable = yes, width = 320\"/></head><body style=\"background:#00;margin-top:0px;margin-left:0px\"><div><object width=\"320\" height=\"480\"><param name=\"movie\" value=\"YOUTUBE_LINK\"></param><param name=\"wmode\" value=\"transparent\"></param><embed src=\"YOUTUBE_LINK\"type=\"application/x-shockwave-flash\" wmode=\"transparent\" width=\"320\" height=\"480\"></embed></object></div></body></html>"];

[self.webView_youTube loadHTMLString:htmlString baseURL:nil];
于 2015-06-15T05:58:27.900 に答える